Jorge Manrubia
37fd2b248d
- Make them navigable by keyboard (UP, DOWN, ENTER to activate option). - Filter based on the actual text in the element, use containment condition instead of CSS selector on value prefix. - Make all the elements in the filter searchable and reachable by keyboard.
20 lines
1.0 KiB
Plaintext
20 lines
1.0 KiB
Plaintext
<%= tag.div \
|
|
id: "command-terminal",
|
|
class: "terminal full-width flex flex-column justify-end",
|
|
data: {
|
|
controller: "toggle-class terminal navigable-list",
|
|
terminal_error_class: "terminal--error",
|
|
terminal_confirmation_class: "terminal--confirmation",
|
|
terminal_help_class: "terminal--showing-help",
|
|
terminal_output_class: "terminal--showing-output",
|
|
terminal_busy_class: "terminal--busy",
|
|
toggle_class_toggle_class: "terminal--open",
|
|
navigable_list_reverse_order_value: true,
|
|
action: "keydown->terminal#handleKeyPress keydown->navigable-list#navigate focusin->navigable-list#select keydown.esc->toggle-class#remove:stop keydown.esc->terminal#focus keydown.esc->navigable-list#selectLast keydown.esc@document->terminal#hideMenus" } do %>
|
|
<%= turbo_frame_tag :recent_commands, src: commands_path, data: { terminal_target: "recentCommands" } %>
|
|
<div class="terminal__output" data-terminal-target="output"></div>
|
|
|
|
<%= render "commands/form" %>
|
|
<% end %>
|
|
|