Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: update editor version (#5918)

Browse Source 
* chore: update editor version

* fix: new property field width on Mobile

* feat: support enter to insert a new line on mobile

* feat: optimzie callout style

* feat: add hover effect on share button

* chore: fix

---------

Co-authored-by: Nathan.fooo <86001920+appflowy@users.noreply.github.com>
Co-authored-by: nathan <nathan@appflowy.io>
This commit is contained in:
Lucas.Xu 2024-08-10 20:49:06 +08:00 committed by GitHub
parent cd0f8d80e9
commit e2a923a796
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
18 changed files with 122 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/message/ai_markdown_text.dart
View File

@ -124,6 +124,7 @@ class _AppFlowyEditorMarkdownState extends State<_AppFlowyEditorMarkdown> {
editorScrollController: scrollController,
blockComponentBuilders: blockBuilders,
commandShortcutEvents: [customCopyCommand],
disableAutoScroll: true,
editorState: editorState,
),
);

1
frontend/appflowy_flutter/lib/plugins/database/grid/presentation/layout/sizes.dart
View File

@ -15,6 +15,7 @@ class GridSize {
static double get popoverItemHeight => 26 * scale;
static double get typeOptionSeparatorHeight => 4 * scale;
static double get newPropertyButtonWidth => 140 * scale;
static double get mobileNewPropertyButtonWidth => 200 * scale;
static EdgeInsets get cellContentInsets => EdgeInsets.symmetric(
horizontal: GridSize.cellHPadding,

2
frontend/appflowy_flutter/lib/plugins/database/grid/presentation/widgets/header/mobile_grid_header.dart
View File

@ -197,7 +197,7 @@ class _CreateFieldButtonState extends State<CreateFieldButton> {
Widget build(BuildContext context) {
return Container(
constraints: BoxConstraints(
maxWidth: GridSize.newPropertyButtonWidth,
maxWidth: GridSize.mobileNewPropertyButtonWidth,
minHeight: GridSize.headerHeight,
),
decoration: _getDecoration(context),

5
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_configuration.dart
View File

@ -189,7 +189,10 @@ Map<String, BlockComponentBuilder> getEditorBuilderMap({
),
),
CalloutBlockKeys.type: CalloutBlockComponentBuilder(
configuration: configuration.copyWith(),
configuration: configuration.copyWith(
padding: (node) => const EdgeInsets.symmetric(vertical: 10),
),
inlinePadding: const EdgeInsets.symmetric(vertical: 8.0),
defaultColor: calloutBGColor,
),
DividerBlockKeys.type: DividerBlockComponentBuilder(

3
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
View File

@ -154,6 +154,9 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
// callout block
insertNewLineInCalloutBlock,
// quote block
insertNewLineInQuoteBlock,
// toggle list
formatGreaterToToggleList,
insertChildNodeInsideToggleList,

22
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/base/emoji_picker_button.dart
View File

@ -20,6 +20,7 @@ class EmojiPickerButton extends StatelessWidget {
this.title,
this.showBorder = true,
this.enable = true,
this.margin,
});
final String emoji;
@ -33,6 +34,7 @@ class EmojiPickerButton extends StatelessWidget {
final String? title;
final bool showBorder;
final bool enable;
final EdgeInsets? margin;
@override
Widget build(BuildContext context) {
@ -44,6 +46,7 @@ class EmojiPickerButton extends StatelessWidget {
height: emojiPickerSize.height,
),
offset: offset,
margin: EdgeInsets.zero,
direction: direction ?? PopoverDirection.rightWithTopAligned,
popupBuilder: (_) => Container(
width: emojiPickerSize.width,
@ -79,15 +82,16 @@ class EmojiPickerButton extends StatelessWidget {
);
}
return FlowyTextButton(
emoji,
overflow: TextOverflow.visible,
fontSize: emojiSize,
padding: EdgeInsets.zero,
constraints: const BoxConstraints.tightFor(width: 36.0),
fillColor: Colors.transparent,
mainAxisAlignment: MainAxisAlignment.center,
onPressed: enable
return FlowyButton(
useIntrinsicWidth: true,
margin:
margin ?? const EdgeInsets.symmetric(horizontal: 8.0, vertical: 6.0),
text: FlowyText.emoji(
emoji,
fontSize: emojiSize,
optimizeEmojiAlign: true,
),
onTap: enable
? () async {
final result = await context.push<EmojiPickerResult>(
Uri(

70
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/callout/callout_block_component.dart
View File

@ -68,9 +68,11 @@ class CalloutBlockComponentBuilder extends BlockComponentBuilder {
CalloutBlockComponentBuilder({
super.configuration,
required this.defaultColor,
required this.inlinePadding,
});
final Color defaultColor;
final EdgeInsets inlinePadding;
@override
BlockComponentWidget build(BlockComponentContext blockComponentContext) {
@ -79,6 +81,7 @@ class CalloutBlockComponentBuilder extends BlockComponentBuilder {
key: node.key,
node: node,
defaultColor: defaultColor,
inlinePadding: inlinePadding,
configuration: configuration,
showActions: showActions(node),
actionBuilder: (context, state) => actionBuilder(
@ -105,9 +108,11 @@ class CalloutBlockComponentWidget extends BlockComponentStatefulWidget {
super.actionBuilder,
super.configuration = const BlockComponentConfiguration(),
required this.defaultColor,
required this.inlinePadding,
});
final Color defaultColor;
final EdgeInsets inlinePadding;
@override
State<CalloutBlockComponentWidget> createState() =>
@ -176,6 +181,7 @@ class _CalloutBlockComponentWidgetState
borderRadius: const BorderRadius.all(Radius.circular(8.0)),
color: backgroundColor,
),
padding: widget.inlinePadding,
width: double.infinity,
alignment: alignment,
child: Row(
@ -183,27 +189,22 @@ class _CalloutBlockComponentWidgetState
mainAxisSize: MainAxisSize.min,
textDirection: textDirection,
children: [
if (PlatformExtension.isDesktopOrWeb) const HSpace(4.0),
// the emoji picker button for the note
Padding(
padding: const EdgeInsets.only(
top: 6.0,
left: 4.0,
right: 4.0,
),
child: EmojiPickerButton(
key: ValueKey(
emoji.toString(),
), // force to refresh the popover state
enable: editorState.editable,
title: '',
emoji: emoji,
emojiSize: 16.0,
onSubmitted: (emoji, controller) {
setEmoji(emoji);
controller?.close();
},
),
EmojiPickerButton(
key: ValueKey(
emoji.toString(),
), // force to refresh the popover state
enable: editorState.editable,
title: '',
emoji: emoji,
emojiSize: 15.0,
onSubmitted: (emoji, controller) {
setEmoji(emoji);
controller?.close();
},
),
if (PlatformExtension.isDesktopOrWeb) const HSpace(4.0),
Flexible(
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 4.0),
@ -248,24 +249,21 @@ class _CalloutBlockComponentWidgetState
BuildContext context,
TextDirection textDirection,
) {
return Padding(
padding: padding,
child: AppFlowyRichText(
key: forwardKey,
delegate: this,
node: widget.node,
editorState: editorState,
placeholderText: placeholderText,
textSpanDecorator: (textSpan) => textSpan.updateTextStyle(
textStyle,
),
placeholderTextSpanDecorator: (textSpan) => textSpan.updateTextStyle(
placeholderTextStyle,
),
textDirection: textDirection,
cursorColor: editorState.editorStyle.cursorColor,
selectionColor: editorState.editorStyle.selectionColor,
return AppFlowyRichText(
key: forwardKey,
delegate: this,
node: widget.node,
editorState: editorState,
placeholderText: placeholderText,
textSpanDecorator: (textSpan) => textSpan.updateTextStyle(
textStyle,
),
placeholderTextSpanDecorator: (textSpan) => textSpan.updateTextStyle(
placeholderTextStyle,
),
textDirection: textDirection,
cursorColor: editorState.editorStyle.cursorColor,
selectionColor: editorState.editorStyle.selectionColor,
);
}

2
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/copy_and_paste/custom_cut_command.dart
View File

@ -1,6 +1,6 @@
import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/editor_state_paste_node_extension.dart';
import 'package:appflowy/plugins/document/presentation/editor_plugins/plugins.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:appflowy_editor/appflowy_editor.dart' hide EditorCopyPaste;
import 'package:flutter/material.dart';
/// cut.

2
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/copy_and_paste/custom_paste_command.dart
View File

@ -7,7 +7,7 @@ import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_p
import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/paste_from_plain_text.dart';
import 'package:appflowy/startup/startup.dart';
import 'package:appflowy_backend/log.dart';
import 'package:appflowy_editor/appflowy_editor.dart' hide Log;
import 'package:appflowy_editor/appflowy_editor.dart' hide Log, EditorCopyPaste;
import 'package:appflowy_editor_plugins/appflowy_editor_plugins.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

2
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/copy_and_paste/paste_from_html.dart
View File

@ -1,5 +1,5 @@
import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/editor_state_paste_node_extension.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:appflowy_editor/appflowy_editor.dart' hide EditorCopyPaste;
extension PasteFromHtml on EditorState {
Future<bool> pasteHtml(String html) async {

2
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/copy_and_paste/paste_from_in_app_json.dart
View File

@ -2,7 +2,7 @@ import 'dart:convert';
import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/editor_state_paste_node_extension.dart';
import 'package:appflowy_backend/log.dart';
import 'package:appflowy_editor/appflowy_editor.dart' hide Log;
import 'package:appflowy_editor/appflowy_editor.dart' hide Log, EditorCopyPaste;
extension PasteFromInAppJson on EditorState {
Future<bool> pasteInAppJson(String inAppJson) async {

2
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/copy_and_paste/paste_from_plain_text.dart
View File

@ -1,6 +1,6 @@
import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/editor_state_paste_node_extension.dart';
import 'package:appflowy/shared/patterns/common_patterns.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:appflowy_editor/appflowy_editor.dart' hide EditorCopyPaste;
extension PasteFromPlainText on EditorState {
Future<void> pastePlainText(String plainText) async {

1
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/plugins.dart
View File

@ -51,6 +51,7 @@ export 'openai/widgets/smart_edit_node_widget.dart';
export 'openai/widgets/smart_edit_toolbar_item.dart';
export 'outline/outline_block_component.dart';
export 'parsers/markdown_parsers.dart';
export 'quote/quote_block_shortcuts.dart';
export 'slash_menu/slash_menu_items.dart';
export 'table/table_menu.dart';
export 'table/table_option_action.dart';

39
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/quote/quote_block_shortcuts.dart Normal file
View File

@ -0,0 +1,39 @@
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:flutter/services.dart';
/// Pressing Enter in a quote block will insert a newline (\n) within the quote,
/// while pressing Shift+Enter in a quote will insert a new paragraph next to the quote.
///
/// - support
/// - desktop
/// - mobile
/// - web
///
final CharacterShortcutEvent insertNewLineInQuoteBlock = CharacterShortcutEvent(
key: 'insert a new line in quote block',
character: '\n',
handler: _insertNewLineHandler,
);
CharacterShortcutEventHandler _insertNewLineHandler = (editorState) async {
final selection = editorState.selection?.normalized;
if (selection == null) {
return false;
}
final node = editorState.getNodeAtPath(selection.start.path);
if (node == null || node.type != QuoteBlockKeys.type) {
return false;
}
// delete the selection
await editorState.deleteSelection(selection);
if (HardwareKeyboard.instance.isShiftPressed) {
await editorState.insertNewLine();
} else {
await editorState.insertTextAtCurrentSelection('\n');
}
return true;
};

25
frontend/appflowy_flutter/lib/plugins/shared/share/_shared.dart
View File

@ -1,5 +1,3 @@
import 'package:flutter/material.dart';
import 'package:appflowy/generated/locale_keys.g.dart';
import 'package:appflowy/plugins/database/application/tab_bar_bloc.dart';
import 'package:appflowy/plugins/shared/share/share_bloc.dart';
@ -7,7 +5,7 @@ import 'package:appflowy/plugins/shared/share/share_menu.dart';
import 'package:appflowy_popover/appflowy_popover.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
import 'package:flowy_infra_ui/widget/rounded_button.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
class ShareMenuButton extends StatelessWidget {
@ -55,18 +53,17 @@ class _ShareButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return RoundedTextButton(
title: LocaleKeys.shareAction_buttonText.tr(),
padding: const EdgeInsets.symmetric(horizontal: 14.0),
fontSize: 14.0,
fontWeight: FontWeight.w500,
borderRadius: const BorderRadius.all(
Radius.circular(10.0),
return FlowyButton(
text: FlowyText(
LocaleKeys.shareAction_buttonText.tr(),
fontSize: 14.0,
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onPrimary,
),
textColor: Theme.of(context).colorScheme.onPrimary,
onPressed: () {
// Do nothing, but it needs to provide an empty action in order to show cursorß
},
margin: const EdgeInsets.symmetric(horizontal: 14.0),
backgroundColor: Theme.of(context).colorScheme.primary,
hoverColor: Theme.of(context).colorScheme.primary.withOpacity(0.9),
radius: BorderRadius.circular(10.0),
);
}
}

3
frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
View File

@ -159,6 +159,7 @@ class FlowyButton extends StatelessWidget {
final double iconPadding;
final bool expand;
final Color? borderColor;
final Color? backgroundColor;
const FlowyButton({
super.key,
@ -183,6 +184,7 @@ class FlowyButton extends StatelessWidget {
this.iconPadding = 6,
this.expand = false,
this.borderColor,
this.backgroundColor,
});
@override
@ -211,6 +213,7 @@ class FlowyButton extends StatelessWidget {
borderRadius: radius ?? Corners.s6Border,
hoverColor: color,
borderColor: borderColor ?? Colors.transparent,
backgroundColor: backgroundColor ?? Colors.transparent,
),
onHover: disable ? null : onHover,
isSelected: () => isSelected,

8
frontend/appflowy_flutter/pubspec.lock
View File

@ -53,8 +53,8 @@ packages:
dependency: "direct main"
description:
path: "."
ref: "0317779"
resolved-ref: "031777941ce53fe1aaa9a23177f6045b142e6e73"
ref: "3d6aff0"
resolved-ref: "3d6aff0d21de96411675417ab952f315cc949c7a"
url: "https://github.com/AppFlowy-IO/appflowy-editor.git"
source: git
version: "3.1.0"
@ -1198,10 +1198,10 @@ packages:
dependency: "direct main"
description:
name: keyboard_height_plugin
sha256: bbb32804bf93601249c17c33125cd2e654f5ef650fc6acf1b031d69b478b35ce
sha256: "3a51c8ebb43465ebe0b3bad17f3b6d945421e58011f3f5a08134afe69a3d775f"
url: "https://pub.dev"
source: hosted
version: "0.0.5"
version: "0.1.5"
leak_tracker:
dependency: "direct main"
description:

4
frontend/appflowy_flutter/pubspec.yaml
View File

@ -124,7 +124,7 @@ dependencies:
image_gallery_saver: ^2.0.3
cached_network_image: ^3.3.0
leak_tracker: ^10.0.0
keyboard_height_plugin: ^0.0.5
keyboard_height_plugin: ^0.1.5
scrollable_positioned_list: ^0.3.8
flutter_cache_manager: ^3.3.1
share_plus: ^7.2.1
@ -199,7 +199,7 @@ dependency_overrides:
appflowy_editor:
git:
url: https://github.com/AppFlowy-IO/appflowy-editor.git
ref: "0317779"
ref: "3d6aff0"
appflowy_editor_plugins:
git: