Sidebar Components

The sidebar (left panel) provides navigation, search, and entity browsing. It can be collapsed to give more space to the main content area.

Main Container

Panel Left (.panel-left)

The main sidebar container containing all navigation and browsing elements.

Navigation

Right Panel Nav (.right-panel-nav)

Navigation items for switching between views (Browse, Search, clipboard, etc.).

Browse Button (.browse-btn)

Opens the browse view.

Play Button (.nav-play-btn)

Starts playback from the current context.

Search Section

Search Activity (.search-activity)

Collapsible section containing the search input and results.

Search Container (.search-container)

The search input area with autocomplete support.

Search Autocomplete (.search-autocomplete)

Autocomplete dropdown showing tag and attribute suggestions.

Search History (.search-history)

Search history dropdown showing recent searches.

Clear History Button (.clear-history-btn)

Button to clear all search history.

Saved Searches

Saved searches panel showing saved search queries.

Recent Records

Recent records section showing recently viewed or added entities.

Toggle Saved Button (.toggle-saved-btn)

Button to toggle between search history and saved searches.

Show in Browse Button (.browse-btn)

Button to show current results in the Browse view.

Play All Button

Button to play all entities in the current list.

Clip All Button

Button to copy all entities to clipboard.

Entity List

Entity List Container (.entity-list-container)

Displays search results or browsed entities.

Entity Item (.entity-item)

Individual entity in the list. Shows play button on hover.

Entity Item Hover

Entity item with hover actions visible (play, open, clip).

Entity Actions (.entity-actions)

Container for row action buttons (play, open, clip).

Entity Adder Container (.entity-adder-container)

Container for adding entities.

File Drop Zone (.file-drop-zone)

Drop zone for adding files via drag and drop.

Entity Adder Button (.icon-btn)

Button to open file picker for adding entities.

Panel Resizer (.panel-resizer)

Resizable divider between left and right panels.

Show Sidebar Button (.panel-right-toggle)

Button to show/expand the sidebar when collapsed. Visible at the left edge of the main content area when the sidebar is hidden. Hover to reveal; may be partially obscured by the entity panel depending on focus.

Entity List Header (.entity-list-header)

Header showing entity count and sort options.

Collapsible Sections

Collapsible Section (.collapsible-section)

Collapsible panels that can be expanded/collapsed to save space.

Screenshot Files

File	Description	Selector
sidebar.png	Full sidebar	.panel-left
app-layout.png	App layout with sidebar	-
right-panel-nav.png	Navigation items	.right-panel-nav
search-section.png	Search section	.search-activity
search-container.png	Search input	.search-container
entity-list.png	Entity list container	.entity-list-container
entity-item.png	Single entity	.entity-item
entity-item-hover.png	Entity item with hover	.entity-item
entity-actions.png	Entity actions container	.entity-actions
entity-adder-container.png	Entity adder container	.entity-adder-container
file-drop-zone.png	File drop zone	.file-drop-zone
entity-adder-btn.png	Entity adder button	.icon-btn
panel-resizer.png	Panel resizer	.panel-resizer
show-sidebar-btn.png	Show sidebar button	.panel-right-toggle
clipboard-section.png	Collapsible section	.collapsible-section
search-autocomplete.png	Search autocomplete dropdown	.search-autocomplete
search-history.png	Search history dropdown	.search-history
clear-history-btn.png	Clear history button	.clear-history-btn
saved-searches-panel.png	Saved searches panel	.panel-left
recent-records.png	Recent records list	.entity-list-container
toggle-saved-btn.png	Toggle saved searches button	.toggle-saved-btn
show-in-browse-btn.png	Show in Browse button	.browse-btn
play-btn.png	Play all button	[title="Play (Alt+P)"]
clip-all-btn.png	Clip all button	[title="Clip all to clipboard"]