Commit Graph

61 Commits

Author SHA1 Message Date
Saul-Mirone
66ea3038af refactor(editor): align rich text util apis (#11039) 2025-03-20 10:40:11 +00:00
fundon
27a8afa33f chore(editor): remove redundant line styles components (#10980)
* Moved `edgeless-line-styles-panel` and `edgeless-line-width-panel` into components pkg
2025-03-20 09:48:02 +00:00
L-Sun
da63d51b7e refactor(editor): group and expose parameters of createButtonPopper (#10999) 2025-03-20 08:37:59 +00:00
Saul-Mirone
92d76ba571 refactor(editor): merge inline to std (#11025) 2025-03-20 05:46:56 +00:00
Saul-Mirone
75580e881b refactor(editor): move gfx frame title to widget (#11021) 2025-03-20 04:10:56 +00:00
fundon
b88e7f0e35 chore(editor): remove redundant card-style-panel component (#10973)
Moved `CardStylePanel` into `CardStyleDropdownMenu`.
2025-03-20 02:08:22 +00:00
fundon
1c0c698375 chore(editor): remove redundant edgeless-align-panel component (#10972) 2025-03-20 02:08:22 +00:00
fundon
8b995ea420 chore(editor): remove edgeless element toolbar (#10900) 2025-03-20 02:08:21 +00:00
fundon
831f290f84 refactor(editor): edgeless toolbar chevron down icon (#10898) 2025-03-20 02:08:20 +00:00
fundon
a7acd5c5b1 refactor(editor): fix edgeless toolbar theme (#10897) 2025-03-20 02:08:20 +00:00
fundon
ccc210f88a refactor(core): edgeless toolbar ai action config extension (#10884) 2025-03-20 02:08:19 +00:00
fundon
a004a2cfab refactor(editor): edgeless toolbar more actions (#10882) 2025-03-20 02:08:18 +00:00
fundon
39704aac66 refactor(editor): edgeless toolbar alignment actions (#10881) 2025-03-20 02:08:18 +00:00
fundon
e4b8b367ce refactor(editor): edgeless toolbar add frame action (#10880) 2025-03-20 02:08:17 +00:00
fundon
4a4893a380 refactor(editor): edgeless toolbar add group action and release group action (#10879) 2025-03-20 02:08:17 +00:00
fundon
07a64eb004 refactor(editor): edgeless toolbar lock and unlock actions (#10878) 2025-03-20 02:08:16 +00:00
fundon
bd9b78f7d2 refactor(editor): edgeless toolbar quick connect action (#10876) 2025-03-20 02:08:16 +00:00
fundon
54bc60aa4d refactor(editor): edgeless shape toolbar config extension (#10821) 2025-03-20 02:08:16 +00:00
fundon
1acc7e5a9e refactor(editor): edgeless text toolbar config extension (#10811) 2025-03-20 02:08:15 +00:00
Saul-Mirone
cdd405bbe5 refactor(editor): improve edgeless editors (#11019) 2025-03-20 01:49:56 +00:00
Saul-Mirone
258c70cf07 refactor(editor): store should not rely on inline (#11017) 2025-03-20 01:33:29 +00:00
Saul-Mirone
76dc55f328 refactor(editor): remove legacy block service spec slots (#11013) 2025-03-20 01:04:18 +09:00
doouding
1c8d25bc29 feat: add ElementTransformManager for edgeless element basic manipulation (#10824)
### Overview:
We've been working with some legacy code in the default-tool and edgeless-selected-rect modules, which are responsible for fundamental operations like moving, resizing, and rotating elements. Currently, these operations are hardcoded, making it challenging to extend functionalities without diving deep into the code.

### What's Changing:
Introducing `ElementTransformManager` to streamline the handling of basic transformations (move, resize, rotate) while allowing the business logic to dictate when these actions occur.

Providing two ways to extend the transformations behaviour:
- Extends inside element view definition: Elements can decide how to handle move/resize events, such as enforcing size constraints.
- Extension mechanism provided by this manager: Adjust or completely override default drag behaviors, like snapping elements into alignment.

### Code Examples:
Delegate element movement to TransformManager:
```typescript
class DefaultTool {
  override dragStart(event) {
    if(this.dragType === DragType.ContentMoving) {
      const transformManager = this.std.get(TransformManagerIdentifier);
      transformManager.startDrag({ selectedElements, event });
    }
  }
}
```

 Enforce minimum width inside view definition:
```typescript
class EdgelessNoteBlock extends GfxBlockComponent {
  onResizeDelta({ dw, dh }) {
    const bound = this.model.elementBound;
    bound.w = Math.min(MAX_WIDTH, bound.w + dw);
    bound.h = Math.min(MAX_HEIGHT, bound.h + dh);
    this.model.xywh = bound.serialize();
  }
}
```

Use extension to implement element snapping:
```typescript
import { TransformerExtension } from '@blocksuite/std/gfx';

// Just extends the TransformerExtension
class SnapManager extends TransformerExtension {
  static override key = 'snap-manager';
  onDragInitialize() {
    return {
      onDragMove(context) {
        const { dx, dy } = this.getAlignmentMoveDistance(context.elements);
        context.dx = dx;
        context.dy = dy;
      }
    }
  }
}
```

### Others

The migration will be divided into several PRs. This PR mostly focus on refactoring elements movement part of `default-tool`.
- Delegate elements movement to `TransformManager`
- Rewrite the default tool extension into `TransformManager` extension
- Add drag handler interface to gfx view (both `GfxBlockComponent` and `GfxElementModelView`) to allow element to define how it gonna react on drag
2025-03-19 15:30:06 +00:00
fundon
c98f0900cc refactor(editor): edgeless mindmap toolbar config extension (#10803) 2025-03-19 14:50:55 +00:00
fundon
7f34667b78 refactor(editor): edgeless connector toolbar config extension (#10798) 2025-03-19 14:50:55 +00:00
fundon
03ffc688c3 refactor(editor): edgeless brush toolbar config extension (#10796) 2025-03-19 12:34:19 +00:00
fundon
c44a339bd9 refactor(editor): edgeless group toolbar config extension (#10787) 2025-03-19 12:34:19 +00:00
fundon
f87cc0f599 refactor(editor): edgeless frame toolbar config extension (#10769) 2025-03-19 12:34:18 +00:00
fundon
e320552594 refactor(editor): edgeless note toolbar config extension (#10719) 2025-03-19 12:34:18 +00:00
fundon
b5406fa57a refactor(editor): edgeless image toolbar config extension (#10718) 2025-03-19 12:34:18 +00:00
fundon
e686a6aecc refactor(editor): edgeless internal embed card toolbar config extension (#10717) 2025-03-19 12:34:17 +00:00
L-Sun
9211fbf68c refactor(editor): move surface-ref toolbar to its block folder (#10938) 2025-03-19 10:54:22 +00:00
fundon
7f4b56e05c refactor(editor): edgeless external embed card toolbar config extension (#10712) 2025-03-19 04:05:36 +00:00
donteatfriedrice
3a2d386275 feat(editor): support add embed iframe block in mobile (#10955)
To close [BS-2664](https://linear.app/affine-design/issue/BS-2664/iframe-embed-block-移动端支持)
2025-03-19 02:58:51 +00:00
fundon
d8567e669a refactor(editor): edgeless bookmark toolbar config extension (#10711) 2025-03-19 02:24:26 +00:00
fundon
251d1d8782 refactor(editor): edgeless attacment toolbar config extension (#10710) 2025-03-19 00:52:22 +00:00
fundon
3cce147c60 refactor(editor): improve query methods in toolbar context (#10714) 2025-03-19 00:52:22 +00:00
fundon
cb37d25d7b refactor(editor): edgeless element toolbar with new pattern (#10511) 2025-03-18 15:36:25 +00:00
Saul-Mirone
321e3449ec fix(editor): block can be null in widget (#10959)
Closes: [BS-2826](https://linear.app/affine-design/issue/BS-2826/typeerror-thisblock-is-null)
2025-03-18 10:58:19 +00:00
Saul-Mirone
3de7d85eea feat(editor): improve api for store, and add docs (#10941) 2025-03-17 16:30:59 +00:00
L-Sun
3dbeebd6ba fix(editor): background of surface-ref disappeared when it was re-rendered (#10931)
This PR fixed the background of surface-ref dis
2025-03-17 14:00:17 +00:00
L-Sun
d80f1e8067 feat(editor): insert a blank frame slash menu action (#10899)
Close [BS-2517](https://linear.app/affine-design/issue/BS-2517/%E6%B7%BB%E5%8A%A0frame%E5%85%A5%E5%8F%A3)

### What changes:
- add a insert blank frame action to slash menu
- move `EdgelessFrameManager` and `FrameOverlay` extensions to `FrameBlockSpec`
- make `FrameBlockSpec` as a part of `CommonBlockSpecs` such that we can use `EdgelessFrameManager` to create a frame more easily

https://github.com/user-attachments/assets/ddff5866-8933-4ce5-aaf4-873661407ee4
2025-03-17 10:32:55 +00:00
Saul-Mirone
7e6ff8d9c6 chore(editor): remove unused npm scripts (#10895) 2025-03-16 17:48:49 +00:00
Saul-Mirone
26285f7dcb feat(editor): unify block props api (#10888)
Closes: [BS-2707](https://linear.app/affine-design/issue/BS-2707/统一使用props获取和更新block-prop)
2025-03-16 05:48:34 +00:00
Oleg
8f9e5bf0aa fix(editor): minor ui bugs (#10841)
Co-authored-by: Mirone <Saul-Mirone@outlook.com>
2025-03-15 19:15:56 +09:00
donteatfriedrice
1d4ee1e383 feat(editor): support embed iframe block in edgeless (#10830)
To close:
[BS-2665](https://linear.app/affine-design/issue/BS-2665/iframe-embed-block-edgeless-mode-支持)
[BS-2666](https://linear.app/affine-design/issue/BS-2666/iframe-embed-block-edgeless-toolbar)
[BS-2667](https://linear.app/affine-design/issue/BS-2667/iframe-embed-block-edgeless-mode-拖拽调整支持)
[BS-2789](https://linear.app/affine-design/issue/BS-2789/iframe-embed-block-edgeless-block-component)
2025-03-15 09:23:02 +00:00
fundon
99fdfe821a fix(editor): improve type declaration definition (#10866)
Closes: [BS-2809](https://linear.app/affine-design/issue/BS-2809/改进继承自抽象类的类型后-createidentifier-类型定义)

### What's Changed!

* Improved type declaration definition
2025-03-14 10:38:17 +00:00
L-Sun
8ac687628c chore(editor): at menu stays open when left right arrow keys are pressed (#10806)
Close [BS-2644](https://linear.app/affine-design/issue/BS-2644/menu-support)
2025-03-13 06:14:35 +00:00
akumatus
98a3cf8516 feat(core): update blocksuite icons (#10805) 2025-03-13 03:55:55 +00:00
fundon
d823792f85 refactor(editor): simplify color picker (#10776)
### What's Changed!

* Added `enableCustomColor` property into `EdgelessColorPickerButton` component
* Removed redundant code
2025-03-12 05:17:04 +00:00