@conduction/nextcloud-vue 2.56.0-beta.14 → 2.56.0-beta.15

package/dist/nextcloud-vue.cjs.js.map

@@ -1,4 +1,4 @@
 [diffend] Oversized file quarantined before diffing.
 name: package/dist/nextcloud-vue.cjs.js.map
-size: 35372297 bytes
-sha256: 7065df25e721d338e4612aac2ee75c58c87fb5e17477c811e7bcf66cee41783d
+size: 35426060 bytes
+sha256: 84895efa944d4151e7030482714b1c85ffc1a2d24cb225657e3deb7d45bd2432

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/nextcloud-vue",
-  "version": "2.56.0-beta.14",
+  "version": "2.56.0-beta.15",
   "description": "Shared Vue component library for Conduction Nextcloud apps — complements @nextcloud/vue with higher-level components, OpenRegister integration, and NL Design System support",
   "homepage": "https://github.com/ConductionNL/nextcloud-vue#readme",
   "bugs": {

package/scripts/.jsdoc-baselines.json

@@ -111,7 +111,7 @@
   "CnIconPicker": 1,
   "CnImageWidget": 1,
   "CnImageWidgetForm": 1,
-  "CnIndexPage": 0.74,
+  "CnIndexPage": 0.79,
   "CnIndexSidebar": 0.69,
   "CnInfoWidget": 1,
   "CnIntegrationCard": 1,
@@ -202,7 +202,7 @@
   "CnRichSubmitDialog": 1,
   "CnRoadmapItem": 1,
   "CnRoadmapTab": 1,
-  "CnRowActions": 0.8,
+  "CnRowActions": 1,
   "CnSavedViewsControl": 1,
   "CnSaveViewDialog": 1,
   "CnSchemaFormDialog": 0.79,

package/src/components/CnContextMenu/CnContextMenu.vue

@@ -12,7 +12,7 @@
 			@close="onClose"
 			@closed="onClosed">
 			<!-- Dynamic actions from array prop -->
-			<template v-for="{ action, link } in renderedActions" :key="action.label">
+			<template v-for="{ action, link } in renderedActions" :key="actionKey(action)">
 				<!-- A navigate-only action is a real link, so it can be middle-clicked, opened in a new tab or copied. -->
 				<NcActionLink
 					v-if="link"
@@ -20,7 +20,7 @@
 					:target="link.target"
 					:title="resolveTitle(action)"
 					:class="{ 'cn-row-action--destructive': action.destructive }"
-					:data-testid="`cn-action-item-${slugifyLabel(action.label)}`"
+					:data-testid="actionTestId(action)"
 					closeAfterClick
 					@click="onLinkAction(action, link, $event)">
 					<template v-if="action.icon" #icon>
@@ -34,7 +34,7 @@
 					:title="resolveTitle(action)"
 					:disabled="resolveDisabled(action)"
 					:class="{ 'cn-row-action--destructive': action.destructive }"
-					:data-testid="`cn-action-item-${slugifyLabel(action.label)}`"
+					:data-testid="actionTestId(action)"
 					closeAfterClick
 					@click="onAction(action)">
 					<template v-if="action.icon" #icon>
@@ -95,6 +95,7 @@ import { NcActionButton, NcActionLink, NcActions } from '@nextcloud/vue'
 import { CTX_MENU_DATA_ATTR, CTX_MENU_POPPER_ATTR } from '../../composables/useContextMenu.js'
 import { followItemActionLink, resolveItemActionLink } from '../../utils/actionLink.js'
 import { isModifiedClick } from '../../utils/linkNavigation.js'
+import { isRowActionVisible, rowActionKey, rowActionPayload, rowActionTestId, slugifyActionLabel } from '../../utils/rowActionItem.js'
 import { CnIcon } from '../CnIcon/index.js'
 
 /**
@@ -109,12 +110,13 @@ import { CnIcon } from '../CnIcon/index.js'
  * cursor positioning). The composable handles the DOM attributes; this component
  * handles the NcActions template boilerplate.
  *
- * Dynamic actions (CnIndexPage pattern)
+ * Dynamic actions (CnIndexPage pattern).
+ * CnIndexPage passes the same per-row list its row actions menu renders, so the two menus always match.
  * ```vue
  * <CnContextMenu
  *   v-model:open="contextMenuOpen"
- *   :actions="mergedActions"
- *   :target-item="contextMenuRow"
+ *   :actions="rowActionsFor(contextMenuShownRow)"
+ *   :target-item="contextMenuShownRow"
  *   @action="$emit('action', $event)"
  *   @close="closeContextMenu" />
  * ```
@@ -161,13 +163,15 @@ export default {
 		 * `visible` (boolean | (targetItem) => boolean) hides the entry when falsy
 		 * (default: shown). `title` (string | (targetItem) => string) renders as
 		 * a native tooltip — useful for explaining why an entry is disabled.
+		 * A locally decidable `visibleWhen` that is false for the target hides the entry too, as in CnRowActions.
+		 * `id` is passed in the `action` payload; `builtin` marks a CnIndexPage built-in, whose testid is `cn-action-item-<id>` in every locale.
 		 * `href` (URL) or `to` (vue-router location), each a value or a
 		 * `(targetItem) => …` function, render the entry as a real link, with
 		 * `linkTarget` as its `target`; a link emits `action` but does not call
 		 * `handler`. When the entire array is empty (or all entries are filtered
 		 * out), only the default slot content is rendered.
 		 *
-		 * @type {Array<{label: string, icon: object | string, handler: (targetItem: object) => void, disabled: boolean | ((targetItem: object) => boolean), visible: boolean | ((targetItem: object) => boolean), title: string | ((targetItem: object) => string), destructive: boolean, href: string | ((targetItem: object) => string), to: string | object | ((targetItem: object) => string | object), linkTarget: string}>}
+		 * @type {Array<{label: string, id: string, builtin: boolean, icon: object | string, handler: (targetItem: object) => void, disabled: boolean | ((targetItem: object) => boolean), visible: boolean | ((targetItem: object) => boolean), visibleWhen: object, title: string | ((targetItem: object) => string), destructive: boolean, href: string | ((targetItem: object) => string), to: string | object | ((targetItem: object) => string | object), linkTarget: string}>}
 		 */
 		actions: {
 			type: Array,
@@ -209,21 +213,13 @@ export default {
 
 	computed: {
 		/**
-		 * Filter actions by their `visible` predicate. Entries without
-		 * `visible` are always shown (backwards compatible).
+		 * Filter actions by their `visibleWhen` and `visible` gates, with the same rule CnRowActions uses.
+		 * Entries without either always show.
 		 *
 		 * @return {Array} Visible actions for the current targetItem.
 		 */
 		visibleActions() {
-			return this.actions.filter((action) => {
-				if (action.visible === undefined) {
-					return true
-				}
-				if (typeof action.visible === 'function') {
-					return !!action.visible(this.targetItem)
-				}
-				return !!action.visible
-			})
+			return this.actions.filter((action) => isRowActionVisible(action, this.targetItem))
 		},
 
 		/**
@@ -466,18 +462,33 @@ export default {
 
 		/**
 		 * Slugify an action label for use in stable `data-testid` selectors.
-		 * Lowercase, kebab-case, strip non-alphanumeric. Used solely by the
-		 * `:data-testid` binding on NcActionButton — does not affect runtime
-		 * behaviour or rendered text.
+		 * Lowercase, kebab-case, strip non-alphanumeric.
 		 *
 		 * @param {string} label The action's display label.
 		 * @return {string} kebab-case slug suitable for a testid suffix.
 		 */
 		slugifyLabel(label) {
-			return String(label || '')
-				.toLowerCase()
-				.replace(/[^a-z0-9]+/g, '-')
-				.replace(/^-+|-+$/g, '')
+			return slugifyActionLabel(label)
+		},
+
+		/**
+		 * The entry's `data-testid`: `cn-action-item-<id>` for a built-in, the label slug otherwise.
+		 *
+		 * @param {object} action The action descriptor.
+		 * @return {string} The testid.
+		 */
+		actionTestId(action) {
+			return rowActionTestId(action)
+		},
+
+		/**
+		 * The entry's render key: `builtin:<id>` for a built-in, the label otherwise.
+		 *
+		 * @param {object} action The action descriptor.
+		 * @return {string} The key.
+		 */
+		actionKey(action) {
+			return rowActionKey(action)
 		},
 
 		onAction(action) {
@@ -485,10 +496,10 @@ export default {
 				action.handler(this.targetItem)
 			}
 			/**
-			 * @event action User picked an entry from the menu. The action's own `handler(targetItem)` (when present) ran synchronously before this event fires; the event lets parents observe / log the choice.
-			 * @type {{ action: string, row: object|null }}
+			 * @event action User picked an entry from the menu. The action's own `handler(targetItem)` (when present) ran synchronously before this event fires; the event lets parents observe / log the choice. Payload: `action` (the label), the target as `row`, the action's `id` when it has one, and `builtin: true` for a CnIndexPage built-in.
+			 * @type {{ action: string, row: object|null, id?: string, builtin?: boolean }}
 			 */
-			this.$emit('action', { action: action.label, row: this.targetItem })
+			this.$emit('action', rowActionPayload(action, this.targetItem))
 		},
 
 		/**
@@ -506,7 +517,7 @@ export default {
 				return
 			}
 			followItemActionLink(event, link, this.$router)
-			this.$emit('action', { action: action.label, row: this.targetItem })
+			this.$emit('action', rowActionPayload(action, this.targetItem))
 		},
 
 		onClose() {

package/src/components/CnIndexPage/CnIndexPage.md

@@ -866,6 +866,27 @@ actions, and the page's declaration stands as before. Wire the field on one
 list first, then check `rowActionsNotDeclared` to see what the server is
 offering that you have not declared yet.
 
+The built-in View, Edit, Copy and Delete carry the ids `view`, `edit`, `copy` and `delete`, and match this block by id only, never by their label.
+The right-click menu reads the same per-row list as the actions menu, so it drops the same refused actions.
+
+## Placing built-in row actions
+
+A `"builtin:view"`, `"builtin:edit"`, `"builtin:copy"` or `"builtin:delete"` string in `actions` puts that built-in at its position; enabled built-ins the array does not place are appended in the default order, and the `show*Action` toggles still decide whether each renders.
+
+```json
+"actionToggles": { "showViewAction": false },
+"actions": [
+  "builtin:edit",
+  "builtin:copy",
+  { "id": "file-list", "label": "File list", "handler": "openPublicationFiles" },
+  "builtin:delete"
+]
+```
+
+This renders Edit, Copy, File list, Delete, and makes Edit the keyboard primary action.
+The keyboard primary action is the first entry the menu shows and enables, so a hidden or disabled entry is skipped.
+See the CnIndexPage docs page for the full rules.
+
 ## State indicators on a row
 
 Declare `rowIndicators` and a row carries the flags a handler triages on. Each

package/src/components/CnIndexPage/CnIndexPage.vue

@@ -692,11 +692,11 @@
 					</template>
 				</CnCardGrid>
 
-				<!-- Right-click context menu (positioned at cursor via CSS) -->
+				<!-- Right-click context menu (positioned at cursor via CSS). Same per-row list as the row actions menu, so the two never drift. -->
 				<CnContextMenu
 					v-model:open="contextMenuOpen"
-					:actions="mergedActions"
-					:targetItem="contextMenuRow"
+					:actions="rowActionsFor(contextMenuShownRow)"
+					:targetItem="contextMenuShownRow"
 					@action="onRowAction"
 					@close="closeContextMenu" />
 
@@ -812,8 +812,10 @@ import { resolveClaimedTeams, resolveClaimTokens, splitViewsIntoTabs, viewAsTab,
 import { LIST_SHORTCUTS, listPaletteCommands, shortcutFor } from '../../utils/listShortcuts.js'
 import { multiKeySort } from '../../utils/multiKeySort.js'
 import { resolveDeepTokens, resolveFilterValue } from '../../utils/resolveFilterTokens.js'
+import { resolveRowActions } from '../../utils/resolveRowActions.js'
 import { resolveFilterMap } from '../../utils/routeFilters.js'
 import { availableRowActions, DEFAULT_ROW_ACTION_FIELD, refusalReasonFor, undeclaredRowActions } from '../../utils/rowActionAvailability.js'
+import { isRowActionVisible, rowActionPayload } from '../../utils/rowActionItem.js'
 import { isNewTabClick, isNewTabHandled, isRowMiddleClick, markNewTabHandled, preventMiddleClickAutoscroll } from '../../utils/rowAuxClick.js'
 import { DEFAULT_ROW_INDICATOR_CAP } from '../../utils/rowIndicators.js'
 import { buildRouteQueryFromViewState, buildViewCreatePayload, extractViewState, extractViewStateFromRouteQuery, savedViewScope, viewMatchesScope } from '../../utils/savedViewHelpers.js'
@@ -1687,7 +1689,11 @@ export default {
 			default: () => ({}),
 		},
 
-		/** Row action definitions (app-provided, merged with built-in actions) */
+		/**
+		 * Row action definitions, merged with the built-in View / Edit / Copy / Delete.
+		 * Objects are app actions.
+		 * A `"builtin:view"`, `"builtin:edit"`, `"builtin:copy"` or `"builtin:delete"` string places that built-in at its position when its `show*Action` toggle is on; enabled built-ins not placed are appended in that order.
+		 */
 		actions: {
 			type: Array,
 			default: () => [],
@@ -2761,6 +2767,8 @@ export default {
 			folderRowLayouts: {},
 			/** The row the keyboard is on, or -1. */
 			focusedRowIndex: -1,
+			// The row the context menu shows: set on open, never cleared on close, so a closing menu keeps its entries and a late close cannot null a reopened one.
+			contextMenuShownRow: null,
 			/** The row a quick edit is open on, or null. */
 			quickEditRow: null,
 			/** The row as the server holds it, after a stale save. */
@@ -3473,7 +3481,7 @@ export default {
 			if (this.quickEditFields.length > 0) {
 				handlers['row-quick-edit'] = () => this.focusedRow && this.openQuickEdit(this.focusedRow)
 			}
-			if (this.focusedRow && this.rowActionsFor(this.focusedRow).length > 0) {
+			if (this.focusedRow && this.primaryRowActionFor(this.focusedRow)) {
 				handlers['row-primary'] = () => this.runPrimaryRowAction()
 			}
 			return handlers
@@ -4154,7 +4162,8 @@ export default {
 		},
 
 		/**
-		 * Merged actions: app-provided first, then built-in defaults.
+		 * Merged actions: the declared entries in order, each `"builtin:<id>"` placeholder replaced by that built-in when its toggle is on, then the enabled built-ins not placed.
+		 * See `resolveRowActions`.
 		 *
 		 * REQ-MAD-3 / REQ-MAD-4 / REQ-MAD-5 / REQ-MAD-6 / REQ-MAD-7
 		 * (manifest-actions-dispatch) — for any action whose `handler`
@@ -4170,58 +4179,41 @@ export default {
 				registry: this.effectiveRegistry,
 				customComponents: this.effectiveCustomComponents,
 			}
-			// Drop anything that is not an action OBJECT. A bare string — the
-			// shorthand `"edit"` an author reasonably expects to mean "show the
-			// built-in Edit" — has no `label` and no `icon`, so it rendered as a
-			// full-height NcActionButton with nothing in it: an invisible,
-			// clickable, inert row in the overflow menu. Observed on dossiq,
-			// where `config.actions: ["create", "edit", "delete", {…}]` put three
-			// blank rows above the real ones on four different index pages.
-			//
-			// Named, not silently swallowed: a dropped action is a capability the
-			// author asked for and did not get, and the manifest schema now
-			// rejects the shape at authoring time (`config.actions` is governed by
-			// the same `action` definition as `pages[].actions`). Built-ins are
-			// turned on with the `show*Action` toggles, not by naming them here.
 			// A named source may supply its own row actions, on the same
 			// precedence as its columns: what the manifest declares wins, and the
-			// source is the DEFAULT for a page that declares none. Without this
-			// the source's `rowActions` were declared and never read — the third
-			// field of the same adapter to be wired late, after `columns` and
-			// `addLabel`.
-			//
-			// Note what this still cannot do: these are MERGED with the built-ins
-			// below, so a source can add an action but cannot say "these and no
-			// others". Suppressing a built-in is the `show*Action` toggles' job.
+			// source is the DEFAULT for a page that declares none.
+			// Either list may place built-ins with `"builtin:<id>"`; turning one on or off stays the `show*Action` toggles' job.
 			const manifestDeclared = this.actions && this.actions.length > 0
 			const declaredActions = manifestDeclared
 				? this.actions
 				: ((this.isNamedSource && this.namedSource && this.namedSource.rowActions) || [])
 
-			const declared = []
-			for (const a of declaredActions) {
-				if (a && typeof a === 'object' && !Array.isArray(a)) {
+			const { actions, warnings } = resolveRowActions(declaredActions, this.defaultActions, {
+				prepare: (a) => {
 					// A SOURCE action may say `action: 'open'`: open this row the
 					// way a row click does — the source's own navigation
 					// (`openRow`/`detailRoute`), with `edit-open` emitted so a
 					// host that configured a row target (`config.rowRoute`) wins.
-					// Resolved here because a source is a composable with no
-					// router; the flows source declared exactly this action and
-					// it rendered as a dead menu entry, because `action` was a
-					// key nothing read (dispatch reads `handler` and `type`).
-					// Source-declared actions only: the manifest grammar for
-					// navigation is `type`/`handler`, and stays so.
+					// Resolved here because a source is a composable with no router.
+					// Source-declared actions only: the manifest grammar for navigation is `type`/`handler`, and stays so.
 					if (!manifestDeclared && a.action === 'open' && typeof a.handler !== 'function') {
-						declared.push({ ...a, handler: (row) => this.openSourceRow(row) })
-						continue
+						return { ...a, handler: (row) => this.openSourceRow(row) }
 					}
-					declared.push(dispatchAction(a, ctx))
+					return dispatchAction(a, ctx)
+				},
+			})
+			for (const warning of warnings) {
+				// A toggle turned off at runtime (permissions, readOnly) legitimately silences a placeholder; the validator flags a statically-off one.
+				if (warning.code === 'disabled-placeholder') {
 					continue
 				}
-				// eslint-disable-next-line no-console
-				console.warn(`[CnIndexPage] Ignoring action ${JSON.stringify(a)}: actions must be objects with an id and a label. To show a built-in action use the showViewAction / showEditAction / showCopyAction / showDeleteAction props.`)
+				// A dropped entry is always named; the placement hints are dev-only.
+				if (warning.code === 'invalid-entry' || process.env.NODE_ENV !== 'production') {
+					// eslint-disable-next-line no-console
+					console.warn(`[CnIndexPage] "${this.title}": ${warning.message}`)
+				}
 			}
-			return [...declared, ...this.defaultActions]
+			return actions
 		},
 
 		hasRowActions() {
@@ -5467,9 +5459,20 @@ export default {
 		},
 
 		/**
-		 * Run the first action the focused row offers. "First" is the page's
-		 * order, narrowed by what the server allows on that record, so the
-		 * primary action is never one this caller may not run.
+		 * The first action a row's menu shows and enables: the page's order, narrowed by what the server allows, by `visible` / `visibleWhen`, and by `disabled`.
+		 * The keyboard therefore never runs what the menu hides or greys out.
+		 *
+		 * @param {object} row The row.
+		 * @return {(object|null)} The action, or null.
+		 * @spec openspec/changes/row-action-builtin-placement/specs/index-page/spec.md
+		 */
+		primaryRowActionFor(row) {
+			return this.rowActionsFor(row).find((action) => isRowActionVisible(action, row)
+				&& !(typeof action.disabled === 'function' ? action.disabled(row) : action.disabled)) || null
+		},
+
+		/**
+		 * Run the focused row's primary action (see `primaryRowActionFor`).
 		 *
 		 * @return {void}
 		 * @spec openspec/changes/working-list-row-actions/specs/index-page/spec.md
@@ -5479,14 +5482,14 @@ export default {
 			if (!row) {
 				return
 			}
-			const [first] = this.rowActionsFor(row)
+			const first = this.primaryRowActionFor(row)
 			if (!first) {
 				return
 			}
 			if (typeof first.handler === 'function') {
 				first.handler(row)
 			}
-			this.$emit('action', { action: first.label, row })
+			this.onRowAction(rowActionPayload(first, row))
 		},
 
 		/**
@@ -5803,16 +5806,22 @@ export default {
 		},
 
 		/**
-		 * Intercepts CnRowActions' bubbled `@action` so `handler: "none"`
-		 * actions are dropped before re-emit.
+		 * Intercepts CnRowActions' and CnContextMenu's bubbled `@action` so `handler: "none"` actions are dropped before re-emit.
+		 * A built-in is matched by its id, an app action by its label.
 		 *
-		 * @param {{action: string, row: object}} payload The bubbled action payload.
+		 * @param {{action: string, row: object, id?: string, builtin?: boolean}} payload The bubbled action payload.
 		 */
 		onRowAction(payload) {
-			const matched = this.mergedActions.find((a) => a.label === payload.action)
+			const matched = payload.builtin === true
+				? this.mergedActions.find((a) => a.builtin === true && a.id === payload.id)
+				: this.mergedActions.find((a) => a.builtin !== true && a.label === payload.action)
 			if (matched && matched._dispatchSuppress) {
 				return
 			}
+			/**
+			 * @event action A row action was chosen from a row's actions menu, its right-click menu or the keyboard primary action. Payload: `action` (the label), the row, the action's `id` when it has one, and `builtin: true` for a built-in View / Edit / Copy / Delete. Its handler has already run.
+			 * @type {{ action: string, row: object, id?: string, builtin?: boolean }}
+			 */
 			this.$emit('action', payload)
 		},
 
@@ -6758,6 +6767,7 @@ export default {
 		// --- Context menu handlers ---
 
 		onRowContextMenu({ row, event }) {
+			this.contextMenuShownRow = row
 			this.openContextMenu({ item: row, event })
 		},
 

package/src/components/CnIndexPage/defaultActions.js

@@ -14,9 +14,8 @@ import TrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'
  *   without it, or when it returns null, View is a button.
  * @param {{ onView: (row: object) => void, onEdit: (row: object) => void, onCopy: (row: object) => void, onDelete: (row: object) => void }} opts.handlers
  *   Click handlers bound to each emitted action, in the same order as `flags`.
- * @return {Array<object>} The enabled actions in menu order (view, edit, copy,
- *   delete), each `{label, icon, handler}` — delete additionally `destructive`,
- *   view additionally `to` when `viewTo` is given.
+ * @return {Array<object>} The enabled actions in menu order (view, edit, copy, delete), each `{id, builtin: true, label, icon, handler}`.
+ *   The id is `view`, `edit`, `copy` or `delete`; delete additionally carries `destructive`, view additionally `to` when `viewTo` is given.
  */
 export function buildDefaultActions({ flags, viewIcon, viewTo = null, handlers }) {
 	// t() at BUILD-actions time, not module time: the labels were string
@@ -26,20 +25,20 @@ export function buildDefaultActions({ flags, viewIcon, viewTo = null, handlers }
 	// consuming app's language is already resolved.
 	const out = []
 	if (flags.view) {
-		const view = { label: t('nextcloud-vue', 'View'), icon: viewIcon, handler: handlers.onView }
+		const view = { id: 'view', builtin: true, label: t('nextcloud-vue', 'View'), icon: viewIcon, handler: handlers.onView }
 		if (typeof viewTo === 'function') {
 			view.to = viewTo
 		}
 		out.push(view)
 	}
 	if (flags.edit) {
-		out.push({ label: t('nextcloud-vue', 'Edit'), icon: Pencil, handler: handlers.onEdit })
+		out.push({ id: 'edit', builtin: true, label: t('nextcloud-vue', 'Edit'), icon: Pencil, handler: handlers.onEdit })
 	}
 	if (flags.copy) {
-		out.push({ label: t('nextcloud-vue', 'Copy'), icon: ContentCopy, handler: handlers.onCopy })
+		out.push({ id: 'copy', builtin: true, label: t('nextcloud-vue', 'Copy'), icon: ContentCopy, handler: handlers.onCopy })
 	}
 	if (flags.del) {
-		out.push({ label: t('nextcloud-vue', 'Delete'), icon: TrashCanOutline, destructive: true, handler: handlers.onDelete })
+		out.push({ id: 'delete', builtin: true, label: t('nextcloud-vue', 'Delete'), icon: TrashCanOutline, destructive: true, handler: handlers.onDelete })
 	}
 	return out
 }

package/src/components/CnRowActions/CnRowActions.vue

@@ -3,7 +3,7 @@
 		:primary="primary"
 		:menuName="menuName"
 		data-testid="cn-row-actions">
-		<template v-for="{ action, link } in renderedActions" :key="action.label">
+		<template v-for="{ action, link } in renderedActions" :key="actionKey(action)">
 			<!-- A navigate-only action is a real link, so it can be middle-clicked, opened in a new tab or copied. -->
 			<NcActionLink
 				v-if="link"
@@ -11,7 +11,7 @@
 				:target="link.target"
 				:title="getTitle(action)"
 				:class="{ 'cn-row-action--destructive': action.destructive }"
-				:data-testid="`cn-action-item-${slugifyLabel(action.label)}`"
+				:data-testid="actionTestId(action)"
 				closeAfterClick
 				@click="onLinkAction(action, link, $event)">
 				<template v-if="action.icon" #icon>
@@ -25,7 +25,7 @@
 				:title="getTitle(action)"
 				:disabled="isDisabled(action)"
 				:class="{ 'cn-row-action--destructive': action.destructive }"
-				:data-testid="`cn-action-item-${slugifyLabel(action.label)}`"
+				:data-testid="actionTestId(action)"
 				closeAfterClick
 				@click="onAction(action)">
 				<template v-if="action.icon" #icon>
@@ -42,7 +42,7 @@
 import { NcActionButton, NcActionLink, NcActions } from '@nextcloud/vue'
 import { followItemActionLink, resolveItemActionLink } from '../../utils/actionLink.js'
 import { isModifiedClick } from '../../utils/linkNavigation.js'
-import { evaluateVisibleWhenLocal, isLocallyDecidableVisibleWhen } from '../../utils/visibleWhen.js'
+import { isRowActionVisible, rowActionKey, rowActionPayload, rowActionTestId, slugifyActionLabel } from '../../utils/rowActionItem.js'
 import { CnIcon } from '../CnIcon/index.js'
 
 /**
@@ -103,11 +103,13 @@ export default {
 		 * - `to` (string | object | (row) => string | object) — render the entry as a link to this
 		 *   vue-router location; a plain click routes in place. Ignored when the router cannot resolve it.
 		 * - `linkTarget` (string) — the link's `target`, e.g. `_blank`
+		 * - `id` (string) — the action's id, passed in the `action` payload
+		 * - `builtin` (boolean) — set by CnIndexPage on its built-in View / Edit / Copy / Delete; a built-in's testid is `cn-action-item-<id>` in every locale and its key `builtin:<id>`
 		 *
 		 * A link entry still emits `action`, but its `handler` is not called: the link is the
 		 * navigation. A disabled entry, or a `to` without a resolvable route, stays a button.
 		 *
-		 * @type {Array<{label: string, icon: object | string, handler: (targetItem: object) => void, disabled: boolean | ((targetItem: object) => boolean), visible: boolean | ((targetItem: object) => boolean), title: string | ((targetItem: object) => string), destructive: boolean, href: string | ((targetItem: object) => string), to: string | object | ((targetItem: object) => string | object), linkTarget: string}>}
+		 * @type {Array<{label: string, id: string, builtin: boolean, icon: object | string, handler: (targetItem: object) => void, disabled: boolean | ((targetItem: object) => boolean), visible: boolean | ((targetItem: object) => boolean), title: string | ((targetItem: object) => string), destructive: boolean, href: string | ((targetItem: object) => string), to: string | object | ((targetItem: object) => string | object), linkTarget: string}>}
 		 */
 		actions: {
 			type: Array,
@@ -137,31 +139,13 @@ export default {
 
 	computed: {
 		/**
-		 * Filter actions by their `visible` predicate. An action without a
-		 * `visible` field is always shown (backwards compatible).
+		 * Filter actions by their `visibleWhen` and `visible` gates, with the same rule CnContextMenu uses.
+		 * An action without either always shows.
 		 *
 		 * @return {Array} Visible actions for the current row.
 		 */
 		visibleActions() {
-			return this.actions.filter((action) => {
-				// A manifest is JSON and cannot hold a function, so `visibleWhen` is
-				// the only per-row gate an app configured from one can express. Only
-				// a locally decidable condition is gated on: an endpoint/source one is
-				// not this evaluator's question, and nothing gated a row action at all
-				// before, so answering `false` to it would delete the entry outright.
-				if (action.visibleWhen
-					&& isLocallyDecidableVisibleWhen(action.visibleWhen)
-					&& evaluateVisibleWhenLocal(action.visibleWhen, this.row) === false) {
-					return false
-				}
-				if (action.visible === undefined) {
-					return true
-				}
-				if (typeof action.visible === 'function') {
-					return !!action.visible(this.row)
-				}
-				return !!action.visible
-			})
+			return this.actions.filter((action) => isRowActionVisible(action, this.row))
 		},
 
 		/**
@@ -210,7 +194,7 @@ export default {
 			if (action.handler && typeof action.handler === 'function') {
 				action.handler(this.row)
 			}
-			this.$emit('action', { action: action.label, row: this.row })
+			this.$emit('action', rowActionPayload(action, this.row))
 		},
 
 		/**
@@ -229,26 +213,41 @@ export default {
 			}
 			followItemActionLink(event, link, this.$router)
 			/**
-			 * @event action User picked an entry. Payload: the action's label and the row. A button entry has already run its `handler`; a link entry navigates instead, and a modified (new-tab) click on a link emits nothing.
-			 * @type {{ action: string, row: object|null }}
+			 * @event action User picked an entry. Payload: `action` (the label), the row, the action's `id` when it has one, and `builtin: true` for a CnIndexPage built-in. A button entry has already run its `handler`; a link entry navigates instead, and a modified (new-tab) click on a link emits nothing.
+			 * @type {{ action: string, row: object|null, id?: string, builtin?: boolean }}
 			 */
-			this.$emit('action', { action: action.label, row: this.row })
+			this.$emit('action', rowActionPayload(action, this.row))
 		},
 
 		/**
 		 * Slugify an action label for use in stable `data-testid` selectors.
-		 * Lowercase, kebab-case, strip non-alphanumeric. Used solely by the
-		 * `:data-testid` binding on NcActionButton — does not affect runtime
-		 * behaviour or rendered text.
+		 * Lowercase, kebab-case, strip non-alphanumeric.
 		 *
 		 * @param {string} label - The action's display label
 		 * @return {string} kebab-case slug suitable for a testid suffix.
 		 */
 		slugifyLabel(label) {
-			return String(label || '')
-				.toLowerCase()
-				.replace(/[^a-z0-9]+/g, '-')
-				.replace(/^-+|-+$/g, '')
+			return slugifyActionLabel(label)
+		},
+
+		/**
+		 * The entry's `data-testid`: `cn-action-item-<id>` for a built-in, the label slug otherwise.
+		 *
+		 * @param {object} action The action definition.
+		 * @return {string} The testid.
+		 */
+		actionTestId(action) {
+			return rowActionTestId(action)
+		},
+
+		/**
+		 * The entry's render key: `builtin:<id>` for a built-in, the label otherwise.
+		 *
+		 * @param {object} action The action definition.
+		 * @return {string} The key.
+		 */
+		actionKey(action) {
+			return rowActionKey(action)
 		},
 	},
 }

package/src/components/CnTimelineWidget/CnTimelineWidget.vue

@@ -53,7 +53,7 @@
 <script>
 import { getLanguage, translate as t } from '@nextcloud/l10n'
 import { NcLoadingIcon, NcNoteCard } from '@nextcloud/vue'
-import { auditEvents, fieldEvents, relatedEvents, sortEvents, timelineEntryEvents } from '../../utils/timelineEvents.js'
+import { auditEvents, fieldEvents, listEvents, relatedEvents, sortEvents, timelineEntryEvents } from '../../utils/timelineEvents.js'
 
 /**
  * CnTimelineWidget — an object's dated events in time order (`timeline`
@@ -193,6 +193,7 @@ export default {
 			const now = new Date()
 			const all = [
 				...fieldEvents(this.resolvedObject || {}, this.fieldsConfig, now),
+				...listEvents(this.resolvedObject || {}, this.content.lists, now),
 				...this.relatedConfig.flatMap((cfg, i) => relatedEvents(this.relatedRows[i] || [], cfg, now)),
 				...auditEvents(this.auditEntries, this.describeAudit, now),
 				...timelineEntryEvents(this.timelineEntries, t('nextcloud-vue', 'Note'), now),
@@ -347,7 +348,7 @@ export default {
 			})
 
 			if (this.content.auditTrail === true) {
-				jobs.push(axios.get(generateUrl(`${base}/audit-trail`), { params: { limit: this.content.auditLimit || 50 } })
+				jobs.push(axios.get(generateUrl(`${base}/audit-trails`), { params: { limit: this.content.auditLimit || 50 } })
 					.then((r) => {
 						const data = r && r.data
 						this.auditEntries = (data && (data.results || data)) || []