@nextcloud/vueNcAppSidebar #
Props #
| Prop name | Description | Type | Values | Default |
|---|---|---|---|---|
| active | string | - | '' | |
| title | string | - | '' | |
| titleEditable | Allow to edit the sidebar title. | boolean | - | false |
| titlePlaceholder | string | - | '' | |
| subtitle | string | - | '' | |
| subtitleTooltip | string | - | '' | |
| background | Url to the top header background image Applied with css | string | - | '' |
| starred | Enable the favourite icon if not null See fired events | boolean | - | null |
| starLoading | Show loading spinner instead of the star icon | boolean | - | false |
| loading | Show loading spinner instead of tabs | boolean | - | false |
| compact | Display the sidebar in compact mode | boolean | - | false |
| empty | Only display close button and default slot content. Don't display other header content and primary and secondary actions. Useful when showing the EmptyContent component as content. | boolean | - | false |
| forceMenu | Force the actions to display in a three dot menu | boolean | - | false |
| linkifyTitle | Linkify the title | boolean | - | false |
| titleTooltip | Tooltip to display for the title. Can be set to the same text in case it's too long. | string | - | '' |
Events #
| Event name | Properties | Description |
|---|---|---|
| close | The user clicked to closed the sidebar | |
| closing | The sidebar is closing and the transition is in progress | |
| closed | The sidebar is closed and the transition is complete | |
| opening | The sidebar is opening and the transition is in progress | |
| opened | The sidebar is opened and the transition is complete | |
| figure-click | The figure/background header has been clicked | |
| update:starred | Emitted when the starred value changes | |
| update:titleEditable | Emitted when the titleEditable value changes | |
| update:title | Emitted when the title value changes | |
| update:active | The active tab changed | |
| submit-title | Emitted when the title edit input has been submitted | |
| dismiss-editing | Emitted when the title edit has been cancelled |
Slots #
| Name | Description | Bindings |
|---|---|---|
| header | ||
| tertiary-actions | ||
| secondary-actions | ||
| description | ||
| default |
General description #
This component provides a way to include the standardised sidebar. The standard properties like title, subtitle, starred, etc. allow to automatically include a standard-header like it's used by the files app.
Standard usage #
loading...
Editable title #
loading...
Editable title after click with custom tertiary action #
loading...
Empty sidebar for e.g. empty content component. #
loading...
NcAppSidebarTabs #
Props #
| Prop name | Description | Type | Values | Default |
|---|---|---|---|---|
| active | Id of the tab to activate | string | - | '' |
Events #
| Event name | Properties | Description |
|---|---|---|
| update:active |
Slots #
| Name | Description | Bindings |
|---|---|---|
| default |