Editor Search & Navigation Suite — 6 components for document search, outline navigation, keyboard shortcuts, and minimap visualization.
Components
regex_search_bar/1— search + replace bar with regex/case/word togglesdocument_outline/1— nested heading list for document navigationnavigation_pane/1— tabbed sidebar with outline, bookmarks, and commentskeyboard_shortcuts_panel/1— grouped shortcut reference with<kbd>tagsgo_to_line/1— small dialog to jump to a specific line numberminimap/1— thin vertical document minimap with viewport indicator
Summary
Functions
Renders a nested navigation list of document headings indented by level.
Renders a small dialog with a line number input and "Go" button.
Renders a grouped keyboard shortcut reference panel.
Renders a thin vertical minimap bar with a viewport position indicator.
Renders a tabbed navigation sidebar with outline, bookmarks, and comments panels.
Renders a search + replace bar with regex, case-sensitivity, and whole-word toggle buttons, plus prev/next navigation and replace/replace-all actions.
Functions
Renders a nested navigation list of document headings indented by level.
Each heading is a map with :id, :text, and :level (1-6) keys.
The active_id highlights the currently visible heading.
Example
<.document_outline
id="outline"
active_id="heading-2"
headings={[
%{id: "heading-1", text: "Introduction", level: 1},
%{id: "heading-2", text: "Methods", level: 2}
]}
/>Attributes
id(:string) (required)headings(:list) - Defaults to[].active_id(:string) - Defaults tonil.class(:string) - Defaults tonil.- Global attributes are accepted.
Renders a small dialog with a line number input and "Go" button.
Hidden when visible is false.
Example
<.go_to_line id="goto" editor_id="my-editor" visible={@show_goto} />Attributes
id(:string) (required)editor_id(:string) (required)visible(:boolean) - Defaults tofalse.class(:string) - Defaults tonil.- Global attributes are accepted.
Renders a grouped keyboard shortcut reference panel.
Each shortcut is a map with :key, :description, and :category keys.
Shortcuts are grouped by category and displayed with <kbd> styled tags.
Example
<.keyboard_shortcuts_panel
id="shortcuts"
visible={true}
shortcuts={[
%{key: "Ctrl+B", description: "Bold", category: "Formatting"},
%{key: "Ctrl+I", description: "Italic", category: "Formatting"},
%{key: "Ctrl+F", description: "Find", category: "Navigation"}
]}
/>Attributes
id(:string) (required)shortcuts(:list) - Defaults to[].visible(:boolean) - Defaults tofalse.class(:string) - Defaults tonil.- Global attributes are accepted.
Renders a thin vertical minimap bar with a viewport position indicator.
The minimap shows the relative position and size of the viewport within the full document height.
Example
<.minimap
id="minimap"
content_height={2000}
viewport_height={600}
scroll_position={350}
/>Attributes
id(:string) (required)content_height(:integer) - Defaults to1000.viewport_height(:integer) - Defaults to500.scroll_position(:integer) - Defaults to0.class(:string) - Defaults tonil.- Global attributes are accepted.
Renders a search + replace bar with regex, case-sensitivity, and whole-word toggle buttons, plus prev/next navigation and replace/replace-all actions.
The match counter displays "N of M" when matches are found.
Example
<.regex_search_bar
id="search"
editor_id="my-editor"
query={@search_query}
match_count={@match_count}
current_match={@current_match}
/>Attributes
id(:string) (required)editor_id(:string) (required)query(:string) - Defaults to"".replace_text(:string) - Defaults to"".match_count(:integer) - Defaults to0.current_match(:integer) - Defaults to0.use_regex(:boolean) - Defaults tofalse.case_sensitive(:boolean) - Defaults tofalse.whole_word(:boolean) - Defaults tofalse.class(:string) - Defaults tonil.- Global attributes are accepted.