[PR #1732] [MERGED] feat: callout #4921

New issue

Closed

opened 2026-03-23 22:16:25 +00:00 by mirror · 0 comments

mirror commented

2026-03-23 22:16:25 +00:00

Owner

📋 Pull Request Information

Original PR: https://github.com/AppFlowy-IO/AppFlowy/pull/1732
Author: @abichinger
Created: 1/20/2023
Status: ✅ Merged
Merged: 1/30/2023
Merged by: @LucasXu0

Base: main ← Head: feat/callout

📝 Commits (10+)

adce9c2 feat: add callout plugin
44116e5 refactor: add SelectionMenuItem.node factory
08bf353 feat: add color picker
69272e9 feat: add popover to callout
7bc293e feat: add emoji to callout
775d07e fix: store tint name
f32ca6f fix: remove leading underscores
0279efd fix: revert export of editor_entry
e97ea89 refactor: move color tint names to appflowy_editor
0c6eddd fix: #1732 only re-insert text node if it's parent is text node too while deleting

📊 Changes

15 files changed (+806 additions, -34 deletions)

View changed files

📝 frontend/app_flowy/lib/plugins/document/document_page.dart (+3 -1)
📝 frontend/app_flowy/packages/appflowy_editor/lib/l10n/intl_en.arb (+19 -1)
📝 frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_all.dart (+27 -26)
📝 frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_en.dart (+18 -0)
📝 frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/l10n.dart (+180 -0)
📝 frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection_menu/selection_menu_widget.dart (+75 -0)
📝 frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart (+2 -1)
📝 frontend/app_flowy/packages/appflowy_editor_plugins/lib/appflowy_editor_plugins.dart (+3 -1)
➕ frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/callout/callout_node_widget.dart (+291 -0)
➕ frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/extensions/theme_extension.dart (+56 -0)
📝 frontend/app_flowy/packages/appflowy_editor_plugins/pubspec.yaml (+5 -1)
📝 frontend/app_flowy/packages/flowy_infra/lib/theme_extension.dart (+44 -0)
📝 frontend/app_flowy/packages/flowy_infra/pubspec.lock (+1 -1)
📝 frontend/app_flowy/packages/flowy_infra/pubspec.yaml (+2 -2)
➕ frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/color_picker.dart (+80 -0)

📄 Description

solves: #1661

While implementing this feature i noticed some issues:

I couldn't find a color picker widget, which is reusable. Therefore I created FlowyColorPicker inside flowy_infra_ui.
The existing color pickers inside the codebase could be replaced with the new widget FlowyColorPicker:

This if-block inserts a TextNode everytime a child node of the Callout is deleted. To me that looks like a bug, because I don't expect every plugin to override the backspace shortcut.
The actions, which get displayed while hovering over a Node inside the document, are not consistent. (e.g. the actions of an image look different than the ones of a code block).

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/AppFlowy-IO/AppFlowy/pull/1732 **Author:** [@abichinger](https://github.com/abichinger) **Created:** 1/20/2023 **Status:** ✅ Merged **Merged:** 1/30/2023 **Merged by:** [@LucasXu0](https://github.com/LucasXu0) **Base:** `main` ← **Head:** `feat/callout` --- ### 📝 Commits (10+) - [`adce9c2`](https://github.com/AppFlowy-IO/AppFlowy/commit/adce9c27fc820dcbe8e180786a37f9cc9ab612bc) feat: add callout plugin - [`44116e5`](https://github.com/AppFlowy-IO/AppFlowy/commit/44116e5726f2645a302e108826906996ddba452c) refactor: add SelectionMenuItem.node factory - [`08bf353`](https://github.com/AppFlowy-IO/AppFlowy/commit/08bf3531cf1ca2fd25d48db05b96bd7165b0a680) feat: add color picker - [`69272e9`](https://github.com/AppFlowy-IO/AppFlowy/commit/69272e911a2da280e6031ba3e587b65562b94632) feat: add popover to callout - [`7bc293e`](https://github.com/AppFlowy-IO/AppFlowy/commit/7bc293e54b07c6697a27fd65dfe2ecbfd2bd7c5a) feat: add emoji to callout - [`775d07e`](https://github.com/AppFlowy-IO/AppFlowy/commit/775d07ef834462aaa2766f016fa1d02998f7c060) fix: store tint name - [`f32ca6f`](https://github.com/AppFlowy-IO/AppFlowy/commit/f32ca6f8a9aac5b71a8cf82ad0c73205ee0d5ac4) fix: remove leading underscores - [`0279efd`](https://github.com/AppFlowy-IO/AppFlowy/commit/0279efd43f53c0b9e8ef9d4a55a1cb665d9bee3b) fix: revert export of editor_entry - [`e97ea89`](https://github.com/AppFlowy-IO/AppFlowy/commit/e97ea891afeeb525c80690cda9ba9637dc2cdd61) refactor: move color tint names to appflowy_editor - [`0c6eddd`](https://github.com/AppFlowy-IO/AppFlowy/commit/0c6edddeb8aff29f90069ceb6597b3bf3382c7fd) fix: #1732 only re-insert text node if it's parent is text node too while deleting ### 📊 Changes **15 files changed** (+806 additions, -34 deletions) <details> <summary>View changed files</summary> 📝 `frontend/app_flowy/lib/plugins/document/document_page.dart` (+3 -1) 📝 `frontend/app_flowy/packages/appflowy_editor/lib/l10n/intl_en.arb` (+19 -1) 📝 `frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_all.dart` (+27 -26) 📝 `frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_en.dart` (+18 -0) 📝 `frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/l10n.dart` (+180 -0) 📝 `frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection_menu/selection_menu_widget.dart` (+75 -0) 📝 `frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart` (+2 -1) 📝 `frontend/app_flowy/packages/appflowy_editor_plugins/lib/appflowy_editor_plugins.dart` (+3 -1) ➕ `frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/callout/callout_node_widget.dart` (+291 -0) ➕ `frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/extensions/theme_extension.dart` (+56 -0) 📝 `frontend/app_flowy/packages/appflowy_editor_plugins/pubspec.yaml` (+5 -1) 📝 `frontend/app_flowy/packages/flowy_infra/lib/theme_extension.dart` (+44 -0) 📝 `frontend/app_flowy/packages/flowy_infra/pubspec.lock` (+1 -1) 📝 `frontend/app_flowy/packages/flowy_infra/pubspec.yaml` (+2 -2) ➕ `frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/color_picker.dart` (+80 -0) </details> ### 📄 Description solves: #1661 While implementing this feature i noticed some issues: 1. I couldn't find a color picker widget, which is reusable. Therefore I created `FlowyColorPicker` inside `flowy_infra_ui`. The existing color pickers inside the codebase could be replaced with the new widget `FlowyColorPicker`: - https://github.com/AppFlowy-IO/AppFlowy/blob/0100305af0bc10d2bb2e724febac97e3ef436274/frontend/app_flowy/packages/appflowy_editor/lib/src/render/toolbar/toolbar_item.dart#L538 - https://github.com/AppFlowy-IO/AppFlowy/blob/0100305af0bc10d2bb2e724febac97e3ef436274/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option_editor.dart#L68 2. This [if-block](https://github.com/AppFlowy-IO/AppFlowy/blob/0100305af0bc10d2bb2e724febac97e3ef436274/frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart#L121) inserts a `TextNode` everytime a child node of the Callout is deleted. To me that looks like a bug, because I don't expect every plugin to override the backspace shortcut. 3. The actions, which get displayed while hovering over a `Node` inside the document, are not consistent. (e.g. the actions of an image look different than the ones of a code block). --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>