Commit Graph

62 Commits

Author SHA1 Message Date
fundon
4d6a3731a3 chore(editor): change edgeless-text default color to black (#12361)
Closes: [BS-3506](https://linear.app/affine-design/issue/BS-3506/edgeless-text-默认改为黑色)

### Dark
<img width="691" alt="Screenshot 2025-05-19 at 19 32 52" src="https://github.com/user-attachments/assets/2927d13b-0300-4293-8f8f-7891fd87a680" />

### Light
<img width="639" alt="Screenshot 2025-05-19 at 19 33 05" src="https://github.com/user-attachments/assets/4429f6f9-b374-4b17-87f4-ae09204f1538" />

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **New Features**
  - Improved edgeless text block styling to support theme-based color, font, and alignment settings.

- **Style**
  - Updated the default text color in edgeless text blocks to black, with support for separate dark and light mode colors.

- **Bug Fixes**
  - Ensured the color picker and block rendering reflect the updated default color.

- **Tests**
  - Adjusted tests and snapshots to expect the new default color and theme-based color structure.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-05-19 16:51:02 +00:00
doodlewind
8ed4f14380 feat(editor): support border radius for shape dom renderer (#12326)
Comparison:

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/lEGcysB4lFTEbCwZ8jMv/f2a266ba-c3d5-46ea-9aa5-38e5d0de6d5a.png)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **New Features**
	- Border radius and border thickness of shapes now scale dynamically with zoom level for improved visual consistency.

- **Tests**
	- Added a test to ensure percentage-based border radius values are correctly rendered in the DOM.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-05-16 09:02:45 +00:00
Yifeng Wang
9cabe03386 refactor(editor): add dom renderer entry for canvas element (#12149) 2025-05-14 16:22:16 +08:00
doodlewind
1ef1c3a5fa chore(editor): skip flaky test case in turbo renderer (#12178)
2 out of 7 tests are skipped as flaky due to unknown vitest issue on CI, considering migrating to E2E afterwards.

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **Tests**
  - Removed a test related to rendering multiple notes in the viewport.
  - Skipped two tests concerning zooming behavior and state transitions; these tests are now excluded from regular test runs.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-05-07 13:51:23 +00:00
Saul-Mirone
95b9e4b3d0 refactor(editor): rename model.doc to store (#12172) 2025-05-07 09:17:01 +00:00
Yifeng Wang
ad7868633d test(editor): revert timeout condition in turbo renderer (#12159) 2025-05-07 09:29:12 +08:00
doodlewind
065167a09f test(editor): reduce flaky timing in turbo renderer tests (#12082)
### TL;DR

Improved the test stability for the turbo renderer by using reactive state observation instead of arbitrary timeouts. (https://github.com/toeverything/AFFiNE/actions/runs/14729729312/job/41340918866?pr=12071)

### What changed?

- Replaced `wait(FRAME)` and other timeout-based waits with reactive state observation using RxJS
- Added `filter` import from `rxjs/operators`
- Updated test assertions to properly wait for specific renderer states (`ready`, `pending`, `zooming`)
- Made tests more deterministic by waiting for specific state transitions rather than arbitrary time periods

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Tests**
  - Improved test reliability by replacing fixed-duration waits with reactive waits based on renderer state changes, ensuring tests are synchronized with actual state transitions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-05-06 02:32:48 +00:00
Saul-Mirone
30a2e5b4fb refactor(editor): remove gfx tool global type (#12116)
Closes: BS-2650
2025-05-04 13:53:26 +00:00
doodlewind
b5edd7a6bb test(editor): reduce flaky test in turbo renderer (#12053)
Flaky source: https://github.com/toeverything/AFFiNE/actions/runs/14708000170/job/41272973259

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Tests**
  - Standardized test wait durations to 16ms for improved consistency across viewport turbo renderer tests.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-29 08:34:01 +00:00
Saul-Mirone
e96fcf0c35 refactor(editor): remove page root service (#12048) 2025-04-29 03:19:37 +00:00
doodlewind
be28038e94 perf(editor): fallback to placeholder for canvas text (#12033)
### TL;DR

For canvas elements, this PR adds placeholders during zooming operations to improve performance.

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/lEGcysB4lFTEbCwZ8jMv/8c8daea8-1eb4-419b-a4f4-2a8847f40b7b.png)

### What changed?

- Implemented placeholder rendering during zooming operations in the canvas renderer, but not only DOM.
- Added a `forceFullRender` property to the `GfxCompatibleInterface` to allow elements to opt out of placeholder rendering
- Set `forceFullRender = true` for connectors to ensure they always render properly, even during zooming
- Connected the turbo renderer to the viewport's zooming state to automatically switch between full and placeholder rendering

### Why make this change?

Rendering complex elements during zooming operations can cause performance issues and make the UI feel sluggish. Rendering connector label also leads to high cost DOM `set font` delays.

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/lEGcysB4lFTEbCwZ8jMv/961fb847-24b4-4a7f-b9dc-21b0a5edaaa1.png)

The turbo renderer improves performance by displaying simple placeholders for elements during zooming, while still rendering critical elements like connectors fully. This creates a smoother user experience while maintaining essential visual information.

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **New Features**
  - Introduced a feature-flag-controlled "turbo" rendering mode that displays placeholder graphics during zooming for improved performance.
  - Added the ability to override placeholder rendering for specific elements, ensuring full rendering when required.

- **Bug Fixes**
  - Enhanced rendering logic to ensure connectors always render fully, even during zoom operations.

- **Documentation**
  - Updated API documentation to reflect new properties related to rendering behavior.

- **Tests**
  - Improved tests to verify correct rendering behavior for connectors.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-29 03:05:17 +00:00
Saul-Mirone
81b439c4e1 feat(editor): add gfx pointer extension (#12006)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Introduced a new pointer graphics module with tools and quick tool integration for edgeless surfaces.
  - Added a quick tool button for pointer interactions in edgeless mode.
  - Exposed new extension points for pointer graphics and effects.

- **Improvements**
  - Integrated pointer graphics as a dependency into related packages.
  - Enhanced toolbar context to support additional surface alignment modes.
  - Added conditional clipboard configuration registrations for edgeless contexts across multiple block types.

- **Removals**
  - Removed legacy tool and effect definitions and related quick tool exports from edgeless components.
  - Streamlined extension arrays and removed unused exports for a cleaner codebase.
  - Deleted obsolete utility functions and component registrations.

- **Chores**
  - Updated workspace and TypeScript project references to include the new pointer graphics module.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-27 04:46:44 +00:00
Saul-Mirone
6e76a3e593 feat(editor): add frame title and mobile toolbar widget extension (#11996)
Closes: BS-3223
Closes: BS-3224

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Introduced new view extensions for frame title and keyboard toolbar widgets with conditional registration based on context and environment.
  - Enhanced widget integration by adding explicit exports for view components.

- **Chores**
  - Updated export paths and package dependencies to improve modularity and compatibility.
  - Removed deprecated widget dependencies and related imports from core packages.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-26 02:45:18 +00:00
doodlewind
a46f1a3adf test(editor): reduce flaky in turbo renderer test (#11973)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Tests**
  - Improved test resource cleanup for the viewport turbo renderer, ensuring proper teardown after each test for more reliable and isolated test execution.
  - Enhanced stability by preventing errors during cleanup when certain elements or editors are absent.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-25 00:11:22 +00:00
doodlewind
fd90b2541e test(editor): reduce flaky test (#11970)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **Tests**
  - Improved test reliability by awaiting the actual state change event instead of using a fixed delay during zooming state verification.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-24 14:17:21 +00:00
doodlewind
2d3130eac9 fix(editor): turbo renderer placeholder for built in template (#11793)
Fixed compat error for new built-in template with test updated.

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/lEGcysB4lFTEbCwZ8jMv/f8c69d3f-9602-4509-994b-7243b26b4656.png)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **New Features**
  - Added an option to enable or disable bitmap rendering in the renderer settings.
  - Introduced a cooldown period after zooming before block optimization resumes, improving rendering performance and stability.

- **Bug Fixes**
  - Improved handling of cases where block components may be missing, preventing potential runtime errors.

- **Tests**
  - Expanded and refined tests to verify zooming behavior, bitmap caching, and internal state transitions for enhanced reliability.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-24 02:40:04 +00:00
Saul-Mirone
16831e8c0e feat(editor): reference, mention and latex inline extension (#11914)
Closes: BS-3215
Closes: BS-3218
Closes: BS-3217
2025-04-23 09:22:16 +00:00
L-Sun
a9ad01491c test(core): enable no-floating-promises rule for tests (#11915)
Sometimes, missing `await` in the test code can cause timing issues, leading to test failures. This PR enables the `no-floating-promises` rule for the test code to ensure that such errors do not occur.
2025-04-23 08:17:41 +00:00
Saul-Mirone
b1aecfc1c4 feat(editor): link inline extension (#11910)
Closes: BS-3216
2025-04-23 04:42:24 +00:00
Saul-Mirone
2510e7a9a4 feat(editor): inline footnote extension (#11908)
Closes: BS-3219
2025-04-23 01:40:49 +00:00
Saul-Mirone
24edfc75bd feat(editor): table extension (#11906)
Closes: BS-3205
2025-04-23 01:16:08 +00:00
Saul-Mirone
e57222b89a feat(editor): surface ref extension (#11902)
Closes: BS-3203
2025-04-23 01:16:07 +00:00
Saul-Mirone
45b6cbe8d7 refactor(editor): cleanup dead code (#11893) 2025-04-22 15:51:23 +00:00
Saul-Mirone
43966a6c6b feat(editor): use store extension manager (#11891)
Closes: BS-3284
2025-04-22 15:51:23 +00:00
Saul-Mirone
99ad4e871e feat(editor): use migrated extensions (#11886)
Closes: BS-3283
2025-04-22 15:51:22 +00:00
Saul-Mirone
6d6504e2af feat(editor): replace spec provider with extension manager (#11861)
Closes: BS-3273
2025-04-22 07:40:41 +00:00
Yifeng Wang
e9d04de399 test(editor): add tests for turbo renderer layout cache 2025-04-14 17:06:13 +08:00
Yifeng Wang
2cd0e75810 fix: flaky 2025-04-14 17:04:22 +08:00
doodlewind
6457c979f5 test(editor): add tests for turbo renderer state machine (#11659) 2025-04-14 17:01:27 +08:00
doodlewind
e1e5e8fc14 feat(editor): add basic image support in turbo renderer (#11620)
This PR adds basic support for image block:

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/lEGcysB4lFTEbCwZ8jMv/4785fc76-fe09-4002-b3fb-aafa9cac34bb.png)
2025-04-11 10:16:07 +00:00
Saul-Mirone
4f9a4e739a feat(editor): extract linked doc widget package (#11589)
Close [BS-2738](https://github.com/toeverything/AFFiNE/pull/11589)
2025-04-11 14:06:16 +08:00
doodlewind
dba8e00fb6 feat(editor): add basic note support in turbo renderer (#11607)
After landing layout tree refactoring, this PR adds basic note support in turbo renderer.

In this demo recording, the code and image block needs to be further supported.

[Screen Recording 2025-04-10 at 5.16.15 PM.mov <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.dev/api/v1/graphite/video/thumbnail/lEGcysB4lFTEbCwZ8jMv/2e416b41-5609-4e52-a90f-5b7bb77db682.mov" />](https://app.graphite.dev/media/video/lEGcysB4lFTEbCwZ8jMv/2e416b41-5609-4e52-a90f-5b7bb77db682.mov)
2025-04-10 09:52:33 +00:00
doodlewind
69d4620753 refactor(editor): cleanup turbo renderer entry config with doc guide (#11605) 2025-04-10 09:52:32 +00:00
doouding
d7268ce04c test: add std gfx test (#11442)
### Changed
- Move some intergraion tests to std as they are more like basic tests
- Add some basic gfx-related tests
2025-04-08 16:20:36 +00:00
Saul-Mirone
bb1270061a feat(editor): gfx template package (#11480) 2025-04-06 12:24:13 +00:00
L-Sun
64ed23d473 fix(editor): missing refFlavour in creation of surface-ref (#11445) 2025-04-03 07:57:10 +00:00
doouding
36b1ca4327 feat: render placeholder in edgeless mode (#11387)
Complete [BS-2997](https://linear.app/affine-design/issue/BS-2997/在白板上渲染-inserted-frame-group-时提供占位)
2025-04-02 06:59:25 +00:00
L-Sun
2f1f09e25f fix(editor): extract store spec register from effects (#11268)
Close [BS-2802](https://linear.app/affine-design/issue/BS-2802/移動端缺少bseffects導致文檔創建錯誤)
2025-03-31 10:53:02 +00:00
Saul-Mirone
205cd7a86d refactor(editor): rename block-std to std (#11250)
Closes: BS-2946
2025-03-28 07:20:34 +00:00
Saul-Mirone
0a8d8e0a6b feat: seperate createDoc and createStore (#11182) 2025-03-26 11:03:47 +00:00
doouding
ace5d44a61 refactor: rewrite dblclick and selection logic of default-tool (#11036)
continue #10824

### Changed
- Moved double-click-to-edit behavior from the default tool to individual model views
- Introduced `onSelected` callback interface in gfx view components to allows developers to override default selection logic
2025-03-26 07:32:43 +00:00
Saul-Mirone
ef1ed383cb feat(editor): command for ungroup and group (#11116) 2025-03-24 15:34:38 +09:00
Saul-Mirone
5525c2bc8d refactor(editor): move mindmap view to mindmap package (#11102) 2025-03-24 03:14:23 +00:00
Saul-Mirone
3de7d85eea feat(editor): improve api for store, and add docs (#10941) 2025-03-17 16:30:59 +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
Saul-Mirone
b8452f56a8 feat(editor): block painter extension (#10847) 2025-03-14 05:26:58 +00:00
doodlewind
be9f44fc4f fix(editor): worker loading in webpack env (#10832)
### TL;DR

Created dedicated worker entry points to avoid dynamic imports.

### What changed?

- Painters are provided during worker initialization
- Removed `ParagraphPaintConfigExtension` and the associated configuration system
- Created dedicated worker entry points in both the integration test and frontend packages
- Modified `ViewportLayoutPainter` to accept painters in its constructor
- Updated the `TurboRendererConfig` interface to require a `painterWorkerEntry` function

### Why make this change?

Webpack support. Extension objects in main thread are not available to be passed into workers. Dynamic painter path import is hard to support in webpack environment. With the [webpack-ignore](https://webpack.js.org/api/module-methods/#webpackignore) rule, there are still build errors in webpack.
2025-03-14 05:26:57 +00:00
doodlewind
0f062b7157 refactor(editor): make turbo renderer a gfx extension (#10818)
This allows for easier debugging via `gfx.turboRenderer`
2025-03-13 07:45:05 +00:00
doodlewind
c023b724d0 refactor(editor): generic layout type support for turbo renderer (#10766)
This PR refactored the turbo renderer architecture to support multiple block layout types.

- New base class `BlockLayoutPainter` and `BlockLayoutProvider` are introduced for writing extendable per-block layout querying and painting logic.
- Paragraph-specific lines are all moved into dedicated classes (`ParagraphLayoutProvider` and `ParagraphLayoutPainter`) under the `/variants/paragraph` dir.
- The `renderer-utils.ts` doesn't contain paragraph-specific logic now.
- The `text-utils.ts` is also now scoped for paragraph only.
- Worker messages are now strongly typed.

Upcoming PR should further implement the block registration system using extension API. The `variants` dir could still exist, since there will be similar rendering logic that can be reused among block types (i.e., between paragraph block and list block).
2025-03-13 05:18:12 +00:00
Mirone
cd63e0ed8b feat(editor): replace slot with rxjs subject (#10768) 2025-03-12 11:29:24 +09:00