@conduction/nextcloud-vue 2.77.0 → 2.78.0

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: 38439854 bytes
-sha256: 786f8e09d174b307bccce4e6dd2b99e2fb7b74a581decb90037b07c807a5c510
+size: 38473543 bytes
+sha256: bad7882294f198a2cea044c31c0d5125039ff25b00c181370b03de2a63cead03

package/dist/nextcloud-vue.css

@@ -502,6 +502,14 @@
 	color: var(--color-main-text);
 	opacity: 1;
 }
+
+/* ---- Status pills (screens-cell-pill-parity) ---------------------------- */
+/* The board draws a primary pill in the deep primary ink on the light primary
+   ground ("Verzoek", "Nieuw"); the default look keeps the brighter
+   primary-element text. The other tones already match the board. */
+.cn-look-board .cn-status-badge--primary:not(.cn-status-badge--solid):not(.cn-look-nextcloud *) {
+	color: var(--color-primary-element-light-text);
+}
 /*
  * The board dialog (screens-dialog-parity, canon section 5).
  *
@@ -1192,6 +1200,42 @@
 	margin-inline-start: 0;
 }
 
+/* The header buttons keep the board's button under a theme that styles every
+   secondary or primary button with `!important` (the nldesign theme: a
+   primary border, 8px 16px padding): Download and the Actions menu are 40px,
+   a grey border on the main background (PqTickets, DqZaken), the primary
+   button is the primary fill without a border. The buildiq square is not a
+   direct child button and keeps its own rule. */
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .button-vue--secondary,
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .action-item .button-vue {
+	height: var(--cn-board-control-height) !important;
+	min-height: var(--cn-board-control-height) !important;
+	padding: 0 14px !important;
+	border: 1px solid var(--color-border-dark) !important;
+	border-radius: var(--cn-board-control-radius) !important;
+	background: var(--color-main-background) !important;
+	color: var(--color-main-text) !important;
+}
+
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .button-vue--secondary:hover,
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .action-item .button-vue:hover {
+	background: var(--color-background-hover) !important;
+}
+
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .button-vue--primary {
+	height: var(--cn-board-control-height) !important;
+	min-height: var(--cn-board-control-height) !important;
+	padding: 0 16px !important;
+	border: 0 !important;
+	border-radius: var(--cn-board-control-radius) !important;
+	background: var(--color-primary-element) !important;
+	color: var(--color-primary-element-text) !important;
+}
+
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .button-vue--primary:hover {
+	background: var(--color-primary-element-hover) !important;
+}
+
 /* ----------------------------------------------------------------- toolbar */
 
 /* No band, no padding, no radius. The DOM is already in reading order (row 1,
@@ -3346,6 +3390,57 @@ a.cn-kpi-card--stacked:focus-visible {
 	gap: 6px;
 }
 
+/* A linked board tile is one link: the label is not underlined link text, in
+   any layout (screens-stat-tile-parity). The NL Design theme underlines every
+   `a` with `!important`, so the opt-out needs it too. */
+a.cn-kpi-card--board,
+a.cn-kpi-card--board:hover,
+a.cn-kpi-card--board:focus-visible,
+a.cn-kpi-card--board * {
+	text-decoration: none !important;
+}
+
+/* `content.iconPlacement: "end"` (DqDashboard): label left, the icon in a
+   32px circle right, tinted by the tile's state. */
+.cn-kpi-card--board .cn-kpi-card__title--badge-end {
+	justify-content: space-between;
+	gap: 8px;
+}
+
+.cn-kpi-card__badge {
+	display: inline-flex;
+	flex: 0 0 auto;
+	align-items: center;
+	justify-content: center;
+	width: 32px;
+	height: 32px;
+	margin-inline-start: auto;
+	border-radius: 50%;
+	color: var(--color-primary-element-light-text, var(--color-primary-element));
+	background: var(--color-primary-element-light, color-mix(in srgb, var(--color-primary-element) 12%, transparent));
+}
+
+.cn-kpi-card__badge svg {
+	width: 18px;
+	height: 18px;
+	fill: currentcolor;
+}
+
+.cn-kpi-card__badge--success {
+	color: var(--color-text-success, var(--color-success-text));
+	background: color-mix(in srgb, var(--color-text-success, var(--color-success-text)) 12%, var(--color-main-background));
+}
+
+.cn-kpi-card__badge--warning {
+	color: var(--color-element-warning, var(--color-warning-text));
+	background: color-mix(in srgb, var(--color-element-warning, var(--color-warning-text)) 12%, var(--color-main-background));
+}
+
+.cn-kpi-card__badge--error {
+	color: var(--color-text-error, var(--color-error-text));
+	background: color-mix(in srgb, var(--color-text-error, var(--color-error-text)) 10%, var(--color-main-background));
+}
+
 .cn-kpi-card__glyph {
 	display: inline-flex;
 	flex: 0 0 auto;
@@ -3592,6 +3687,15 @@ a.cn-kpi-card--stacked:focus-visible {
    @conduction/nextcloud-vue — Status Badge
    ======================================== */
 
+/* The two board tones without a Nextcloud colour role (screens-cell-pill-parity).
+   A theme may redefine them; the six role variants below use Nextcloud's own. */
+:root {
+	--cn-status-purple-bg: #e8e6f6;
+	--cn-status-purple-text: #4a3f8f;
+	--cn-status-teal-bg: #e3f1f3;
+	--cn-status-teal-text: #1d5e66;
+}
+
 .cn-status-badge {
 	display: inline-flex;
 	align-items: center;
@@ -3641,6 +3745,18 @@ a.cn-kpi-card--stacked:focus-visible {
 	color: var(--color-info-text, var(--color-info, #0082c9));
 }
 
+/* Work in progress ("In behandeling"), a board tone. */
+.cn-status-badge--purple {
+	background-color: var(--cn-status-purple-bg);
+	color: var(--cn-status-purple-text);
+}
+
+/* Handed on ("Omgezet naar een zaak"), a board tone. */
+.cn-status-badge--teal {
+	background-color: var(--cn-status-teal-bg);
+	color: var(--cn-status-teal-text);
+}
+
 /* Solid variants — solid background with white text for use on colored backgrounds */
 .cn-status-badge--solid.cn-status-badge--default {
 	background-color: var(--color-background-dark);
@@ -3671,6 +3787,16 @@ a.cn-kpi-card--stacked:focus-visible {
 	background-color: var(--color-info, #0082c9);
 	color: white;
 }
+
+.cn-status-badge--solid.cn-status-badge--purple {
+	background-color: var(--cn-status-purple-text);
+	color: white;
+}
+
+.cn-status-badge--solid.cn-status-badge--teal {
+	background-color: var(--cn-status-teal-text);
+	color: white;
+}
 /* ========================================
    @conduction/nextcloud-vue — Layout & Filter Utility Styles
    ======================================== */
@@ -9122,8 +9248,11 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .cn-cell-renderer__date--error[data-v-37d7b88f] {
 	color: var(--color-text-error, var(--color-error-text));
 }
+
+/* The text variant, not the fill: from Nextcloud 32 `--color-success` is a
+   background colour and too pale for a 16px glyph on a light theme. */
 .cn-cell-renderer__icon--success[data-v-37d7b88f] {
-	color: var(--color-success);
+	color: var(--color-text-success, var(--color-success-text, var(--color-success)));
 }
 .cn-cell-renderer__swatch-wrap[data-v-37d7b88f] {
 	display: inline-flex;
@@ -20833,6 +20962,57 @@ a.cn-kpi-card--stacked:focus-visible {
 	gap: 6px;
 }
 
+/* A linked board tile is one link: the label is not underlined link text, in
+   any layout (screens-stat-tile-parity). The NL Design theme underlines every
+   `a` with `!important`, so the opt-out needs it too. */
+a.cn-kpi-card--board,
+a.cn-kpi-card--board:hover,
+a.cn-kpi-card--board:focus-visible,
+a.cn-kpi-card--board * {
+	text-decoration: none !important;
+}
+
+/* `content.iconPlacement: "end"` (DqDashboard): label left, the icon in a
+   32px circle right, tinted by the tile's state. */
+.cn-kpi-card--board .cn-kpi-card__title--badge-end {
+	justify-content: space-between;
+	gap: 8px;
+}
+
+.cn-kpi-card__badge {
+	display: inline-flex;
+	flex: 0 0 auto;
+	align-items: center;
+	justify-content: center;
+	width: 32px;
+	height: 32px;
+	margin-inline-start: auto;
+	border-radius: 50%;
+	color: var(--color-primary-element-light-text, var(--color-primary-element));
+	background: var(--color-primary-element-light, color-mix(in srgb, var(--color-primary-element) 12%, transparent));
+}
+
+.cn-kpi-card__badge svg {
+	width: 18px;
+	height: 18px;
+	fill: currentcolor;
+}
+
+.cn-kpi-card__badge--success {
+	color: var(--color-text-success, var(--color-success-text));
+	background: color-mix(in srgb, var(--color-text-success, var(--color-success-text)) 12%, var(--color-main-background));
+}
+
+.cn-kpi-card__badge--warning {
+	color: var(--color-element-warning, var(--color-warning-text));
+	background: color-mix(in srgb, var(--color-element-warning, var(--color-warning-text)) 12%, var(--color-main-background));
+}
+
+.cn-kpi-card__badge--error {
+	color: var(--color-text-error, var(--color-error-text));
+	background: color-mix(in srgb, var(--color-text-error, var(--color-error-text)) 10%, var(--color-main-background));
+}
+
 .cn-kpi-card__glyph {
 	display: inline-flex;
 	flex: 0 0 auto;
@@ -26550,6 +26730,15 @@ tr.file-picker__row td.row-name[data-v-1f96131b] {
    @conduction/nextcloud-vue — Status Badge
    ======================================== */
 
+/* The two board tones without a Nextcloud colour role (screens-cell-pill-parity).
+   A theme may redefine them; the six role variants below use Nextcloud's own. */
+:root {
+	--cn-status-purple-bg: #e8e6f6;
+	--cn-status-purple-text: #4a3f8f;
+	--cn-status-teal-bg: #e3f1f3;
+	--cn-status-teal-text: #1d5e66;
+}
+
 .cn-status-badge {
 	display: inline-flex;
 	align-items: center;
@@ -26599,6 +26788,18 @@ tr.file-picker__row td.row-name[data-v-1f96131b] {
 	color: var(--color-info-text, var(--color-info, #0082c9));
 }
 
+/* Work in progress ("In behandeling"), a board tone. */
+.cn-status-badge--purple {
+	background-color: var(--cn-status-purple-bg);
+	color: var(--cn-status-purple-text);
+}
+
+/* Handed on ("Omgezet naar een zaak"), a board tone. */
+.cn-status-badge--teal {
+	background-color: var(--cn-status-teal-bg);
+	color: var(--cn-status-teal-text);
+}
+
 /* Solid variants — solid background with white text for use on colored backgrounds */
 .cn-status-badge--solid.cn-status-badge--default {
 	background-color: var(--color-background-dark);
@@ -26630,6 +26831,16 @@ tr.file-picker__row td.row-name[data-v-1f96131b] {
 	color: white;
 }
 
+.cn-status-badge--solid.cn-status-badge--purple {
+	background-color: var(--cn-status-purple-text);
+	color: white;
+}
+
+.cn-status-badge--solid.cn-status-badge--teal {
+	background-color: var(--cn-status-teal-text);
+	color: white;
+}
+
 
 /*
  * The card itself — its box, body stack, icon circle, title and value

package/l10n/en.json

@@ -114,6 +114,7 @@
     "Saved just now": "Saved just now",
     "Saved {time}": "Saved {time}",
     "Saved": "Saved",
+    "Draft kept on this device": "Draft kept on this device",
     "Publish": "Publish",
     "Edit {title} (draft)": "Edit {title} (draft)",
     "Also search inside files": "Also search inside files",
@@ -453,6 +454,12 @@
     "NC Activity is currently unavailable.": "NC Activity is currently unavailable.",
     "Could not load activity.": "Could not load activity.",
     "Today": "Today",
+    "Last 8 hours": "Last 8 hours",
+    "Last 24 hours": "Last 24 hours",
+    "Last 7 days": "Last 7 days",
+    "Last 30 days": "Last 30 days",
+    "Last 90 days": "Last 90 days",
+    "Custom range": "Custom range",
     "Yesterday": "Yesterday",
     "Earlier": "Earlier",
     "System": "System",

package/l10n/nl.json

@@ -114,6 +114,7 @@
     "Saved just now": "Zojuist opgeslagen",
     "Saved {time}": "Opgeslagen {time}",
     "Saved": "Opgeslagen",
+    "Draft kept on this device": "Concept bewaard op dit apparaat",
     "Edit {title} (draft)": "{title} bewerken (concept)",
     "Also search inside files": "Zoek ook in bestanden",
     "File matches are limited to the best 50.": "Bestandstreffers zijn beperkt tot de beste 50.",
@@ -452,6 +453,12 @@
     "NC Activity is currently unavailable.": "NC Activiteit is momenteel niet beschikbaar.",
     "Could not load activity.": "Kon activiteit niet laden.",
     "Today": "Vandaag",
+    "Last 8 hours": "Laatste 8 uur",
+    "Last 24 hours": "Laatste 24 uur",
+    "Last 7 days": "Laatste 7 dagen",
+    "Last 30 days": "Laatste 30 dagen",
+    "Last 90 days": "Laatste 90 dagen",
+    "Custom range": "Aangepaste periode",
     "Yesterday": "Gisteren",
     "Earlier": "Eerder",
     "System": "Systeem",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/nextcloud-vue",
-  "version": "2.77.0",
+  "version": "2.78.0",
   "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/src/components/CnAiCompanion/CnAiCompanion.vue

@@ -66,6 +66,7 @@ import CnAiChatPanel from './CnAiChatPanel.vue'
 import CnAiFloatingButton from './CnAiFloatingButton.vue'
 import { chatHealthUrl, DEFAULT_CHAT_APP_ID } from '../../composables/aiChatConfig.js'
 import { useAiChatStream } from '../../composables/useAiChatStream.js'
+import { isAppInstalled } from '../../utils/appInstalled.js'
 
 const HEALTH_TIMEOUT = 5000
 
@@ -340,6 +341,15 @@ export default {
 			}
 		},
 
+		/**
+		 * Ask the chat backend whether it can answer, and render only if so.
+		 *
+		 * Skipped without a request when the backend app is not installed for
+		 * this user.
+		 *
+		 * @return {Promise<void>}
+		 * @spec openspec/changes/no-calls-to-missing-apps-and-presence-beacon/specs/ai-companion/spec.md#requirement-the-companion-does-not-probe-a-backend-that-is-not-installed
+		 */
 		async runHealthProbe() {
 			// RETRY before hiding. A single probe makes the whole companion
 			// disappear on one slow response, and "slow" is normal: measured on a
@@ -351,6 +361,19 @@ export default {
 			//
 			// A backend that is genuinely down fails all attempts and is still
 			// reported; this only stops one unlucky request from deciding.
+			//
+			// 🔴 NO PROBE AT AN APP THAT IS NOT THERE. Nextcloud already tells
+			// the page which apps the user has (`OC.appswebroots`), so asking a
+			// missing backend for its health is a guaranteed 404, three times
+			// per page, in every console. Measured on cloud.conduction.nl
+			// (round-5 check): hermiq not installed, three
+			// `/apps/hermiq/api/chat/health` 404s on every pipelinq and dossiq
+			// page. Hidden either way; now hidden without the requests.
+			if (!isAppInstalled(this.chatAppId || DEFAULT_CHAT_APP_ID)) {
+				this.probeSucceeded = false
+				return
+			}
+
 			for (let attempt = 1; attempt <= HEALTH_PROBE_ATTEMPTS; attempt++) {
 				try {
 					const response = await axios.get(chatHealthUrl(this.chatAppId), {

package/src/components/CnBoardView/CnBoardView.vue

@@ -308,6 +308,7 @@
 import { translate as t } from '@nextcloud/l10n'
 import CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'
 import { normalizeLook } from '../../composables/useLook.js'
+import { isBadgeVariant } from '../../utils/badgeVariants.js'
 import { buildBoardColumns, resolveStageColor } from '../../utils/boardColumns.js'
 import { buildSwimlanes } from '../../utils/boardSwimlanes.js'
 import { DROP_OUTCOMES, runBoardDrop } from '../../utils/boardTransition.js'
@@ -688,7 +689,7 @@ export default {
 		pillVariant(card) {
 			const raw = this.textOf(readPath(card, this.roles.pill))
 			const variant = this.roles.pillColors[raw] ?? this.roles.pillColors[raw.toLowerCase()]
-			return ['default', 'primary', 'success', 'warning', 'error', 'info'].includes(variant) ? variant : 'default'
+			return isBadgeVariant(variant) ? variant : 'default'
 		},
 
 		/**

package/src/components/CnCellRenderer/CnCellRenderer.md

@@ -89,6 +89,7 @@ fall back to the normal rendering. See `docs/migrating-to-manifest.md` →
 Column widget — `widget="badge"`, `widget="fkResolve"` (uuid → related object label via the shared object store with per-schema caching; config `widgetProps { register, schema, labelField }`), and `widget="link"` are built-in; any other id resolves against the app's `cellWidgets` registry (`CnAppRoot`'s `cellWidgets` prop → `cnCellWidgets`), and that component receives `{ value, row, property, formatted, ...widgetProps }`. `widget` takes precedence over `formatter`; when both are set the widget gets the formatter-shaped value as `formatted`. See `docs/migrating-to-manifest.md` → "Column widgets" + "Built-in cell formatters / widgets".
 
 - `widget="badge"` — `CnStatusBadge` pill; `widgetProps.variant` picks the colour.
+  An enum value shows its `x-enum-labels` label, translated, as the plain enum cell does; a column `formatter` still wins. `widgetProps.colorMap` is looked up by the stored value when it has an entry for it, else by the label. The `link` widget and the `swatch` format show the same label.
 - `widget="link"` — `<router-link>` when `widgetProps.route` is a manifest page id, or when `widgetProps.routeMap` maps the row's `widgetProps.routeField` value to one (a value the map does not hold falls back to `route`, then to text); `<a target="_blank">` when `widgetProps.href` is set (with `{key}` placeholders substituted from the row); plain text + once-per-session `console.warn` when neither resolves (silence with `widgetProps.fallback:"silent"`). For non-`id` route params: `widgetProps.params: { routeParam: "rowField" }`. Default param map is `{ id: row[rowKey] }` — see the `row-key` prop below.
 
 ```vue

package/src/components/CnCellRenderer/CnCellRenderer.vue

@@ -24,12 +24,15 @@
 			</span>
 		</template>
 
-		<!-- Built-in "badge" widget — renders the (possibly formatter-shaped) value as a status pill -->
+		<!-- Built-in "badge" widget: renders the value as a status pill. An enum
+		     value shows its label (x-enum-labels, translated) unless a formatter
+		     shapes it; the colour stays keyed on the raw value. -->
 		<template v-else-if="widget === 'badge'">
 			<CnStatusBadge v-if="hasValue"
-				:label="String(formattedValue)"
+				:label="labelledValue"
 				:variant="badgeVariant"
-				:colorMap="badgeColorMap" />
+				:colorMap="badgeColorMap"
+				:colorKey="badgeColorKey" />
 			<span v-else class="cn-cell-renderer__dash">—</span>
 		</template>
 
@@ -78,7 +81,7 @@
 				v-if="linkRoute"
 				:to="linkRoute"
 				class="cn-cell-renderer__link">
-				{{ formattedValue }}
+				{{ labelledValue }}
 			</router-link>
 			<a
 				v-else-if="linkHref"
@@ -86,9 +89,9 @@
 				target="_blank"
 				rel="noopener"
 				class="cn-cell-renderer__link">
-				{{ formattedValue }}
+				{{ labelledValue }}
 			</a>
-			<span v-else :title="rawTitle">{{ formattedValue }}</span>
+			<span v-else :title="rawTitle">{{ labelledValue }}</span>
 		</template>
 
 		<!-- Built-in "avatar" widget: a person as an avatar with the name beside
@@ -141,7 +144,7 @@
 					class="cn-cell-renderer__swatch-dot"
 					:style="{ backgroundColor: swatchColor }"
 					aria-hidden="true" />
-				<span v-if="hasValue" :title="rawTitle">{{ formattedValue }}</span>
+				<span v-if="hasValue" :title="rawTitle">{{ labelledValue }}</span>
 				<span v-else class="cn-cell-renderer__dash">—</span>
 			</span>
 		</template>
@@ -632,6 +635,43 @@ export default {
 				.map((gid) => String(gid))
 		},
 
+		/**
+		 * The text a built-in widget (`badge`, `link`) or a swatch shows. An
+		 * enum value reads its label the way the plain enum cell does
+		 * (`enumLabel`: `x-enum-labels`, translated), so a list says "Active"
+		 * where the detail page does, not the stored "active". A column
+		 * formatter still wins: an app that shapes the value itself gets
+		 * exactly what its formatter returns.
+		 *
+		 * @return {string}
+		 * @spec openspec/changes/cell-labels-and-draft-indicator/specs/cell-labels-and-draft-indicator/spec.md#requirement-a-built-in-cell-widget-shows-an-enum-value-by-its-label
+		 */
+		labelledValue() {
+			if (!this.hasFormatter && this.isEnum && this.hasValue && typeof this.value !== 'object') {
+				return this.enumLabel
+			}
+			return String(this.formattedValue)
+		},
+
+		/**
+		 * The key the built-in `badge` looks its colour up by: the raw value
+		 * when `widgetProps.colorMap` has an entry for it (case-insensitive),
+		 * so a translated label keeps the colour the manifest keyed on the
+		 * stored code. Otherwise '' and the badge looks up its label, as before,
+		 * which keeps a map keyed on a formatter's output working.
+		 *
+		 * @return {string}
+		 * @spec openspec/changes/cell-labels-and-draft-indicator/specs/cell-labels-and-draft-indicator/spec.md#requirement-a-built-in-cell-widget-shows-an-enum-value-by-its-label
+		 */
+		badgeColorKey() {
+			const map = this.badgeColorMap
+			if (!map || !this.hasValue || typeof this.value === 'object') {
+				return ''
+			}
+			const raw = String(this.value).toLowerCase()
+			return Object.keys(map).some((key) => key.toLowerCase() === raw) ? String(this.value) : ''
+		},
+
 		/** Variant for the built-in `badge` widget — `widgetProps.variant` or `'default'`. */
 		badgeVariant() {
 			return (this.widgetProps && this.widgetProps.variant) || 'default'
@@ -1103,8 +1143,10 @@ export default {
 	color: var(--color-text-error, var(--color-error-text));
 }
 
+/* The text variant, not the fill: from Nextcloud 32 `--color-success` is a
+   background colour and too pale for a 16px glyph on a light theme. */
 .cn-cell-renderer__icon--success {
-	color: var(--color-success);
+	color: var(--color-text-success, var(--color-success-text, var(--color-success)));
 }
 
 .cn-cell-renderer__swatch-wrap {

package/src/components/CnChartWidget/CnChartWidget.vue

@@ -29,7 +29,7 @@
 				:aria-pressed="String(Boolean(activeView && activeView.key === view.key))"
 				:data-testid="`cn-chart-widget-view-${view.key}`"
 				@click="activeViewKey = view.key">
-				{{ view.label || view.key }}
+				{{ view.label ? hostTranslate(view.label) : view.key }}
 			</button>
 		</div>
 		<div v-if="showEmptyState" class="cn-chart-widget__empty" data-testid="cn-chart-widget-empty">
@@ -53,7 +53,7 @@
 				:height="computedHeight"
 				:width="computedWidth"
 				:options="mergedOptions"
-				:series="displayedSeries" />
+				:series="plottedSeries" />
 		</div>
 		<div v-else class="cn-chart-widget__fallback">
 			<!-- @slot Rendered when the ApexCharts peer dependency is not available (defaults to the unavailableLabel text). -->
@@ -213,6 +213,11 @@ export default {
 		 * always a ref to inject, even outside a dashboard.
 		 */
 		cnDashboardDateRange: { default: () => ref(null) },
+		/**
+		 * Host translate function provided by CnAppRoot: manifest-authored
+		 * view labels and series names are i18n keys (screens-dashboard-i18n).
+		 */
+		cnTranslate: { default: () => (key) => key },
 	},
 
 	props: {
@@ -918,6 +923,25 @@ export default {
 		 *
 		 * @return {Array} The displayed series.
 		 */
+		/**
+		 * The displayed series with each series name through the host
+		 * translate function, so a manifest series named "Revenue" reads in
+		 * the user's language in the legend and the tooltip. Views still
+		 * filter on the name as written (`displayedSeries`).
+		 *
+		 * @spec openspec/changes/screens-dashboard-i18n/specs/dashboard-page/spec.md#requirement-chart-view-labels-and-series-names-are-translated
+		 * @return {Array} The series handed to ApexCharts.
+		 */
+		plottedSeries() {
+			const series = this.displayedSeries
+			if (!Array.isArray(series)) {
+				return series
+			}
+			return series.map((entry) => (entry && typeof entry === 'object' && typeof entry.name === 'string' && entry.name !== '')
+				? { ...entry, name: this.hostTranslate(entry.name) }
+				: entry)
+		},
+
 		displayedSeries() {
 			const series = this.resolvedSeries
 			const view = this.activeView
@@ -1417,6 +1441,19 @@ export default {
 	},
 
 	methods: {
+		/**
+		 * A manifest-authored label through the host translate function.
+		 *
+		 * @spec openspec/changes/screens-dashboard-i18n/specs/dashboard-page/spec.md#requirement-chart-view-labels-and-series-names-are-translated
+		 * @param {string} key The label.
+		 * @return {string} The translated label.
+		 */
+		hostTranslate(key) {
+			const translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : null
+			const out = translate ? translate(key) : key
+			return (typeof out === 'string' && out !== '') ? out : key
+		},
+
 		/**
 		 * Re-query the chart's dataSource / endpointSource. Exposed as a
 		 * ref-callable method (B3 canonical refresh mode) AND invoked by the

package/src/components/CnDashboardPage/CnDashboardPage.vue

@@ -883,7 +883,7 @@ import CnBodySections from '../CnBodySections/CnBodySections.vue'
 import CnBuildiqEditButton from '../CnBuildiqEditButton/CnBuildiqEditButton.vue'
 import CnChartWidget from '../CnChartWidget/CnChartWidget.vue'
 import CnDashboardGrid from '../CnDashboardGrid/CnDashboardGrid.vue'
-import CnDateRangePicker, { DEFAULT_DATE_RANGE_PRESETS, resolvePresetWindow } from '../CnDateRangePicker/CnDateRangePicker.vue'
+import CnDateRangePicker, { DEFAULT_DATE_RANGE_PRESETS, resolvePresetWindow, translatePresetLabel } from '../CnDateRangePicker/CnDateRangePicker.vue'
 import CnEmptyContent from '../CnEmptyContent/CnEmptyContent.vue'
 import CnKpiGrid from '../CnKpiGrid/CnKpiGrid.vue'
 import CnSegmentedControl from '../CnSegmentedControl/CnSegmentedControl.vue'
@@ -2009,9 +2009,12 @@ export default {
 		 * doesn't supply one.
 		 */
 		effectivePresets() {
-			return Array.isArray(this.dateRange?.presets) && this.dateRange.presets.length > 0
+			const presets = Array.isArray(this.dateRange?.presets) && this.dateRange.presets.length > 0
 				? this.dateRange.presets
-				: DEFAULT_DATE_RANGE_PRESETS.map((p) => ({ ...p }))
+				: DEFAULT_DATE_RANGE_PRESETS
+			// Labels in the user's language (screens-dashboard-i18n): the app's
+			// catalogue first, then the library's own for the default labels.
+			return presets.map((p) => ({ ...p, label: translatePresetLabel(p.label, this.effectiveTranslate) }))
 		},
 
 		/**
@@ -3354,7 +3357,7 @@ export default {
 		 * @return {object}
 		 */
 		registryWidgetBindings(item) {
-			const content = this.getWidgetContent(item)
+			const content = this.collectionContent(this.getWidgetContent(item))
 			const def = this.getWidgetDef(item.widgetId)
 			if (!this.isBannerDef(def)) {
 				return content
@@ -3363,6 +3366,28 @@ export default {
 			return outcome ? { ...content, conditionOutcome: outcome } : content
 		},
 
+		/**
+		 * A widget's content with the board's quiet collection footer: in the
+		 * board look a dashboard that drops the widget Actions menu
+		 * (`showWidgetActions: false`) also drops the Add footer of its list
+		 * widgets, whose Add is the menu's create entry at the bottom of the
+		 * card. A widget that says `content.allowCreate` keeps its own value.
+		 * Otherwise the content is returned as is.
+		 *
+		 * @spec openspec/changes/screens-dashboard-legacy-widgets/specs/dashboard-page/spec.md#requirement-a-board-dashboard-without-widget-actions-drops-the-add-footer
+		 * @param {object} content The widget's stored content.
+		 * @return {object}
+		 */
+		collectionContent(content) {
+			if (!this.isBoardLook || this.showWidgetActions !== false) {
+				return content
+			}
+			if (content && Object.hasOwn(content, 'allowCreate')) {
+				return content
+			}
+			return { ...content, allowCreate: false }
+		},
+
 		/**
 		 * Re-compact a filtered layout upward, display-only. GridStack runs
 		 * `float: true`, so removing an item does not close its row — this