ask-reason-editor-sidebar

Integrates and configures the react-reason-editor-sidebar package for the REASON editor.

74|11|Updated Jul 4, 2024
One-click install
npx skills add https://github.com/OpenSourceAGI/qwksearch-research-agent --skill ask-reason-editor-sidebar-opensourceagi
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ask-reason-editor-sidebar
Source: https://github.com/OpenSourceAGI/qwksearch-research-agent/tree/main/skills/ask-reason-editor-sidebar
Command: npx skills add https://github.com/OpenSourceAGI/qwksearch-research-agent --skill ask-reason-editor-sidebar-opensourceagi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Developers wiring the REASON editor's sidebar into a host application need to understand its controlled-component API, five stackable panels, inferred split view, and localStorage-backed file-source system without reading the entire package source. ## Core Features & Use Cases - Sidebar Integration: Inject Sidebar and SidebarContent into ReasonDocs via props, keeping the one-way dependency between react-reason-editor and react-reason-editor-sidebar intact. - Panel & Split View Management: Control five panels (Open Tabs, Files, Outline, Related, AI) with togglePanel and sortPanels, where selecting two panels on a side creates a resizable split view. - File Sources & Storage Backends: Configure seven storage backends (local, SSH, S3, R2, B2, Google Docs, Turso) through localStorage-backed CRUD helpers rendered in the SidebarFooter picker. - Use Case: A developer building a document workspace mounts ReasonDocs, passes the sidebar components, implements onMove and onSetExpandedFolders callbacks so drag-and-drop and folder expansion persist, and enables the S3 file source for remote documents. ## Quick Start Ask the assistant to wire the Sidebar and SidebarContent components from react-reason-editor-sidebar into a ReasonDocs host with controlled document state and a working file-source picker.

Frequently Asked Questions about ask-reason-editor-sidebar

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add the sidebar to the REASON editor?▼

Pass Sidebar and SidebarContent from react-reason-editor-sidebar to ReasonDocs via the SidebarComponent and SidebarContentComponent props, and import the package's style.css. The sidebar is injected rather than imported by the editor, keeping the dependency one-way.

How do I enable split view in the reason editor sidebar?▼

Split view is inferred, not a mode: select two or more panels on the same side and they stack in a resizable split. Use togglePanel to compute the next panel list and sortPanels to restore canonical order.

What storage backends does the file source picker support?▼

Seven backends are supported as a discriminated union on type: local, ssh, s3, r2, b2, gdocs, and turso. The picker lives in SidebarFooter and renders only when the host passes onFileSourceChange.

Why does folder expansion reset when switching documents?▼

The host has not implemented onSetExpandedFolders. The toolbar's stepped expand/collapse replaces the expanded set wholesale, so without that callback the state lives only inside the tree and is lost on document change.

Are file source credentials synced across devices?▼

No. The file-source CRUD helpers are localStorage-backed, so credentials are per-browser and never reach a server. Use ssrSafeLocalStorage to avoid localStorage errors under SSR.