@conduction/nextcloud-vue 2.137.0 → 2.139.0

package/l10n/en.json

@@ -2377,7 +2377,10 @@
     "Talk to {agent}": "Talk to {agent}",
     "Search a person or group": "Search a person or group",
     "Now: by {order}.": "Now: by {order}.",
-    "You save the order along with a view.": "You save the order along with a view."
+    "You save the order along with a view.": "You save the order along with a view.",
+    "me": "me",
+    "Open profile": "Open profile",
+    "Link a contact from your address book.": "Link a contact from your address book."
   },
   "plurals": {
     "{count} member": [
@@ -2578,6 +2581,14 @@
     "within %n day": [
       "within %n day",
       "within %n days"
+    ],
+    "%n other": [
+      "%n other",
+      "%n others"
+    ],
+    "{names} has no location, so it is not on the map.": [
+      "{names} has no location, so it is not on the map.",
+      "{names} have no location, so they are not on the map."
     ]
   }
 }

package/l10n/nl.json

@@ -2627,7 +2627,10 @@
     "Talk to {agent}": "Praten met {agent}",
     "Search a person or group": "Zoek een persoon of groep",
     "Now: by {order}.": "Nu: op {order}.",
-    "You save the order along with a view.": "De sortering bewaart u mee in een weergave."
+    "You save the order along with a view.": "De sortering bewaart u mee in een weergave.",
+    "me": "ik",
+    "Open profile": "Profiel openen",
+    "Link a contact from your address book.": "Koppel een contact uit je adresboek."
   },
   "plurals": {
     "{count} member": [
@@ -2845,6 +2848,14 @@
     "within %n day": [
       "binnen %n dag",
       "binnen %n dagen"
+    ],
+    "%n other": [
+      "%n andere",
+      "%n andere"
+    ],
+    "{names} has no location, so it is not on the map.": [
+      "{names} heeft geen locatie, dus staat niet op de kaart.",
+      "{names} hebben geen locatie, dus staan ze niet op de kaart."
     ]
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/nextcloud-vue",
-  "version": "2.137.0",
+  "version": "2.139.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/CnCellRenderer/CnCellRenderer.vue

@@ -639,7 +639,7 @@ export default {
 		 * type-aware rendering, so a manifest column can opt into currency or a
 		 * colour swatch without registering a function.
 		 *
-		 * @type {{style?: 'currency'|'number'|'percent'|'duration'|'swatch', currency?: string, decimals?: number, unit?: 'milliseconds'|'seconds'|'minutes'|'hours', prefix?: string, suffix?: string, colorField?: string}}
+		 * @type {{style?: 'currency'|'number'|'decimal'|'percent'|'duration'|'swatch', currency?: string, decimals?: number, unit?: 'milliseconds'|'seconds'|'minutes'|'hours', prefix?: string, suffix?: string, colorField?: string}}
 		 */
 		format: {
 			type: Object,
@@ -1709,9 +1709,9 @@ export default {
 			return typeof s === 'string' ? s : null
 		},
 
-		/** True when a built-in NUMERIC format (currency/number/percent/duration) applies. */
+		/** True when a built-in NUMERIC format (currency/number/decimal/percent/duration) applies. */
 		hasBuiltinFormat() {
-			return ['currency', 'number', 'percent', 'duration'].includes(this.formatStyle)
+			return ['currency', 'number', 'decimal', 'percent', 'duration'].includes(this.formatStyle)
 		},
 
 		/** True when this cell renders as a colour swatch (`format.style:"swatch"`). */
@@ -1916,9 +1916,11 @@ export default {
 			if (!Number.isFinite(num)) {
 				return formatValue(this.value, this.property, { truncate: this.truncate })
 			}
+			// `decimal` defaults to one fraction digit, as formatMetricValue does.
+			const defaultDecimals = { currency: 2, decimal: 1 }
 			const decimals = Number.isFinite(fmt.decimals)
 				? fmt.decimals
-				: (fmt.style === 'currency' ? 2 : 0)
+				: (defaultDecimals[fmt.style] ?? 0)
 			let body
 			if (fmt.style === 'currency') {
 				// `format.currencyField` reads the code from the row's own field.

package/src/components/CnChartWidget/CnChartWidget.vue

@@ -2964,10 +2964,14 @@ export default {
 	display: contents;
 }
 
+/* A column takes its share of the width (minmax(0, 1fr)), so a long phase
+   name breaks inside its own column instead of running into the next. */
 .cn-chart-widget__matrix-head {
 	--nldesign-color-on-surface: var(--color-text-maxcontrast);
 	color: var(--color-text-maxcontrast);
 	padding: 6px;
+	hyphens: auto;
+	overflow-wrap: anywhere;
 }
 
 .cn-chart-widget__matrix-label {

package/src/components/CnDetailCard/CnDetailCard.md

@@ -84,6 +84,7 @@ With footer slot:
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
 | `icon` | Object\|Function | `null` | Optional MDI icon component rendered in the card header |
+| `subtitle` | String | `''` | A muted line under the title, as given (translate before passing). No line when empty. |
 
 | Slot | Description |
 |------|-------------|

package/src/components/CnDetailCard/CnDetailCard.vue

@@ -22,7 +22,13 @@
 						:size="20"
 						class="cn-detail-card__icon" />
 				</slot>
-				<h3 class="cn-detail-card__title">
+				<div v-if="subtitle" class="cn-detail-card__heading">
+					<h3 class="cn-detail-card__title">
+						{{ title }}
+					</h3>
+					<span class="cn-detail-card__subtitle" data-testid="cn-detail-card-subtitle">{{ subtitle }}</span>
+				</div>
+				<h3 v-else class="cn-detail-card__title">
 					{{ title }}
 				</h3>
 			</div>
@@ -125,6 +131,12 @@ export default {
 			default: '',
 		},
 
+		/** A muted line under the title, as given (translate before passing). */
+		subtitle: {
+			type: String,
+			default: '',
+		},
+
 		/** Optional MDI icon component for the header */
 		icon: {
 			type: [Object, Function],
@@ -247,6 +259,18 @@ export default {
 	flex-shrink: 0;
 }
 
+.cn-detail-card__heading {
+	display: flex;
+	flex-direction: column;
+	min-width: 0;
+}
+
+.cn-detail-card__subtitle {
+	font-size: 13px;
+	line-height: 1.3;
+	color: var(--color-text-maxcontrast);
+}
+
 .cn-detail-card__title {
 	font-weight: 600;
 	font-size: 14px;

package/src/components/CnDetailWidgetHost/CnDetailWidgetHost.vue

@@ -1444,6 +1444,7 @@ export default {
 				objectId: this.objectId,
 				object: this.object,
 				config: unwrapAppConfig(this.cnAppConfig),
+				context: (this.cnDetailVisibilityRows && this.cnDetailVisibilityRows.value) || null,
 			})
 		},
 
@@ -1510,6 +1511,7 @@ export default {
 				// prints its title as given.
 				title: this.translateLabel(this.widget?.title || ''),
 				...this.leafTitleLabel,
+				...(this.widgetSubtitle ? { subtitle: this.translateLabel(this.widgetSubtitle) } : {}),
 				// A provider opting into `bareWidget` is being rendered where the
 				// tab strip already supplies the card and the title, so tell it to
 				// drop its own. Without this the panel gets a titled card inside

package/src/components/CnFactsWidget/CnFactsWidget.vue

@@ -1845,11 +1845,13 @@ export default {
 	display: contents;
 }
 
-/* Nextcloud core styles `dt` and `dd` (text-align end, 12px padding), which
-   pushed the label to the right of its column and added 12px around both. The
-   class is doubled so these resets outrank that rule, and a dossiq-style
-   `:deep()` override in an app is not needed. */
+/* Nextcloud core styles `dt` and `dd` (text-align end, 12px padding, a
+   130px-wide `dt`), which pushed the label to the right of its column, added
+   12px around both and widened the label column to 130px. The class is
+   doubled so these resets outrank that rule, and a dossiq-style `:deep()`
+   override in an app is not needed. */
 .cn-facts-widget__label.cn-facts-widget__label {
+	width: auto;
 	margin: 0;
 	padding: 0;
 	text-align: start;

package/src/components/CnFilesBrowser/CnFilesBrowser.vue

@@ -1128,6 +1128,21 @@ export default {
 			default: '',
 		},
 
+		/**
+		 * The second line as a list of fields joined with " · ", a field
+		 * without a value left out: the `nameSecondary` tokens without their
+		 * braces (`["type", "size", "modified|date"]`, a row-data field such as
+		 * `"senderName"`). Or a list of variants `{ when, fields }`: the first
+		 * whose `when` is `true`, or that has no `when`, is used (a case type
+		 * flag read through `@context`). Takes precedence over `nameSecondary`.
+		 *
+		 * @spec openspec/changes/files-second-line-fields/specs/files-second-line-fields/spec.md#requirement-a-files-second-line-is-a-list-of-fields
+		 */
+		secondLine: {
+			type: Array,
+			default: null,
+		},
+
 		/** The line `dropHint` shows. */
 		dropHintLabel: {
 			type: String,
@@ -1526,6 +1541,26 @@ export default {
 		 *
 		 * @return {Array<object>} The file nodes.
 		 */
+		/**
+		 * The fields `secondLine` names for this browser: the list itself, or
+		 * the fields of its first variant whose `when` is `true` or absent.
+		 * Null without `secondLine` or a matching variant.
+		 *
+		 * @return {Array<string>|null}
+		 * @spec openspec/changes/files-second-line-fields/specs/files-second-line-fields/spec.md#requirement-a-files-second-line-is-a-list-of-fields
+		 */
+		secondLineFields() {
+			const list = Array.isArray(this.secondLine) ? this.secondLine : []
+			if (list.length === 0) {
+				return null
+			}
+			if (list.every((item) => typeof item === 'string')) {
+				return list
+			}
+			const variant = list.find((item) => item && typeof item === 'object' && Array.isArray(item.fields) && (!('when' in item) || item.when === true))
+			return variant ? variant.fields.filter((field) => typeof field === 'string') : null
+		},
+
 		/**
 		 * The bulk bar's count text.
 		 *
@@ -2079,7 +2114,8 @@ export default {
 		 * @return {string}
 		 */
 		nameSecondaryOf(node) {
-			if (!this.nameSecondary || this.isFolder(node)) {
+			const fields = this.secondLineFields
+			if ((!this.nameSecondary && fields === null) || this.isFolder(node)) {
 				return ''
 			}
 			const byId = this.resolvedRowData && typeof this.resolvedRowData === 'object' ? this.resolvedRowData : {}
@@ -2093,6 +2129,12 @@ export default {
 				type: this.typeLabelOf(node),
 				...(owner ? { owner } : {}),
 			}
+			if (fields !== null) {
+				return fields
+					.map((field) => fillTemplate(`{${field}}`, object))
+					.filter((text) => text !== '')
+					.join(' · ')
+			}
 			return fillTemplate(this.cnTranslate(this.nameSecondary), object)
 		},
 
@@ -3236,6 +3278,17 @@ export default {
 	font-size: 14px;
 }
 
+/* Core's apps.css draws every dt/dd inline-block with a fixed, end-aligned dt.
+   @spec openspec/changes/files-side-facts-core-dl/specs/files-side-facts-core-dl/spec.md#requirement-a-file-side-cards-facts-are-not-drawn-by-cores-dl-rules */
+.cn-files-browser__side-facts dt,
+.cn-files-browser__side-facts dd {
+	display: block;
+	width: auto;
+	padding: 0;
+	text-align: start;
+	white-space: normal;
+}
+
 .cn-files-browser__side-facts dt {
 	color: var(--color-text-maxcontrast);
 }

package/src/components/CnIndexPage/CnIndexPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="cn-index-page"
-		:class="[lookClass, { 'cn-index-page--with-side-panel': hasSidePanel, 'cn-index-page--quick-filters-toolbar': effectiveQuickFilterPlacement === 'toolbar' }]"
+		:class="[lookClass, { 'cn-index-page--with-side-panel': hasSidePanel, 'cn-index-page--sidebar-open': sidebarPanelOpen, 'cn-index-page--quick-filters-toolbar': effectiveQuickFilterPlacement === 'toolbar' }]"
 		data-testid="cn-index-page"
 		@keydown="onListKeydown">
 		<!-- Header — overridable via #header slot. CnPageHeader ALWAYS renders:
@@ -172,7 +172,7 @@
 				:maxVisible="quickFilterMaxVisible"
 				:fit="false"
 				:multiple="quickFilterMultiple"
-				:activeIndex="activeQuickFilterIndex"
+				:activeIndex="shownQuickFilterIndex"
 				:selectedIndices="selectedQuickFilterIndices"
 				:counts="effectiveTabCounts"
 				@update:activeIndex="onQuickFilterChange"
@@ -1034,6 +1034,7 @@
 						</ol>
 						<div v-if="mapList.missing.length > 0" class="cn-index-page__map-missing" data-testid="cn-index-map-missing">
 							<strong>{{ mapMissingTitle }}</strong>
+							<span v-if="mapMissingNote" class="cn-index-page__map-missing-note" data-testid="cn-index-map-missing-note">{{ mapMissingNote }}</span>
 							<NcButton variant="tertiary-no-background" data-testid="cn-index-map-missing-table" @click="onViewModeChange('table')">
 								{{ mapMissingLink }}
 							</NcButton>
@@ -1459,6 +1460,7 @@ import { countLine } from '../../utils/countLine.js'
 import { reportBindingProblems } from '../../utils/diagnostics.js'
 import { fetchGroupedCounts } from '../../utils/fetchAggregate.js'
 import { fetchFilterCounts, fetchListTotal } from '../../utils/fetchFilterCounts.js'
+import { fillTemplate } from '../../utils/fillTemplate.js'
 import { listText, rangeChipText, rangeEnds, relativeRangeText } from '../../utils/filterRangeLabel.js'
 import { unwrapAppConfig } from '../../utils/formatMetric.js'
 import { groupDisplayName, loadGroupDisplayName } from '../../utils/groupAutocomplete.js'
@@ -2238,6 +2240,21 @@ export default {
 			default: '',
 		},
 
+		/**
+		 * Board look: the count line while a saved view is applied (manifest
+		 * `config.savedViewCountText`), a template as `countText` that may name
+		 * the view's conditions as `{view}`: its description, else its filters
+		 * in words (DqFilterInMenu "3 van 48 lopende zaken · termijn binnen 7
+		 * dagen, van mij · gesorteerd op termijn"). A view's own `countText`
+		 * override and a scope's come first.
+		 *
+		 * @spec openspec/changes/applied-view-lights-its-lens/specs/applied-view-lights-its-lens/spec.md
+		 */
+		savedViewCountText: {
+			type: String,
+			default: '',
+		},
+
 		/**
 		 * Board look: a count line per view (manifest `config.countTextByView`),
 		 * `{ table?, cards?, list?, board?, map? }`, each a template as
@@ -4578,6 +4595,8 @@ export default {
 			savedViewCounts: null,
 			// The id (or slug) of the saved view that is applied; its chip shows selected under the board look.
 			appliedSavedViewId: '',
+			/** Whether the reader picked a lens chip after the applied view (then their chip shows). */
+			lensChosenByHand: false,
 			// The sort option the applied view's `overrides.sortOption` selected, so leaving the view can undo it.
 			viewSortOption: '',
 			// The applied view's filters as one comparable key, so the address keeps naming the view until they change.
@@ -6417,13 +6436,53 @@ export default {
 		 * @spec openspec/changes/working-list-row-actions/specs/index-page/spec.md
 		 */
 		/**
-		 * The chip the strip lights: the active tab, else the default tab of
-		 * tabs that arrived after setup (`quickFiltersFrom`), which is the
-		 * one the fetch applies.
+		 * The lens chip an applied saved view narrows within: the non-default
+		 * tab whose every condition the view's own conditions (its filters
+		 * over its locked filters, tokens as written) hold, the most specific
+		 * first (DqFilterInMenu: "Termijn deze week" lit for the view of that
+		 * name). Null without an applied view or a fitting tab.
+		 *
+		 * @return {number|null} The tab index.
+		 * @spec openspec/changes/applied-view-lights-its-lens/specs/applied-view-lights-its-lens/spec.md
+		 */
+		appliedViewLensIndex() {
+			const view = this.appliedSavedView
+			const tabs = Array.isArray(this.tabStripEntries) ? this.tabStripEntries : []
+			if (!view || tabs.length === 0) {
+				return null
+			}
+			const query = view.query && typeof view.query === 'object' ? view.query : {}
+			const locked = query.overrides && typeof query.overrides.lockedFilters === 'object' ? query.overrides.lockedFilters : {}
+			const conditions = { ...(locked || {}), ...(query.filters || view.filters || {}) }
+			const same = (a, b) => JSON.stringify(Array.isArray(a) ? a.map(String) : String(a)) === JSON.stringify(Array.isArray(b) ? b.map(String) : String(b))
+			let best = null
+			let bestSize = 0
+			tabs.forEach((tab, index) => {
+				const filter = tab && tab.filter && typeof tab.filter === 'object' ? tab.filter : {}
+				const keys = Object.keys(filter)
+				if (tab.default === true || keys.length === 0 || keys.length <= bestSize) {
+					return
+				}
+				if (keys.every((key) => Object.hasOwn(conditions, key) && same(conditions[key], filter[key]))) {
+					best = index
+					bestSize = keys.length
+				}
+			})
+			return best
+		},
+
+		/**
+		 * The chip the strip lights: the lens an applied saved view narrows
+		 * within (until the reader picks a chip), else the active tab, else
+		 * the default tab of tabs that arrived after setup
+		 * (`quickFiltersFrom`), which is the one the fetch applies.
 		 *
 		 * @return {number|null} The tab index, or null without tabs.
 		 */
 		shownQuickFilterIndex() {
+			if (!this.quickFilterMultiple && !this.lensChosenByHand && this.appliedViewLensIndex !== null) {
+				return this.appliedViewLensIndex
+			}
 			if (this.activeQuickFilterIndex !== null && this.activeQuickFilterIndex !== undefined) {
 				return this.activeQuickFilterIndex
 			}
@@ -7217,6 +7276,31 @@ export default {
 			return n('nextcloud-vue', '%n without an address', '%n without an address', this.mapList.missing.length)
 		},
 
+		/**
+		 * The sentence on that card naming the rows without a place by the
+		 * list's title template, three at most and the rest counted: "A, B and
+		 * C have no location, so they are not on the map." Empty without a
+		 * title template.
+		 *
+		 * @spec openspec/changes/map-missing-card-names-the-cases/specs/map-missing-card-names-the-cases/spec.md#requirement-the-missing-address-card-names-the-cases-it-counts
+		 * @return {string} The sentence.
+		 */
+		mapMissingNote() {
+			const list = this.mapConfig && this.mapConfig.list
+			const template = list && typeof list.title === 'string' ? this.cnTranslate(list.title) : ''
+			const missing = this.mapList.missing
+			if (template === '' || missing.length === 0) {
+				return ''
+			}
+			const shown = missing.slice(0, 3).map((row) => fillTemplate(template, row, undefined, this.cnFormatters ? { formatters: this.cnFormatters } : null)).filter((title) => title !== '')
+			if (shown.length === 0) {
+				return ''
+			}
+			const rest = missing.length - shown.length
+			const names = listText(rest > 0 ? [...shown, n('nextcloud-vue', '%n other', '%n others', rest)] : shown, getCanonicalLocale() || undefined)
+			return n('nextcloud-vue', '{names} has no location, so it is not on the map.', '{names} have no location, so they are not on the map.', missing.length, { names })
+		},
+
 		/** @return {string} The link from that card to the table. */
 		mapMissingLink() {
 			return t('nextcloud-vue', 'Show them in the table')
@@ -8788,6 +8872,11 @@ export default {
 		 * @return {string}
 		 */
 		presentedCountText() {
+			const viewLine = this.savedViewCountText
+			const view = this.appliedSavedView
+			if (view && typeof viewLine === 'string' && viewLine !== '' && this.activeScopePresentation.countText === undefined && !savedViewOverrides(view)?.countText) {
+				return viewLine
+			}
 			if (this.activeScopePresentation.countText === undefined) {
 				const byView = this.countTextByView
 				const own = byView && typeof byView === 'object' ? byView[this.currentViewMode] : undefined
@@ -8798,6 +8887,23 @@ export default {
 			return this.presented('countText')
 		},
 
+		/**
+		 * The applied saved view's conditions for the count line's `{view}`:
+		 * its description, else its filters in words, starting lower case.
+		 *
+		 * @return {string}
+		 * @spec openspec/changes/applied-view-lights-its-lens/specs/applied-view-lights-its-lens/spec.md
+		 */
+		appliedViewConditionsText() {
+			const view = this.appliedSavedView
+			if (!view) {
+				return ''
+			}
+			const own = typeof view.description === 'string' ? view.description.trim() : ''
+			const text = own !== '' ? own : String(this.viewFilterSummary(view) || '')
+			return text.charAt(0).toLowerCase() + text.slice(1)
+		},
+
 		headerDescriptionBase() {
 			const total = this.effectivePagination?.total
 			// Board look: the count line is a template over the rows on this page
@@ -8821,6 +8927,7 @@ export default {
 						.replace('{shown}', String(shown))
 						.replace('{total}', String(total))
 						.replace(/\{term\}/g, this.sourceTerm)
+						.replace(/\{view\}/g, this.appliedViewConditionsText)
 				}
 				return this.countLine(this.countSubtitle, total, shown)
 			}
@@ -8886,6 +8993,17 @@ export default {
 			return !!this.resolvedSidebar.enabled && this.resolvedSidebar.show !== false
 		},
 
+		/**
+		 * Whether the page's side panel is open now; the board look then lays
+		 * the header out narrower (DqZakenSorteren).
+		 *
+		 * @spec openspec/changes/board-header-buttons-under-title-beside-side-panel/specs/board-header-buttons-under-title-beside-side-panel/spec.md#requirement-the-header-buttons-sit-under-the-title-while-the-side-panel-is-open
+		 * @return {boolean}
+		 */
+		sidebarPanelOpen() {
+			return Boolean(this.sidebarOpen && this.hasSidebar)
+		},
+
 		/**
 		 * Whether the board toolbar draws the Filter button as a menu: the
 		 * board look, `filterMenu` on, something to filter by, and no filter
@@ -8928,7 +9046,9 @@ export default {
 
 		/** Search props forwarded to the embedded CnIndexSidebar (defaults applied per CnIndexSidebar). */
 		sidebarSearchProps() {
-			return (this.sidebar && this.sidebar.search) || {}
+			// The page's own search hint, unless `sidebar.search` names one.
+			const own = this.shownSearchPlaceholder ? { searchPlaceholder: this.shownSearchPlaceholder } : {}
+			return { ...own, ...((this.sidebar && this.sidebar.search) || {}) }
 		},
 
 		/**
@@ -10751,6 +10871,7 @@ export default {
 			// `activeQuickFilterIndex` is a setup-returned ref; the
 			// Vue 2 ref-unwrap proxy makes plain assignment work.
 			this.activeQuickFilterIndex = index
+			this.lensChosenByHand = true
 			this.$emit('quick-filter-change', index)
 		},
 
@@ -11519,10 +11640,16 @@ export default {
 			const bucket = facet && Array.isArray(facet.values)
 				? facet.values.find((fv) => fv && typeof fv === 'object' && String(fv.value) === id)
 				: null
-			if (bucket && typeof bucket.label === 'string' && bucket.label !== '') {
+			// A facet that only echoes the value names nothing; a group or an
+			// option below may.
+			if (bucket && typeof bucket.label === 'string' && bucket.label !== '' && bucket.label !== id) {
 				return this.cnTranslate(bucket.label)
 			}
 			const prop = this.effectiveSchema?.properties?.[key]
+			// The reader on a user filter is "me" (DqFilterInMenu "Behandelaar: ik").
+			if (prop && prop.referenceType === 'nextcloud-user' && id === (getCurrentUser()?.uid ?? '')) {
+				return t('nextcloud-vue', 'me')
+			}
 			if (prop && prop.referenceType === 'nextcloud-group') {
 				const name = groupDisplayName(id)
 				if (name === null) {
@@ -13180,6 +13307,7 @@ export default {
 		 */
 		onApplySavedView(view, { keepSavedViewKey = false } = {}) {
 			this.appliedSavedViewId = view && (view.id || view.slug) ? String(view.id || view.slug) : ''
+			this.lensChosenByHand = false
 			const state = extractViewState(view)
 			// A view's filters may carry tokens (`@me`, `@myTeam`): resolved here,
 			// and an optional one that answers nothing (no team) is dropped. A

package/src/components/CnIndexSidebar/CnIndexSidebar.vue

@@ -32,11 +32,17 @@
 				</div>
 
 				<div class="cn-index-sidebar__section">
+					<!-- The board look names the field by its hint, as the list's
+					     own search field, with the magnifier (DqZakenSorteren). -->
 					<NcTextField
 						:modelValue="searchValue || ''"
 						:placeholder="searchPlaceholder"
-						:label="searchLabel"
-						@update:modelValue="$emit('search', $event)" />
+						:label="isBoardLook ? searchPlaceholder : searchLabel"
+						@update:modelValue="$emit('search', $event)">
+						<template v-if="isBoardLook" #icon>
+							<Magnify :size="18" />
+						</template>
+					</NcTextField>
 				</div>
 
 				<!-- Sort (list, card and map views; the table sorts by its headers):
@@ -355,6 +361,7 @@ import DragVertical from 'vue-material-design-icons/DragVertical.vue'
 import FilterOutline from 'vue-material-design-icons/FilterOutline.vue'
 import FilterRemoveOutline from 'vue-material-design-icons/FilterRemoveOutline.vue'
 import InformationOutline from 'vue-material-design-icons/InformationOutline.vue'
+import Magnify from 'vue-material-design-icons/Magnify.vue'
 import Pin from 'vue-material-design-icons/Pin.vue'
 import PinOutline from 'vue-material-design-icons/PinOutline.vue'
 import ViewColumnOutline from 'vue-material-design-icons/ViewColumnOutline.vue'
@@ -410,6 +417,7 @@ export default {
 		Pin,
 		PinOutline,
 		InformationOutline,
+		Magnify,
 	},
 
 	inject: {

package/src/components/CnMailTab/dashboardRegistration.js

@@ -25,4 +25,8 @@ registerDashboardWidget('mail', {
 	displayName: 'Mail',
 	icon: 'EmailOutline',
 	surfaces: ['detail-page'],
+	// Draws its own title row; on a card surface it stands in an untitled card.
+	// @spec openspec/changes/mail-widget-card/specs/mail-widget-card/spec.md#requirement-the-mail-widget-stands-in-a-card-on-a-card-surface
+	ownsTitle: true,
+	chrome: 'card',
 })

package/src/components/CnNotificationMatrix/CnNotificationMatrix.vue

@@ -1093,12 +1093,16 @@ export default {
 		white-space: nowrap;
 	}
 
+	/* A theme that colours every th (thematiq's table header token) leaves
+	   the board grid's head white. */
 	.cn-notification-matrix__table {
+		--nldesign-component-table-header-background-color: transparent;
 		font-size: 14px;
 	}
 
 	.cn-notification-matrix__table thead th {
 		padding: 8px 10px 8px 0;
+		line-height: 1.2;
 		border-block-end: 1px solid var(--color-border);
 		color: var(--color-text-maxcontrast);
 		font-size: 13px;

package/src/components/CnObjectListWidget/CnObjectListWidget.vue

@@ -860,7 +860,7 @@ export default {
 				// `secondary` (a second, muted line under the cell) rides
 				// along too: the table draws it, and dropping it here took the
 				// list rows' second line away (zuiddrecht-pixel-gaps-3).
-				for (const k of ['format', 'widget', 'widgetProps', 'formatter', 'align', 'width', 'type', 'enum', 'enumLabels', 'sortable', 'secondary', 'colorMap', 'grow']) {
+				for (const k of ['format', 'widget', 'widgetProps', 'formatter', 'align', 'width', 'type', 'enum', 'enumLabels', 'sortable', 'secondary', 'colorMap', 'grow', 'cellClass']) {
 					if (c[k] !== undefined) {
 						out[k] = c[k]
 					}

package/src/components/CnObjectSidebar/CnFilesTab.vue

@@ -24,6 +24,7 @@
 			:reviewSummary="reviewSummary"
 			:footnote="footnote"
 			:nameSecondary="nameSecondary"
+			:secondLine="secondLine"
 			:linkedItems="linkedItems"
 			:columns="columns"
 			:rowData="rowDataSource"
@@ -450,6 +451,8 @@ export default {
 		footnote: { type: String, default: '' },
 		/** Forwarded to CnFilesBrowser: the second line under each file's name. */
 		nameSecondary: { type: String, default: '' },
+		/** Forwarded to CnFilesBrowser: the second line as a list of fields, or variants. */
+		secondLine: { type: Array, default: null },
 		/** A dotted path to the list of records in the `rowDataUrl` answer; empty reads the answer itself. */
 		rowDataPath: { type: String, default: '' },
 		/** The record field that holds the Nextcloud file id. */