@conduction/nextcloud-vue 2.111.0 → 2.113.0

package/dist/esm/components/CnDetailPage/CnDetailPage.vue2.js

@@ -44,10 +44,11 @@ import { useObjectSubscription } from '../../composables/useObjectSubscription.j
 import { createRefLabelResolver } from '../../composables/useRefLabels.js';
 import { gridLayout } from '../../mixins/gridLayout.js';
 import { pageViews } from '../../mixins/pageViews.js';
+import { headerActionAsLink } from '../../utils/actionLink.js';
 import { isAppInstalled } from '../../utils/appInstalled.js';
 import { compactLayoutRows } from '../../utils/dashboardPlacement.js';
 import { defaultDetailGrid } from '../../utils/defaultDetailGrid.js';
-import { stageOf, normalisePinnedAction, stageEntry, MAX_QUICK_ACTIONS, groupMenuEntries, resolveNextStep, pillCountSource, resolveCountPill, resolvePill } from '../../utils/detailActionModel.js';
+import { stageOf, normalisePinnedAction, stageEntry, MAX_QUICK_ACTIONS, groupMenuEntries, resolveNextStep, pillCountSource, resolveCountPill, resolvePill, pillLook } from '../../utils/detailActionModel.js';
 import { visibilityContextRefs, widgetConditionData, fetchVisibilityRows, detailWidgetVisible } from '../../utils/detailWidgetVisibility.js';
 import { reportBindingProblems } from '../../utils/diagnostics.js';
 import { fetchListTotal } from '../../utils/fetchFilterCounts.js';
@@ -986,6 +987,11 @@ var script = {
 		 * `@objectId` / `@object.<field>` token + local-predicate resolution.
 		 * Empty (the default) renders nothing.
 		 *
+		 * An entry with `href` is a link, never dispatched: an absolute
+		 * `http(s)`, `mailto:`, `tel:` or `//host/...` URL as written, or an instance path
+		 * (leading `/`) through `generateUrl()`, opening in place unless
+		 * `target` is `'_blank'`.
+		 *
 		 * The menu, not a row of buttons: that is what the manifest schema has
 		 * always said this key is, and what CnIndexPage already does with it.
 		 * The two surfaces had drifted, and on a dossiq case — twelve actions —
@@ -1273,9 +1279,12 @@ var script = {
 		 * `field`: `text`, a constant ("Inwoner"), or `countFrom`
 		 * (`{ register, schema, filter? }`) with `countLabel` (`{ one, other }`
 		 * with `{count}`), a count of a related list ("1 lopende zaak") that
-		 * shows nothing at 0.
+		 * shows nothing at 0. With `resolve: { register, schema, labelField?,
+		 * colorField?, iconField? }` the pill shows the referenced record's
+		 * label, takes its tone from that record's colour (an NL Design System
+		 * hue such as `red`, or a badge role) and shows its icon.
 		 *
-		 * @type {{field?: string, text?: string, countFrom?: object, countLabel?: object, colorMap?: object, labels?: object, variant?: string}|null}
+		 * @type {{field?: string, text?: string, countFrom?: object, countLabel?: object, colorMap?: object, labels?: object, variant?: string, resolve?: object}|null}
 		 */
 		typePill: {
 			type: Object,
@@ -1716,6 +1725,8 @@ var script = {
 			pillCountSeq: 0,
 			/** The labels of the records pills with `resolve` point at, by pill key. */
 			pillRefLabels: {},
+			/** The colour and icon names read off the records pills with `resolve` point at, by pill key. */
+			pillRefLooks: {},
 			/** Sequence of the last pill label lookup, so a late answer for another record is dropped. */
 			pillRefSeq: 0,
 			/** `register/schema/id` the read-state call was last made for, so it is sent once per load. */
@@ -2264,10 +2275,11 @@ var script = {
 					// `resolve`: the referenced record's label replaces the id, and
 					// keys the colour too ("Woo-verzoek", not a uuid).
 					const resolved = this.pillRefLabels[key];
+					const look = pillLook(this.pillRefLooks[key]);
 					if (typeof resolved === 'string' && resolved !== '') {
-						return { ...pill, key, label: this.effectiveTranslate(resolved), colorKey: resolved }
+						return { ...pill, ...look, key, label: this.effectiveTranslate(resolved), colorKey: resolved }
 					}
-					return { ...pill, key, label: this.effectiveTranslate(pill.label) }
+					return { ...pill, ...look, key, label: this.effectiveTranslate(pill.label) }
 				})
 				.filter(Boolean)
 		},
@@ -2302,7 +2314,8 @@ var script = {
 				.filter(([, config]) => config && config.resolve && config.resolve.register && config.resolve.schema && typeof config.field === 'string')
 				.map(([key, config]) => {
 					const pill = resolvePill({ field: config.field }, this.resolvedObject);
-					return pill ? [key, config.resolve.register, config.resolve.schema, config.resolve.labelField || '', pill.colorKey] : null
+					const { register, schema, labelField, colorField, iconField } = config.resolve;
+					return pill ? [key, register, schema, labelField || '', pill.colorKey, colorField || '', iconField || ''] : null
 				})
 				.filter(Boolean)
 		},
@@ -2701,6 +2714,7 @@ var script = {
 		 * in. Edit goes LAST so it reads after the app's own actions in the
 		 * Actions menu — the page's affordance yields to the app's.
 		 *
+		 * @spec openspec/changes/header-action-href/specs/header-action-href/spec.md#requirement-a-header-action-with-href-is-a-link-that-runs-and-emits-nothing
 		 * @return {Array<object>} The action descriptors.
 		 */
 		effectiveHeaderActions() {
@@ -2709,12 +2723,16 @@ var script = {
 			// written out in place) join the list CnActionButtons dispatches,
 			// so they get the same dialogs, toasts and `visibleWhen` gating as
 			// any header action. An id that is already declared is not added
-			// twice. With nothing pinned inline this is `headerActions` itself.
+			// twice. With nothing pinned inline and no `href` entry this is
+			// `headerActions` itself.
 			const known = new Set(authored.map((action) => action && action.id));
 			const inline = [this.stagePrimary, ...this.pinnedQuickActions]
 				.filter((pinned) => pinned && pinned.inline && !known.has(pinned.id))
 				.map((pinned) => pinned.inline);
-			const declared = inline.length > 0 ? [...authored, ...inline] : authored;
+			const combined = inline.length > 0 ? [...authored, ...inline] : authored;
+			// An entry (or child) with `href` becomes a link CnActionButtons renders as an anchor.
+			const linked = combined.map(headerActionAsLink);
+			const declared = linked.some((action, index) => action !== combined[index]) ? linked : combined;
 			if (!(this.foldsEditIntoActions && this.canEditRecord)) {
 				return declared
 			}
@@ -3958,12 +3976,13 @@ var script = {
 		 *
 		 * A stage's action is dispatched the way a header action is, through
 		 * the `run()` CnActionButtons bound for it, and announced to the host
-		 * with its declaration. A link action is left to the browser. Without
-		 * a stage action this is the page's `primaryAction`, announced as
-		 * before.
+		 * with its declaration. A link action is left to the browser and
+		 * announces nothing. Without a stage action this is the page's
+		 * `primaryAction`, announced as before.
 		 *
 		 * @return {void}
 		 * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-primary-action-follows-the-stage
+		 * @spec openspec/changes/header-action-href/specs/header-action-href/spec.md#requirement-a-header-action-with-href-is-a-link-that-runs-and-emits-nothing
 		 */
 		onPrimaryActionClick() {
 			const entry = this.stagePrimaryEntry;
@@ -3971,6 +3990,9 @@ var script = {
 				this.$emit('primary-action', this.primaryAction);
 				return
 			}
+			if (entry.href) {
+				return
+			}
 			this.$emit('primary-action', this.headerActionsById[entry.id] || { id: entry.id, label: entry.label });
 			this.onPinnedActionClick(entry);
 		},
@@ -4116,6 +4138,7 @@ var script = {
 			const seq = ++this.pillRefSeq;
 			if (targets.length === 0) {
 				this.pillRefLabels = {};
+				this.pillRefLooks = {};
 				return
 			}
 			if (!this._pillRefResolver) {
@@ -4128,14 +4151,30 @@ var script = {
 				});
 			}
 			const labels = {};
-			await Promise.all(targets.map(async ([key, register, schema, labelField, id]) => {
-				const found = await this._pillRefResolver.resolve(register, schema, [id], labelField).catch(() => ({}));
+			const looks = {};
+			const field = async (register, schema, id, name) => {
+				if (!name) {
+					return null
+				}
+				const found = await this._pillRefResolver.resolve(register, schema, [id], name, { strict: true }).catch(() => ({}));
+				return found && typeof found[id] === 'string' ? found[id] : null
+			};
+			await Promise.all(targets.map(async ([key, register, schema, labelField, id, colorField, iconField]) => {
+				const [found, color, icon] = await Promise.all([
+					this._pillRefResolver.resolve(register, schema, [id], labelField).catch(() => ({})),
+					field(register, schema, id, colorField),
+					field(register, schema, id, iconField),
+				]);
 				if (found && typeof found[id] === 'string') {
 					labels[key] = found[id];
 				}
+				if (color || icon) {
+					looks[key] = { color, icon };
+				}
 			}));
 			if (seq === this.pillRefSeq) {
 				this.pillRefLabels = labels;
+				this.pillRefLooks = looks;
 			}
 		},