AppFlowy-IO / AppFlowy

Bring projects, wikis, and teams together with AI. AppFlowy is an AI collaborative workspace where you achieve more without losing control of your data. The best open source alternative to Notion.
https://www.appflowy.io
GNU Affero General Public License v3.0
55.54k stars 3.62k forks source link

[FR] Multiple list indentation at one #6255

Open Timisorean opened 1 week ago

Timisorean commented 1 week ago

Description

When multiple list items are selected, and the user presses TAB, it should indent all selected items. Right now, nothing happens.

image -> TAB -> image

This is expected behavior. Notion does it as well.

Impact

Users can quickly change the indentation of list items.

Additional Context

No response

Digital365Staking commented 1 week ago

Technical Advice for Implementation Here’s how such a feature could potentially be implemented in AppFlowy :

  1. Capture the Multi-Selection Event Detecting Multiple Selections: First, the editor needs to detect when multiple list items are selected. Most editors track the start and end positions of selections (e.g., in HTML, selections are tracked with a range object). In Flutter, the logic could rely on identifying when multiple text blocks (list items) are selected.
  2. Modify the Tab Key Behavior Handle TAB Key Input: By default, the TAB key may focus on UI elements, but it can be overridden in an editor to apply indentation. Flutter's RawKeyboardListener could be used to detect when the TAB key is pressed and determine if list items are selected.
  3. Apply Indentation Increase Indentation: Once the TAB key is detected, the indentation logic should be triggered. This could involve: Adjusting the padding or margin of the selected list items to reflect the increased indentation level. Modifying the data model (e.g., adding a property that reflects the indent level) so the indentation is persistent. For lists, this usually means converting the selected items into a sub-list or increasing their nesting depth.
  4. Handle SHIFT + TAB for Outdenting SHIFT + TAB for Reducing Indentation: To complete the feature, you would also need to support outdenting, typically done by pressing SHIFT + TAB. The logic here would reverse the indentation effect applied by the TAB key.
  5. Handling Mixed Content Maintain Structure Consistency: If multiple items include different levels of indentation, the function should increment the indentation by one level for each item, relative to their current indentation, maintaining the relative hierarchy.
  6. Performance Considerations Real-time Updating: Ensuring that updates to the document structure (especially large documents) don’t cause performance lags when multiple items are being indented simultaneously.