feat: better unlock (#9546)

* change lock label

* feat: add unlock logic for single units on pointer up

* feat: add unlock popup

* fix: linting errors

* style: padding tweaks

* style: remove redundant line

* feat: lock multiple units together

* style: tweak color & position

* feat: add highlight for locked elements

* feat: select groups correctly after unlocking

* test: update snapshots

* fix: lasso from selecting locked elements

* fix: should prevent selecting unlocked elements and setting locked id at the same time

* fix: reset hit locked id immediately when appropriate

* feat: capture locked units in delta

* test: update locking test

* feat: show lock highlight when locking (including undo/redo)

* feat: make locked highlighting consistent

* feat: show correct cursor type when moving over locked elements

* fix history

* remove `lockedUnits.singleUnits`

* tweak button

* do not render UnlockPopup if not locked element selected

* tweak actions

* refactor: simplify type

* refactor: rename type

* refactor: simplify hit element setting & checking

* fix: prefer locked over link

* rename to `activeLockedId`

* refactor: getElementAtPosition takes an optional hitelments array

* fix: avoid setting active locked id after resizing

---------

Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
This commit is contained in:
Ryan Di
2025-05-21 21:57:12 +10:00
committed by GitHub
co-authored by dwelle
parent 41a7613dff
commit 712f267519
19 changed files with 843 additions and 109 deletions
@@ -3,6 +3,7 @@
exports[`contextMenu element > right-clicking on a group should select whole group > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -935,6 +936,7 @@ exports[`contextMenu element > right-clicking on a group should select whole gro
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -1078,6 +1080,7 @@ exports[`contextMenu element > right-clicking on a group should select whole gro
exports[`contextMenu element > selecting 'Add to library' in context menu adds element to library > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -1136,6 +1139,7 @@ exports[`contextMenu element > selecting 'Add to library' in context menu adds e
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -1292,6 +1296,7 @@ exports[`contextMenu element > selecting 'Add to library' in context menu adds e
exports[`contextMenu element > selecting 'Bring forward' in context menu brings element forward > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -1350,6 +1355,7 @@ exports[`contextMenu element > selecting 'Bring forward' in context menu brings
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -1623,6 +1629,7 @@ exports[`contextMenu element > selecting 'Bring forward' in context menu brings
exports[`contextMenu element > selecting 'Bring to front' in context menu brings element to front > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -1681,6 +1688,7 @@ exports[`contextMenu element > selecting 'Bring to front' in context menu brings
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -1954,6 +1962,7 @@ exports[`contextMenu element > selecting 'Bring to front' in context menu brings
exports[`contextMenu element > selecting 'Copy styles' in context menu copies styles > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -2012,6 +2021,7 @@ exports[`contextMenu element > selecting 'Copy styles' in context menu copies st
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -2168,6 +2178,7 @@ exports[`contextMenu element > selecting 'Copy styles' in context menu copies st
exports[`contextMenu element > selecting 'Delete' in context menu deletes element > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -2226,6 +2237,7 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -2407,6 +2419,7 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen
exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates element > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -2465,6 +2478,7 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -2707,6 +2721,7 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates
exports[`contextMenu element > selecting 'Group selection' in context menu groups selected elements > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -2765,6 +2780,7 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -3077,6 +3093,7 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group
exports[`contextMenu element > selecting 'Paste styles' in context menu pastes styles > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -3135,6 +3152,7 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -3558,6 +3576,7 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s
exports[`contextMenu element > selecting 'Send backward' in context menu sends element backward > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -3616,6 +3635,7 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -3881,6 +3901,7 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e
exports[`contextMenu element > selecting 'Send to back' in context menu sends element to back > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -3939,6 +3960,7 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -4204,6 +4226,7 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el
exports[`contextMenu element > selecting 'Ungroup selection' in context menu ungroups selected group > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -4262,6 +4285,7 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -4609,6 +4633,7 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung
exports[`contextMenu element > shows 'Group selection' in context menu for multiple selected elements > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -5541,6 +5566,7 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -5828,6 +5854,7 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi
exports[`contextMenu element > shows 'Ungroup selection' in context menu for group inside selected elements > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -6760,6 +6787,7 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -7094,6 +7122,7 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro
exports[`contextMenu element > shows context menu for canvas > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -7693,6 +7722,7 @@ exports[`contextMenu element > shows context menu for canvas > [end of test] app
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -7759,6 +7789,7 @@ exports[`contextMenu element > shows context menu for canvas > [end of test] und
exports[`contextMenu element > shows context menu for element > [end of test] appState 1`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -8691,6 +8722,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,
@@ -8748,6 +8780,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
exports[`contextMenu element > shows context menu for element > [end of test] appState 2`] = `
{
"activeEmbeddable": null,
"activeLockedId": null,
"activeTool": {
"customType": null,
"fromSelection": false,
@@ -9680,6 +9713,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"lockedMultiSelections": {},
"multiElement": null,
"name": "Untitled-201933152653",
"newElement": null,