zidanecode/editor/EditorColumn
import { … } from 'zidane-ui/code/editor'ui/src/code/editor/EditorColumn.tsx
Components#
EditorColumnComponent#
A tab strip over one editor per open file (or view), every tab kept mounted. The owner holds
open and active; the column reports picks, closes, reorders and unsaved state.
function EditorColumn(props: EditorColumnProps): ElementParameters
| Name | Type | Description |
|---|---|---|
| props | EditorColumnProps | See |
Returns
ElementProps
| Name | Type | Description |
|---|---|---|
| active | string | null | The id in |
| className? | string | Extra classes on the column's outer element. |
| empty? | ReactNode | Shown while nothing is open. Default: the |
| fs | FileSystemAdapter | Reads, writes and watches the files the tabs open. |
| language? | EditorLanguage | null | Findings, hovers and definitions for the files it handles. |
| onActivate | (path: string) => void | A tab was picked; the owner makes it |
| onClose | (path: string) => void | A tab's close button or a middle-click; the owner drops it from |
| onDirtyChange? | (path: string, dirty: boolean) => void | A file's unsaved state changed. |
| onNavigate? | (target: EditorLocation) => void | Open a file at a position (a definition, a reference). |
| onReorder | (paths: readonly string[]) => void | The tabs' new order (a drag, a keyboard move). |
| open | readonly string[] | Open files and views, in tab order. |
| readOnly? | (path: string) => boolean | Files shown read-only (type definitions). |
| reveal? | EditorReveal | null | A position to show in an open file, once per nonce. |
| scope? | string | Keys pierre's retained edit state, so two columns never share a draft. |
| style? | CSSProperties | Inline styles on the root element, merged after the component's own. |
| trailing? | ReactNode | After the tabs, on the strip's right (an action). |
| views? | Readonly<Record<string, EditorView>> | Tabs that are not files, by their id in |
Interfaces#
EditorColumnPropsInterface#
Props of EditorColumn.
interface EditorColumnPropsProperties
| Name | Type | Description |
|---|---|---|
| active | string | null | The id in |
| className? | string | Extra classes on the column's outer element. |
| empty? | ReactNode | Shown while nothing is open. Default: the |
| fs | FileSystemAdapter | Reads, writes and watches the files the tabs open. |
| language? | EditorLanguage | null | Findings, hovers and definitions for the files it handles. |
| onActivate | (path: string) => void | A tab was picked; the owner makes it |
| onClose | (path: string) => void | A tab's close button or a middle-click; the owner drops it from |
| onDirtyChange? | (path: string, dirty: boolean) => void | A file's unsaved state changed. |
| onNavigate? | (target: EditorLocation) => void | Open a file at a position (a definition, a reference). |
| onReorder | (paths: readonly string[]) => void | The tabs' new order (a drag, a keyboard move). |
| open | readonly string[] | Open files and views, in tab order. |
| readOnly? | (path: string) => boolean | Files shown read-only (type definitions). |
| reveal? | EditorReveal | null | A position to show in an open file, once per nonce. |
| scope? | string | Keys pierre's retained edit state, so two columns never share a draft. |
| style? | CSSProperties | Inline styles on the root element, merged after the component's own. |
| trailing? | ReactNode | After the tabs, on the strip's right (an action). |
| views? | Readonly<Record<string, EditorView>> | Tabs that are not files, by their id in |
EditorViewInterface#
A tab that is not a file (EditorColumnProps.views).
interface EditorViewProperties
| Name | Type | Description |
|---|---|---|
| body | ReactNode | Fills the column while the tab is active; mounted (hidden) while it is open. |
| glyph | ReactNode | Drawn before the label. |
| label | string | The tab's text. |
| title? | string | The tab's tooltip. Default: the label. |