diff --git a/packages/blocks/src/root-block/edgeless/components/component-toolbar/component-toolbar.ts b/packages/blocks/src/root-block/edgeless/components/component-toolbar/component-toolbar.ts index 0300fb70f757..85609fc93315 100644 --- a/packages/blocks/src/root-block/edgeless/components/component-toolbar/component-toolbar.ts +++ b/packages/blocks/src/root-block/edgeless/components/component-toolbar/component-toolbar.ts @@ -500,7 +500,7 @@ export class EdgelessComponentToolbar extends WithDisposable(LitElement) { this._ImageButton(image), ].filter(b => !!b && b !== nothing); - if (elements.length > 1) { + if (elements.length > 1 && elements.length !== connector?.length) { buttons.unshift(this._Divider()); buttons.unshift(this._AlignButton()); buttons.unshift(this._Divider()); diff --git a/packages/blocks/src/root-block/edgeless/components/connector/connector-handle.ts b/packages/blocks/src/root-block/edgeless/components/connector/connector-handle.ts index 67815cc03d71..1b54c058d7a9 100644 --- a/packages/blocks/src/root-block/edgeless/components/connector/connector-handle.ts +++ b/packages/blocks/src/root-block/edgeless/components/connector/connector-handle.ts @@ -23,11 +23,11 @@ export class EdgelessConnectorHandle extends WithDisposable(LitElement) { z-index: 10; pointer-events: all; /** - * Fix: pointerEvent stops firing after a short time. - * When a gesture is started, the browser intersects the touch-action values of the touched element and its ancestors, - * up to the one that implements the gesture (in other words, the first containing scrolling element) - * https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action - */ + * Fix: pointerEvent stops firing after a short time. + * When a gesture is started, the browser intersects the touch-action values of the touched element and its ancestors, + * up to the one that implements the gesture (in other words, the first containing scrolling element) + * https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action + */ touch-action: none; } .line-controller-hidden { @@ -107,12 +107,10 @@ export class EdgelessConnectorHandle extends WithDisposable(LitElement) { const { path } = this.connector; const zoom = service.viewport.zoom; const start = { - position: 'absolute', left: `${path[0][0] * zoom}px`, top: `${path[0][1] * zoom}px`, }; const end = { - position: 'absolute', left: `${path[path.length - 1][0] * zoom}px`, top: `${path[path.length - 1][1] * zoom}px`, }; diff --git a/packages/blocks/src/root-block/edgeless/components/rects/edgeless-selected-rect.ts b/packages/blocks/src/root-block/edgeless/components/rects/edgeless-selected-rect.ts index 0272395a360e..3bd436b29e80 100644 --- a/packages/blocks/src/root-block/edgeless/components/rects/edgeless-selected-rect.ts +++ b/packages/blocks/src/root-block/edgeless/components/rects/edgeless-selected-rect.ts @@ -421,11 +421,11 @@ export class EdgelessSelectedRect extends WithDisposable(LitElement) { private _selectedRect: SelectedRect = { width: 0, height: 0, - borderWidth: 0, - borderStyle: 'solid', left: 0, top: 0, rotate: 0, + borderWidth: 0, + borderStyle: 'solid', }; @state() @@ -502,6 +502,7 @@ export class EdgelessSelectedRect extends WithDisposable(LitElement) { const elements = this.selection.elements; let areAllConnectors = true; + let areAllIndependentConnectors = elements.length > 1; let areAllShapes = true; let areAllTexts = true; @@ -522,8 +523,14 @@ export class EdgelessSelectedRect extends WithDisposable(LitElement) { areAllTexts = false; } else { assertType(element); - if (element.type !== CanvasElementType.CONNECTOR) + if (element.type === CanvasElementType.CONNECTOR) { + const connector = element as ConnectorElementModel; + areAllIndependentConnectors &&= !( + connector.source.id || connector.target.id + ); + } else { areAllConnectors = false; + } if ( element.type !== CanvasElementType.SHAPE && element.type !== CanvasElementType.GROUP @@ -533,7 +540,14 @@ export class EdgelessSelectedRect extends WithDisposable(LitElement) { } } - if (areAllConnectors) return 'none'; + if (areAllConnectors) { + if (areAllIndependentConnectors) { + return 'all'; + } else { + return 'none'; + } + } + if (areAllShapes) return 'all'; if (areAllTexts) return 'edgeAndCorner'; @@ -901,13 +915,13 @@ export class EdgelessSelectedRect extends WithDisposable(LitElement) { } this._selectedRect = { - width: width, - height: height, - borderWidth: selection.editing ? 2 : 1, - borderStyle: 'solid', + width, + height, left, top, rotate, + borderStyle: 'solid', + borderWidth: selection.editing ? 2 : 1, }; }, this); @@ -1113,7 +1127,8 @@ export class EdgelessSelectedRect extends WithDisposable(LitElement) { : nothing; const elementHandle = - elements.length > 1 + elements.length > 1 && + !elements.reduce((p, e) => p && e instanceof ConnectorElementModel, true) ? elements.map(element => { const [modelX, modelY, w, h] = deserializeXYWH(element.xywh); const [x, y] = edgeless.service.viewport.toViewCoord( diff --git a/packages/blocks/src/root-block/edgeless/edgeless-root-service.ts b/packages/blocks/src/root-block/edgeless/edgeless-root-service.ts index 9e0e3bd3c35b..dc432a103982 100644 --- a/packages/blocks/src/root-block/edgeless/edgeless-root-service.ts +++ b/packages/blocks/src/root-block/edgeless/edgeless-root-service.ts @@ -262,7 +262,6 @@ export class EdgelessRootService extends RootService { this._surface.updateElement(id, props); } else if (this.doc.getBlockById(id)) { const block = this.doc.getBlockById(id)!; - this.editSession.record(block.flavour as EdgelessElementType, props); this.doc.updateBlock(block, props); }