appflowy-editor icon indicating copy to clipboard operation
appflowy-editor copied to clipboard

[Bug] Problem when has scroll on top of appflowyeditor on web

Open hbedford opened this issue 6 months ago • 0 comments

Bug Description

When you add an ListView.builder on top of the AppflowyEditor, this is causing an problema with performance and write words with spaces. Losing characters like "space" some times

How to Reproduce

file auto_complete_editor.dart with ListView.builder

import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

final _options = {
  'hello ': 'world',
  'support@g': 'mail.com',
  'appflowy ': 'editor',
};

class AutoCompleteEditor extends StatelessWidget {
  const AutoCompleteEditor({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: SafeArea(
          child: Column(
            children: [
              const SizedBox(height: 100),
//added here
              Expanded(
                child: ListView.builder(
                  itemCount: 1,
                  itemBuilder: (_, __) => Container(
                    height: 500,
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.blue),
                    ),
                    child: AppFlowyEditor(
                      editorState: EditorState(
                        document: Document.blank(withInitialText: true),
                      ),
                      commandShortcutEvents: [
                        tabToAutoCompleteCommand,
                        ...standardCommandShortcutEvents,
                      ],
                      enableAutoComplete: true,
                      autoCompleteTextProvider: (context, node, textSpan) {
                        final editorState = context.read<EditorState>();
                        final selection = editorState.selection;
                        final delta = node.delta;
                        if (selection == null ||
                            delta == null ||
                            !selection.isCollapsed ||
                            selection.endIndex != delta.length ||
                            !node.path.equals(selection.start.path)) {
                          return null;
                        }
                        final text = delta.toPlainText().toLowerCase();
                        for (final option in _options.keys) {
                          if (text.endsWith(option)) {
                            return _options[option];
                          }
                        }
                        return null;
                      },
                    ),
                  ),
                ),
              ),
              const SizedBox(height: 16),
              Text(
                'AutoComplete Options: $_options',
                style: Theme.of(context).textTheme.titleLarge,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Expected Behavior

i tried to isolate the scrolllistener but not work, any sugestion?

Operating System

Web on Chrome

AppFlowy Editor Version(s)

5.2.0

Screenshots

No response

Additional Context

No response

hbedford avatar May 28 '25 14:05 hbedford