7f98420061
chore: allow cursor in none-contenteditable blocks ( #11366 )
2025-04-01 13:20:08 +00:00
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
eac8f32f4c
refactor(editor): basic styles of font and panel ( #11290 )
...
* Updated `border-radius` of panel to `8px`. [BS-2901](https://linear.app/affine-design/issue/BS-2901/meta-info-ui-issue ) [BS-2810](https://linear.app/affine-design/issue/BS-2810/toolbarpicker-圆角更新为-8px )
* Refactored basic styles of font and panel.
<img width="549" alt="Screenshot 2025-03-31 at 12 56 36" src="https://github.com/user-attachments/assets/4a827e1e-f802-4251-a563-4a34b891a5e3 " />
2025-04-01 01:35:59 +00:00
51dddc10be
fix: template panel tooltip overflow ( #11304 )
...
Close #10171
Fixes [BS-2577](https://linear.app/affine-design/issue/BS-2577/title-overflow-in-edgeless-mode-in-web-interface )
2025-03-31 09:51:33 +00:00
205cd7a86d
refactor(editor): rename block-std to std ( #11250 )
...
Closes: BS-2946
2025-03-28 07:20:34 +00:00
e2c752d56f
feat(editor): inner toolbar layout for block ( #11243 )
...
Close [BS-2808](https://linear.app/affine-design/issue/BS-2808/组件内-toolbar-重构 )
2025-03-28 03:47:37 +00:00
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
91876301bf
refactor(editor): adjust min-width of context-menu ( #11078 )
...
fix: BS-2686
2025-03-26 07:48:17 +00:00
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
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
dd2e423112
fix(editor): add placeholder for input of database context menu ( #11079 )
...
fix: BS-2594
2025-03-21 12:27:18 +00:00
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
da63d51b7e
refactor(editor): group and expose parameters of createButtonPopper ( #10999 )
2025-03-20 08:37:59 +00:00
8b995ea420
chore(editor): remove edgeless element toolbar ( #10900 )
2025-03-20 02:08:21 +00:00
831f290f84
refactor(editor): edgeless toolbar chevron down icon ( #10898 )
2025-03-20 02:08:20 +00:00
a7acd5c5b1
refactor(editor): fix edgeless toolbar theme ( #10897 )
2025-03-20 02:08:20 +00:00
e4b8b367ce
refactor(editor): edgeless toolbar add frame action ( #10880 )
2025-03-20 02:08:17 +00:00
54bc60aa4d
refactor(editor): edgeless shape toolbar config extension ( #10821 )
2025-03-20 02:08:16 +00:00
7f34667b78
refactor(editor): edgeless connector toolbar config extension ( #10798 )
2025-03-19 14:50:55 +00:00
e320552594
refactor(editor): edgeless note toolbar config extension ( #10719 )
2025-03-19 12:34:18 +00:00
e686a6aecc
refactor(editor): edgeless internal embed card toolbar config extension ( #10717 )
2025-03-19 12:34:17 +00:00
d8567e669a
refactor(editor): edgeless bookmark toolbar config extension ( #10711 )
2025-03-19 02:24:26 +00:00
251d1d8782
refactor(editor): edgeless attacment toolbar config extension ( #10710 )
2025-03-19 00:52:22 +00:00
cb37d25d7b
refactor(editor): edgeless element toolbar with new pattern ( #10511 )
2025-03-18 15:36:25 +00:00
d5a5df5e49
test(editor): move blocksuite test to tests folder ( #10917 )
2025-03-17 06:40:25 +00:00
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
b238aa3182
fix(editor): clamp method in color picker ( #10840 )
...
Related to https://github.com/toeverything/AFFiNE/pull/10577
2025-03-13 19:37:37 +00:00
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
cd63e0ed8b
feat(editor): replace slot with rxjs subject ( #10768 )
2025-03-12 11:29:24 +09:00
006bdd29b8
fix(editor): clip content within menu ( #10764 )
...
Closes: [BS-2796](https://linear.app/affine-design/issue/BS-2796/menu-中内容被剪切的问题 )
2025-03-11 12:39:59 +00:00
aa690e6c91
refactor(editor): move color panel into color picker ( #10758 )
2025-03-11 09:37:09 +00:00
6244bbbd11
refactor(editor): move getTooltipWithShortcut to affine-tooltip-content-with-shortcut ( #10743 )
...
I'm refactoring the edgeless note toolbar config extension and find that I need to move this.
https://github.com/toeverything/AFFiNE/blob/cac05e720aae491681f69883c34691da24675073/blocksuite/affine/blocks/block-root/src/widgets/element-toolbar/change-note-button.ts#L525
2025-03-10 11:58:58 +00:00
fe5f0f62ec
feat(editor): rich text package ( #10689 )
...
This PR performs a significant architectural refactoring by extracting rich text functionality into a dedicated package. Here are the key changes:
1. **New Package Creation**
- Created a new package `@blocksuite/affine-rich-text` to house rich text related functionality
- Moved rich text components, utilities, and types from `@blocksuite/affine-components` to this new package
2. **Dependency Updates**
- Updated multiple block packages to include the new `@blocksuite/affine-rich-text` as a direct dependency:
- block-callout
- block-code
- block-database
- block-edgeless-text
- block-embed
- block-list
- block-note
- block-paragraph
3. **Import Path Updates**
- Refactored all imports that previously referenced rich text functionality from `@blocksuite/affine-components/rich-text` to now use `@blocksuite/affine-rich-text`
- Updated imports for components like:
- DefaultInlineManagerExtension
- RichText types and interfaces
- Text manipulation utilities (focusTextModel, textKeymap, etc.)
- Reference node components and providers
4. **Build Configuration Updates**
- Added references to the new rich text package in the `tsconfig.json` files of all affected packages
- Maintained workspace dependencies using the `workspace:*` version specifier
The primary motivation appears to be:
1. Better separation of concerns by isolating rich text functionality
2. Improved maintainability through more modular package structure
3. Clearer dependencies between packages
4. Potential for better tree-shaking and bundle optimization
This is primarily an architectural improvement that should make the codebase more maintainable and better organized.
2025-03-07 04:08:47 +00:00
2e86bfffae
feat(editor): life cycle ext ( #10668 )
2025-03-06 12:28:55 +00:00
84e2dda3f8
refactor(editor): separate lit and slot in global ( #10666 )
2025-03-06 10:24:59 +00:00
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`](https://github.com/toeverything/AFFiNE/blob/c178debf2d49c40b753e1bcaa6f07270bdde7401/blocksuite/affine/shared/src/services/toolbar-service/config.ts ).
1. Add toolbar configuration file to a block type, such as bookmark block: [`config.ts`](https://github.com/toeverything/AFFiNE/blob/c178debf2d49c40b753e1bcaa6f07270bdde7401/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](https://github.com/toeverything/AFFiNE/blob/c178debf2d49c40b753e1bcaa6f07270bdde7401/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](https://github.com/toeverything/AFFiNE/blob/c178debf2d49c40b753e1bcaa6f07270bdde7401/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
2b30d756e2
refactor(editor): replace debounce and throttle with lodash ( #10639 )
2025-03-06 04:46:52 +00:00
bd62634a76
feat(editor): add callout block ( #10563 )
...
- Add `CalloutBlockModel `
- Implement `CalloutBlockComponent `
- Integrate with slash menu (/)
2025-03-05 09:28:51 +00:00
b8ecfbdae6
refactor(editor): remove assertExists ( #10615 )
2025-03-05 00:13:08 +00:00
66d9d576e0
refactor(editor): add gfx entry in bs global package ( #10612 )
2025-03-04 12:46:50 +00:00
5ad3d3c94a
refactor(editor): move figma squircle to shared ( #10610 )
2025-03-04 10:26:58 +00:00
fa5674166e
refactor(editor): cleanup list icons ( #10608 )
2025-03-04 10:13:01 +00:00
4c3c953a36
chore(editor): merge clamp functions ( #10577 )
...
Closes: [BS-2625](https://linear.app/affine-design/issue/BS-2625/合并clamp函数 )
2025-03-03 10:33:38 +00:00
5d3c365d97
fix(editor): format text in code block ( #10575 )
...
Closes: [BS-2724](https://linear.app/affine-design/issue/BS-2724/code-block%E9%87%8C%E4%B8%8D%E5%BA%94%E8%AF%A5%E6%98%BE%E7%A4%BAtoolbar )
2025-03-03 08:52:38 +00:00
f23f29610c
refactor(editor): remove stable feature flags ( #10547 )
2025-03-02 08:41:12 +00:00
d476d3b1df
fix(editor): android keyboard can not be opened ( #10502 )
...
Close [BS-2674](https://linear.app/affine-design/issue/BS-2674/[android]-%E6%96%87%E6%9C%AC%E7%BC%96%E8%BE%91%E5%8C%BA%E5%9F%9F%E7%82%B9%E5%87%BB%E5%90%8E%E6%97%A0%E6%B3%95%E6%BF%80%E6%B4%BB%E9%94%AE%E7%9B%98 ) [BS-2609](https://linear.app/affine-design/issue/BS-2609/[android]-%E8%BE%93%E5%85%A5%E7%9A%84-toolbar-%E6%B2%A1%E6%9C%89%E4%BA%86 )
2025-02-28 08:23:26 +00:00
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
589622043c
fix(editor): list toggle position offset ( #10448 )
...
Before:
After:
<img width="579" alt="image" src="https://github.com/user-attachments/assets/7b049b53-269b-484e-ba76-fa6f46a2004c " />
This centering approach won't affect heading blocks:
<img width="267" alt="image" src="https://github.com/user-attachments/assets/3f3217e3-7e23-43fc-a7e5-33b6eadccc88 " />
2025-02-26 12:09:00 +00:00
d63f16da5e
fix(editor): affine preview root style ( #10420 )
...
Fix [BS-2677](https://linear.app/affine-design/issue/BS-2677/linked-doc-embed-view样式错误 )
1. Only show the border of embed synced doc block (in note) when hover.
2. Fix affine preview root padding style, set padding only when affine preview root in embed synced doc block (in surface).
3. Only add the footnote config extension to the chat panel and chat block center peek. For footnotes in other page preview scenarios, such as footnote nodes within embed synced doc blocks or embed linked doc blocks, the hover effect should be maintained.
2025-02-26 04:25:24 +00:00
162b7adc1b
fix(editor): should check text length and stop event propagation when adding a link ( #10391 )
2025-02-24 11:10:05 +00:00
Saul-Mirone