Commit Graph

312 Commits

Author SHA1 Message Date
Saul-Mirone
780c35eabe fix(editor): prevent Tab key propagation outside editor (#11531)
Closes: BS-2964
2025-04-08 10:03:06 +00:00
donteatfriedrice
b8e7ca3214 test(editor): fix flaky embed iframe e2e test (#11530) 2025-04-08 08:37:12 +00:00
donteatfriedrice
43809838ef test(editor): add embed iframe block e2e tests (#11502)
Close [BS-2669](https://linear.app/affine-design/issue/BS-2669/iframe-embed-block-添加测试)
2025-04-07 09:43:36 +00:00
fundon
8a13eca271 fix(editor): should focus on input of popover on toolbar (#11485)
Related to: https://github.com/toeverything/AFFiNE/pull/11429
2025-04-07 03:04:34 +00:00
fundon
363476a46c fix(editor): add hoverable container for image and surface-ref (#11458)
Closes: [BS-3012](https://linear.app/affine-design/issue/BS-3012/hover-yuan素时冲突)
2025-04-03 13:43:55 +00:00
fundon
565d7b2b1e fix(editor): should not show inner toolbar of surface-ref in edgeless (#11453)
Closes: [BS-3015](https://linear.app/affine-design/issue/BS-3015/toolbar-有时会出现空状态且被显示) [BS-3023](https://linear.app/affine-design/issue/BS-3023/surface-ref-inner-toolbar-的标题圆角)
2025-04-03 11:13:09 +00:00
Saul-Mirone
773db7860a feat(editor): not sync selection from awareness (#11420) 2025-04-03 09:22:26 +00:00
fundon
03dd073cb4 fix(editor): add recent open doc with mode button (#11419)
Closes: [BS-3013](https://linear.app/affine-design/issue/BS-3013/open-doc-分开两个按钮:一个快捷按钮和一个菜单)

Split into two buttons: `recent open doc with mode button` and `open doc with dropdown menu`.
2025-04-03 02:06:14 +00:00
fundon
d9fade8045 fix(core): should display date as original title of journal (#11375)
Closes: [BS-2991](https://linear.app/affine-design/issue/BS-2991/linked-journal添加alias后,toolbar上获取不到标题)
2025-04-02 01:24:43 +00:00
fundon
8427293d36 fix(core): fix target block cannot be reached when clicking affine-link multiple times (#10473)
Closes: [BS-2702](https://linear.app/affine-design/issue/BS-2702/超链接无法滚动到指定block)
2025-04-01 14:46:35 +00:00
fundon
f374f2695f fix(core): add shortcuts to open doc dropdown menu (#11358)
Closes: [BS-2992](https://linear.app/affine-design/issue/BS-2992/走查toolbar上的open-in-button)

[Screen Recording 2025-04-01 at 16.37.57.mov <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.dev/api/v1/graphite/video/thumbnail/8ypiIKZXudF5a0tIgIzf/cf4b1baf-aa2c-4f37-9c62-f7202d0f7c42.mov" />](https://app.graphite.dev/media/video/8ypiIKZXudF5a0tIgIzf/cf4b1baf-aa2c-4f37-9c62-f7202d0f7c42.mov)
2025-04-01 12:39:13 +00:00
fundon
7af5e53838 refactor(editor): image toolbar config extension (#11329)
Closes: [BS-2378](https://linear.app/affine-design/issue/BS-2378/image-toolbar-迁移)
2025-04-01 10:04:28 +00:00
L-Sun
fec698fd8b chore(editor): improve selection of doc in canvas (#11314)
Close [BS-2705](https://linear.app/affine-design/issue/BS-2705/[improvement]-通过-viability-control-选择-hide-in-edgeless)

This PR disabled selecting operation of notes that are only shown in page mode.
2025-03-31 12:35:02 +00:00
fundon
f1882061a2 fix(editor): should exit drawing tools menu when Escape is pressed (#11306)
Closes: [BS-2978](https://linear.app/affine-design/issue/BS-2978/二级菜单的激活状态错误) [BS-2977](https://linear.app/affine-design/issue/BS-2977/pen和highlighter没做esc)
2025-03-31 11:05:01 +00:00
Fangdun Tsai
6850871bfb fix(editor): fix callout tests (#11301) 2025-03-31 08:37:20 +00:00
EYHN
24c382d3aa feat(core): enable callout in canary (#11302) 2025-03-31 08:10:18 +00:00
L-Sun
af91a0217f refactor(editor): inner toolbar surface-ref block with extension (#11246)
This PR refactor `surface-ref` toolbar with `ToolbarExtension`
2025-03-28 05:48:24 +00:00
fundon
2c4278058b feat(editor): add highlighter (#10573)
Closes: [BS-2909](https://linear.app/affine-design/issue/BS-2909/新增highlighter)

### What's Changed!

Currently the highlighter tool is very similar to brush, but for the future, it's a standalone module.

* Added `Highlighter` element model
* Added `Highlighter` tool
* Added `Highlighter` entry to the global toolbar
2025-03-27 08:53:26 +00:00
Saul-Mirone
d9d5aa407a fix: split view focus (#11217)
# After:

https://github.com/user-attachments/assets/990d500d-2da7-488e-ac32-dd7bd229f896

# Before:

https://github.com/user-attachments/assets/6676766a-c76a-414b-a35e-53d2cda10c24
2025-03-27 05:27:59 +00:00
L-Sun
c23b8f604b fix(editor): incorrect edgeless viewport in peek view (#11040)
### What Changes
- Fixed incorrect edgeless viewport display in peek view
  - Moved page block viewport fit animation logic from `EdgelessRootBlockComponent` to note config extension
  - Disabled page block viewport fit animation in peek view, using default `fitToScreen` instead
  - @doodlewind Fixed viewport resizing issues by adding a immediate update mechanism to ensure proper rendering during peek view operations.  The setViewportByBound is only called once during peek view initialization, so there are barely perf overhead.
- Updated related test cases
  - Refactored peek view test cases to make them clearer and more reliable
  - Added new test helper function `getViewportBound` for getting viewport boundary information
2025-03-26 09:29:05 +00:00
fundon
583bbf3463 fix(editor): improve affine-link toolbar (#11159)
Closes: [BS-2884](https://linear.app/affine-design/issue/BS-2884/[ui]-hover-邮箱的-toolbar)
2025-03-25 07:58:41 +00:00
L-Sun
a2e3d318ba refactor(editor): adjust ui of surface-ref inner toolbar (#11129)
Close [BS-2803](https://linear.app/affine-design/issue/BS-2803/inserted-frame-ui%E8%B0%83%E6%95%B4)
Close [BS-2815](https://linear.app/affine-design/issue/BS-2815/inserted-group-ui调整)

### What Changes
- Add an inner toolbar for hovered `surface-ref-block`
- Simplify viewport related codes of `surface-ref-block`
- Expose popover floating options from `affine-menu-button`

https://github.com/user-attachments/assets/916b0a22-6271-4a6f-b338-6630e0426967
2025-03-25 03:48:12 +00:00
Saul-Mirone
80d451cc51 fix(editor): flaky e2e test (#11144) 2025-03-24 13:21:37 +00:00
fundon
63762b75a1 feat(core): save recent open mode of internal links (#11086)
Closes: [BS-2865](https://linear.app/affine-design/issue/BS-2865/internal-links-保存用户最近的打开方式)

Added `openDocMode` in settings.

https://github.com/user-attachments/assets/a452da73-83e4-4ef5-9b57-58291fc22785
2025-03-24 06:12:47 +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
fundon
1f2caca3f5 fix(editor): should not show toolbar when elements have been deleted (#11026)
Closes: [BS-2691](https://linear.app/affine-design/issue/BS-2691/[bug]-当-edgeless-为空的时候,点击-space-会在左上角出现一个莫名的-toolbar)
2025-03-20 06:01:57 +00:00
Saul-Mirone
92d76ba571 refactor(editor): merge inline to std (#11025) 2025-03-20 05:46:56 +00:00
fundon
8b995ea420 chore(editor): remove edgeless element toolbar (#10900) 2025-03-20 02:08:21 +00:00
fundon
a8ac3bdb3e fix(editor): adjust creation position to avoid being blocked by banner (#10992)
![Screenshot 2025-03-19 at 16.25.57.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/8ypiIKZXudF5a0tIgIzf/c06e5d3c-40c3-4277-bb6d-57aa75a6fb1f.png)
2025-03-19 10:01:53 +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
L-Sun
7ba1c1b271 chore(editor): use at menu to insert linked doc (#10808)
Close [BS-2799](https://linear.app/affine-design/issue/BS-2799/区分linked-doc入口)

This PR removes the patch for `Linked Doc` action in the slash menu via the `QuickSearch`, reverting it to use the at menu for inserting.
2025-03-13 08:01:59 +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
zzj3720
db707dff7f refactor(editor): remove edit view of database block properties (#10748) 2025-03-10 16:24:44 +00:00
Saul-Mirone
ec709925ee refactor(editor): orgnize exports (#10709) 2025-03-10 02:04:01 +00:00
fundon
befb795935 fix(editor): should show toolbar after mouse is released (#10698) 2025-03-08 04:16:02 +00:00
Flrande
264f0dd2be fix(editor): improve backspace ux for callout block (#10696) 2025-03-07 08:50:31 +00:00
Flrande
b85812d8dd fix(editor): disable slash menu in callout (#10656) 2025-03-06 11:07:10 +00:00
fundon
ec9bd1f383 feat(editor): add toolbar registry extension (#9572)
### What's Changed!

#### Added
Manage various types of toolbars uniformly in one place.

* `affine-toolbar-widget`
* `ToolbarRegistryExtension`

The toolbar currently supports and handles several scenarios:

1.  Select blocks: `BlockSelection`
2. Select text: `TextSelection` or `NativeSelection`
3. Hover a link: `affine-link` and `affine-reference`

#### Removed
Remove redundant toolbar implementations.

* `attachment` toolbar
* `bookmark` toolbar
* `embed` toolbar
* `formatting` toolbar
* `affine-link` toolbar
* `affine-reference` toolbar

### How to migrate?

Here is an example that can help us migrate some unrefactored toolbars:

Check out the more detailed types of [`ToolbarModuleConfig`](c178debf2d/blocksuite/affine/shared/src/services/toolbar-service/config.ts).

1.  Add toolbar configuration file to a block type, such as bookmark block: [`config.ts`](c178debf2d/blocksuite/affine/block-bookmark/src/configs/toolbar.ts)

```ts
export const builtinToolbarConfig = {
  actions: [
    {
      id: 'a.preview',
      content(ctx) {
        const model = ctx.getCurrentModelBy(BlockSelection, BookmarkBlockModel);
        if (!model) return null;

        const { url } = model;

        return html`<affine-link-preview .url=${url}></affine-link-preview>`;
      },
    },
    {
      id: 'b.conversions',
      actions: [
        {
          id: 'inline',
          label: 'Inline view',
          run(ctx) {
          },
        },
        {
          id: 'card',
          label: 'Card view',
          disabled: true,
        },
        {
          id: 'embed',
          label: 'Embed view',
          disabled(ctx) {
          },
          run(ctx) {
          },
        },
      ],
      content(ctx) {
      },
    } satisfies ToolbarActionGroup<ToolbarAction>,
    {
      id: 'c.style',
      actions: [
        {
          id: 'horizontal',
          label: 'Large horizontal style',
        },
        {
          id: 'list',
          label: 'Small horizontal style',
        },
      ],
      content(ctx) {
      },
    } satisfies ToolbarActionGroup<ToolbarAction>,
    {
      id: 'd.caption',
      tooltip: 'Caption',
      icon: CaptionIcon(),
      run(ctx) {
      },
    },
    {
      placement: ActionPlacement.More,
      id: 'a.clipboard',
      actions: [
        {
          id: 'copy',
          label: 'Copy',
          icon: CopyIcon(),
          run(ctx) {
          },
        },
        {
          id: 'duplicate',
          label: 'Duplicate',
          icon: DuplicateIcon(),
          run(ctx) {
          },
        },
      ],
    },
    {
      placement: ActionPlacement.More,
      id: 'b.refresh',
      label: 'Reload',
      icon: ResetIcon(),
      run(ctx) {
      },
    },
    {
      placement: ActionPlacement.More,
      id: 'c.delete',
      label: 'Delete',
      icon: DeleteIcon(),
      variant: 'destructive',
      run(ctx) {
      },
    },
  ],
} as const satisfies ToolbarModuleConfig;
```

2. Add configuration extension to a block spec: [bookmark's spec](c178debf2d/blocksuite/affine/block-bookmark/src/bookmark-spec.ts)

```ts
const flavour = BookmarkBlockSchema.model.flavour;

export const BookmarkBlockSpec: ExtensionType[] = [
  ...,
  ToolbarModuleExtension({
    id: BlockFlavourIdentifier(flavour),
    config: builtinToolbarConfig,
  }),
].flat();
```

3. If the bock type already has a toolbar configuration built in, we can customize it in the following ways:

Check out the [editor's config](c178debf2d/packages/frontend/core/src/blocksuite/extensions/editor-config/index.ts (L51C4-L54C8)) file.

```ts
// Defines a toolbar configuration for the bookmark block type
const customBookmarkToolbarConfig = {
  actions: [
    ...
  ]
} as const satisfies ToolbarModuleConfig;

// Adds it into the editor's config
 ToolbarModuleExtension({
    id: BlockFlavourIdentifier('custom:affine:bookmark'),
    config: customBookmarkToolbarConfig,
 }),
```

4. If we want to extend the global:

```ts
// Defines a toolbar configuration
const customWildcardToolbarConfig = {
  actions: [
    ...
  ]
} as const satisfies ToolbarModuleConfig;

// Adds it into the editor's config
 ToolbarModuleExtension({
    id: BlockFlavourIdentifier('custom:affine:*'),
    config: customWildcardToolbarConfig,
 }),
```

Currently, only most toolbars in page mode have been refactored. Next is edgeless mode.
2025-03-06 06:46:03 +00:00
Flrande
bd62634a76 feat(editor): add callout block (#10563)
- Add `CalloutBlockModel `
- Implement `CalloutBlockComponent `
- Integrate with slash menu (/)
2025-03-05 09:28:51 +00:00
Saul-Mirone
66d9d576e0 refactor(editor): add gfx entry in bs global package (#10612) 2025-03-04 12:46:50 +00:00
L-Sun
37fbfbcf3e fix(editor): zindex of frame child not updated (#10580)
Close [BS-2689](https://linear.app/affine-design/issue/BS-2689/[bug]-%E5%BD%93%E5%B1%82%E7%BA%A7%E4%BD%8E%E4%BA%8E-frame-%E7%9A%84yuan%E7%B4%A0%E8%A2%AB%E6%8B%96%E5%85%A5-frame-%E6%97%B6%E5%B1%82%E7%BA%A7%E5%BA%94%E8%AF%A5%E8%A2%AB%E8%87%AA%E5%8A%A8%E6%8B%89%E9%AB%98%E5%B5%8C%E5%85%A5-frame)
2025-03-03 10:51:27 +00:00
zzj3720
5c5c9f8dcd fix(editor): insertion position of new rows and columns is incorrect in table block (#10516)
fix: BS-2714
2025-02-28 12:06:28 +00:00
L-Sun
90b37ce65c fix(core): editor blur unexpectedly when clicking blank area (#10501)
### Before

https://github.com/user-attachments/assets/3c4b20e1-6d89-4dc7-a51f-04b6e9a89486

### After

https://github.com/user-attachments/assets/86b93403-597e-4dbb-ab65-90908342c230
2025-02-28 07:05:06 +00:00
Saul-Mirone
1d865ad883 test(editor): collab table test (#10506)
1. **Table UI Enhancements - Test IDs Added**
   - Added `data-testid` attributes to several table components for better testability:
     - `add-column-button` for the column addition button
     - `add-row-button` for the row addition button
     - `drag-column-handle` for column drag handles
     - `drag-row-handle` for row drag handles

2. **New Test Infrastructure**
   - Added new testing utilities in `tests/kit/src/bs/`:
     - `misc.ts`: Added `waitNextFrame` utility function for handling animation frame timing in tests
     - `table.ts`: Added comprehensive table testing utilities including:
       - `createTable`: Creates a new table with initial cells
       - `getCellText`: Retrieves text from a specific table cell
       - `inputToCell`: Inputs text into a specific table cell
       - `clickDeleteButtonInTableMenu`: Handles table deletion operations

3. **New Collaboration Test**
   - Added a new test file `tests/affine-local/e2e/blocksuite/table/collab.spec.ts` that tests table collaboration features:
     - Tests synchronization between two pages (A and B)
     - Verifies table operations sync correctly:
       - Adding columns and rows
       - Inputting cell content
       - Deleting columns and rows
     - Validates cell content consistency across both pages
     - Tests the complete table manipulation workflow in a collaborative setting

4. **Package Configuration Update**
   - Modified `tests/kit/package.json` to expose new test utilities:
     - Added new export mapping: `"./bs/*": "./src/bs/*.ts"` to make the new table testing utilities accessible

This PR primarily focuses on improving table testing infrastructure and adding comprehensive collaboration tests for the table functionality, while also enhancing component testability through data-test-ids.
2025-02-28 04:37:12 +00:00
pengx17
cd0bec5d31 fix(core): at menu ux (#10485)
fix AF-2285

1. loading icon will be rendered to the group name
2. make the focused item more stable
2025-02-28 02:34:29 +00:00
fundon
caa4dfedfc fix(editor): adjust black and white in shape text color palettes to pure black and pure white (#10450)
Closes: [BS-2697](https://linear.app/affine-design/issue/BS-2697/检查shape-text-color黑白不映射的pr合并状态)

https://github.com/user-attachments/assets/732612e9-5e43-453f-aef2-5f32f5a08614
2025-02-27 06:05:42 +00:00
L-Sun
2732b96d00 fix(editor): overflow of embed github card in edgeless note (#10442)
This PR fixes the overflow of the `embed-github-card` inside edgeless notes.

https://github.com/user-attachments/assets/21775d0f-e4c8-4fcc-86d8-aafb27033358
2025-02-26 09:33:57 +00:00
fundon
c058f94e15 chore(editor): improve color formatting tests (#10429) 2025-02-26 08:19:54 +00:00
CatsJuice
e1fd8f5d80 fix(core): correctly toggle visibility of starter-bar based on doc.isEmpty (#10439) 2025-02-26 07:49:51 +00:00
Cats Juice
09cc5c392b refactor(core): new workspace selector and create dialog (#10323) 2025-02-21 17:16:38 +08:00