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.
Technical Advice for Implementation
Here’s how such a feature could potentially be implemented in AppFlowy :
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.
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.
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.
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.
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.
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.
Description
When multiple list items are selected, and the user presses
TAB
, it should indent all selected items. Right now, nothing happens.->
TAB
->This is expected behavior. Notion does it as well.
Impact
Users can quickly change the indentation of list items.
Additional Context
No response