Table of Contents
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 group value are rendered together, separated by Divider components.
  • Respects action visibility (isVisible) and permission checks automatically.

Usage Examples

<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>