Note
This documentation describes the ActionPanel Vue component for native UI views for Xml templates see action-panel.
ActionPanel
A vertical panel that lists all ViewModel actions with a panel location. Actions are automatically grouped by their group property, with dividers between groups.
Import
import { ActionPanel } from '@neos/app'
Props
None. Reads actions from the injected ViewModel.
Notes
- Only shows actions where
action.location === ViewModelActionLocation.panel. - Groups with the same
groupvalue are rendered together, separated byDividercomponents. - Respects action visibility (
isVisible) and permission checks automatically.
Usage Examples
Sidebar action panel
<HorizontalLayout space="none" style="height: 100%">
<VerticalLayout space="small" style="width: 200px; padding: 8px; border-right: 1px solid #eee">
<ActionPanel />
</VerticalLayout>
<VerticalLayout space="none" style="flex: 1">
<Toolbar />
<Datagrid />
</VerticalLayout>
</HorizontalLayout>
In a drawer/modal
<Modal v-model:is-open="showActions">
<template #header>Actions</template>
<template #body>
<ActionPanel />
</template>
</Modal>