@conduction/nextcloud-vue 2.56.0-beta.6 → 2.56.0-beta.8

package/l10n/en.json

@@ -294,6 +294,26 @@
     "JSON pointer": "JSON pointer",
     "Last": "Last",
     "Load more": "Load more",
+    "Nothing to open here.": "Nothing to open here.",
+    "To do": "To do",
+    "Next step": "Next step",
+    "Review": "Review",
+    "No documents to review.": "No documents to review.",
+    "Partly public": "Partly public",
+    "To review": "To review",
+    "{reviewed} of {total} reviewed": "{reviewed} of {total} reviewed",
+    "Documents to review": "Documents to review",
+    "Reply": "Reply",
+    "Send": "Send",
+    "You": "You",
+    "No messages yet.": "No messages yet.",
+    "Conversation": "Conversation",
+    "The message could not be sent. Try again.": "The message could not be sent. Try again.",
+    "More": "More",
+    "More tabs": "More tabs",
+    "Due soon": "Due soon",
+    "Administration": "Administration",
+    "Details": "Details",
     "Actor": "Actor",
     "All types": "All types",
     "All actors": "All actors",
@@ -993,7 +1013,41 @@
     "Capabilities in {group}, rated per system.": "Capabilities in {group}, rated per system.",
     "Yes": "Yes",
     "Partial": "Partial",
-    "No": "No"
+    "No": "No",
+    "Nothing planned": "Nothing planned",
+    "today": "today",
+    "Late": "Late",
+    "This week, day by day": "This week, day by day",
+    "The items for this week could not be loaded.": "The items for this week could not be loaded.",
+    "Nothing to show yet": "Nothing to show yet",
+    "The numbers could not be loaded.": "The numbers could not be loaded.",
+    "Date field": "Date field",
+    "Title field": "Title field",
+    "Extra fields under the title (comma separated)": "Extra fields under the title (comma separated)",
+    "Days shown": "Days shown",
+    "Page an item opens (page id, optional)": "Page an item opens (page id, optional)",
+    "Text for a day without items": "Text for a day without items",
+    "A date field is required": "A date field is required",
+    "Field to group by": "Field to group by",
+    "Order of the segments (values, comma separated)": "Order of the segments (values, comma separated)",
+    "Text when there is nothing to count": "Text when there is nothing to count",
+    "A field to group by is required": "A field to group by is required",
+    "Layout": "Layout",
+    "Label above the title": "Label above the title",
+    "Reason (why this needs attention)": "Reason (why this needs attention)",
+    "The actions of an attention card are declared in the manifest.": "The actions of an attention card are declared in the manifest.",
+    "An attention card needs a title": "An attention card needs a title",
+    "Good morning, {name}": "Good morning, {name}",
+    "Good morning": "Good morning",
+    "Good afternoon, {name}": "Good afternoon, {name}",
+    "Good afternoon": "Good afternoon",
+    "Good evening, {name}": "Good evening, {name}",
+    "Good evening": "Good evening",
+    "Greet the user by name instead of showing the title": "Greet the user by name instead of showing the title",
+    "Show the date of today above the heading": "Show the date of today above the heading",
+    "Plain header without a coloured background": "Plain header without a coloured background",
+    "Loading…": "Loading…",
+    "A register and schema are required": "A register and schema are required"
   },
   "plurals": {
     "%n year": ["%n year", "%n years"],

package/l10n/nl.json

@@ -294,6 +294,26 @@
     "JSON pointer": "JSON-aanwijzer",
     "Last": "Laatste",
     "Load more": "Meer laden",
+    "Nothing to open here.": "Hier is niets te openen.",
+    "To do": "Nog doen",
+    "Next step": "Volgende stap",
+    "Review": "Beoordelen",
+    "No documents to review.": "Geen documenten om te beoordelen.",
+    "Partly public": "Deels openbaar",
+    "To review": "Nog beoordelen",
+    "{reviewed} of {total} reviewed": "{reviewed} van {total} beoordeeld",
+    "Documents to review": "Documenten om te beoordelen",
+    "Reply": "Antwoord",
+    "Send": "Versturen",
+    "You": "U",
+    "No messages yet.": "Nog geen berichten.",
+    "Conversation": "Gesprek",
+    "The message could not be sent. Try again.": "Het bericht is niet verstuurd. Probeer het opnieuw.",
+    "More": "Meer",
+    "More tabs": "Meer tabbladen",
+    "Due soon": "Bijna te laat",
+    "Administration": "Beheer",
+    "Details": "Details",
     "Actor": "Actor",
     "All types": "Alle typen",
     "All actors": "Alle actoren",
@@ -1037,7 +1057,41 @@
     "Capabilities in {group}, rated per system.": "Functionaliteiten in {group}, beoordeeld per systeem.",
     "Yes": "Ja",
     "Partial": "Gedeeltelijk",
-    "No": "Nee"
+    "No": "Nee",
+    "Nothing planned": "Niets gepland",
+    "today": "vandaag",
+    "Late": "Te laat",
+    "This week, day by day": "Deze week, dag voor dag",
+    "The items for this week could not be loaded.": "De items van deze week konden niet worden geladen.",
+    "Nothing to show yet": "Nog niets te tonen",
+    "The numbers could not be loaded.": "De aantallen konden niet worden geladen.",
+    "Date field": "Datumveld",
+    "Title field": "Titelveld",
+    "Extra fields under the title (comma separated)": "Extra velden onder de titel (gescheiden door komma's)",
+    "Days shown": "Aantal dagen",
+    "Page an item opens (page id, optional)": "Pagina die een item opent (pagina-id, optioneel)",
+    "Text for a day without items": "Tekst voor een dag zonder items",
+    "A date field is required": "Een datumveld is verplicht",
+    "Field to group by": "Veld om op te groeperen",
+    "Order of the segments (values, comma separated)": "Volgorde van de segmenten (waarden, gescheiden door komma's)",
+    "Text when there is nothing to count": "Tekst als er niets te tellen is",
+    "A field to group by is required": "Een veld om op te groeperen is verplicht",
+    "Layout": "Opmaak",
+    "Label above the title": "Label boven de titel",
+    "Reason (why this needs attention)": "Reden (waarom dit aandacht vraagt)",
+    "The actions of an attention card are declared in the manifest.": "De acties van een aandachtskaart staan in het manifest.",
+    "An attention card needs a title": "Een aandachtskaart heeft een titel nodig",
+    "Good morning, {name}": "Goedemorgen, {name}",
+    "Good morning": "Goedemorgen",
+    "Good afternoon, {name}": "Goedemiddag, {name}",
+    "Good afternoon": "Goedemiddag",
+    "Good evening, {name}": "Goedenavond, {name}",
+    "Good evening": "Goedenavond",
+    "Greet the user by name instead of showing the title": "Begroet de gebruiker bij naam in plaats van de titel te tonen",
+    "Show the date of today above the heading": "Toon de datum van vandaag boven de kop",
+    "Plain header without a coloured background": "Eenvoudige kop zonder gekleurde achtergrond",
+    "Loading…": "Laden…",
+    "A register and schema are required": "Een register en schema zijn verplicht"
   },
   "plurals": {
     "%n year": ["%n jaar", "%n jaar"],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/nextcloud-vue",
-  "version": "2.56.0-beta.6",
+  "version": "2.56.0-beta.8",
   "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

@@ -41,6 +41,7 @@
   "CnContainerWidget": 1,
   "CnContainerWidgetForm": 1,
   "CnContextMenu": 1,
+  "CnConversationThread": 1,
   "CnCopyDialog": 0.82,
   "CnCospendCreate": 1,
   "CnCospendPicker": 1,
@@ -67,6 +68,7 @@
   "CnDetailWidgetHost": 1,
   "CnDividerWidget": 1,
   "CnDividerWidgetForm": 1,
+  "CnDocumentReviewList": 1,
   "CnEmailPicker": 1,
   "CnExportWizard": 1,
   "CnFacetSidebar": 0.78,
@@ -128,6 +130,7 @@
   "CnLifecycleActions": 1,
   "CnLinkButtonWidget": 1,
   "CnLinkButtonWidgetForm": 1,
+  "CnLinkCardsPage": 1,
   "CnLinksWidget": 1,
   "CnLinksWidgetForm": 1,
   "CnLockedBanner": 1,
@@ -152,6 +155,7 @@
   "CnNcDashboardWidgetForm": 1,
   "CnNcWidgetGridPicker": 1,
   "CnNcWidgetWidget": 1,
+  "CnNextStepCard": 1,
   "CnNoteCard": 0.67,
   "CnNotesCard": 0.81,
   "CnNotificationPreferences": 1,

package/src/components/CnActionsMenu/CnActionsMenu.vue

@@ -490,6 +490,19 @@ export default {
 			default: () => t('nextcloud-vue', 'Actions'),
 		},
 
+		/**
+		 * Tell the menu that `#primary-items` has content. Only needed by a
+		 * host that switches every built-in item off: the menu decides whether
+		 * to render at all in a computed, and a slot that fills in later (a
+		 * page's actions arrive after mount) is not something a computed
+		 * notices. With any built-in item showing, the menu renders anyway
+		 * and this changes nothing.
+		 */
+		hasPrimaryItems: {
+			type: Boolean,
+			default: false,
+		},
+
 		/**
 		 * Prefix for the `data-testid`s emitted on the menu container and
 		 * its items: `<base>-actions` (container), `<base>-action-refresh`,
@@ -542,7 +555,7 @@ export default {
 			if (this.showRequestFeature) {
 				return true
 			}
-			if (this.$slots['primary-items']) {
+			if (this.hasPrimaryItems || this.$slots['primary-items']) {
 				return true
 			}
 			return Boolean(this.$slots['action-items']) || Boolean(this.$slots && this.$slots['action-items'])

package/src/components/CnAppNav/CnAppNav.md

@@ -159,3 +159,29 @@ export default {
 }
 </script>
 ```
+
+A brand block at the top. The `brand` prop takes a logo, a name and a caption, and the manifest's `nav.brand` is the fallback. Use the `#brand` slot to draw the block yourself:
+
+```vue {static}
+<template>
+  <div style="height: 240px; width: 260px; background: var(--color-main-background); border: 1px solid var(--color-border); border-radius: 8px; overflow: hidden;">
+    <CnAppNav
+      :manifest="manifest"
+      :brand="{ name: 'dossiq', caption: 'Gemeente Zuiddrecht' }"
+      :translate="(key) => key" />
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      manifest: {
+        menu: [
+          { id: 'cases', label: 'All cases', icon: 'icon-folder', route: 'cases', order: 1 },
+        ],
+      },
+    }
+  },
+}
+</script>
+```

package/src/components/CnAppNav/CnAppNav.vue

@@ -75,7 +75,34 @@
 -->
 <template>
 	<NcAppNavigation :aria-label="ariaLabel" data-testid="cn-nav">
-		<template v-if="$slots.search || $slots.search" #search>
+		<template v-if="$slots.search || $slots.brand || resolvedBrand" #search>
+			<!--
+				@slot brand
+				@description Replace the brand block at the very top of the
+				navigation. Default content: the logo, name and caption from
+				the `brand` prop or the manifest's `nav.brand`. Renders
+				nothing when neither is set.
+				@binding {object|null} brand The resolved brand (`{ logo, name, caption, alt }`), or null.
+			-->
+			<slot name="brand" :brand="resolvedBrand">
+				<div
+					v-if="resolvedBrand"
+					class="cn-app-nav__brand"
+					data-testid="cn-nav-brand">
+					<!-- Decorative beside a name: the name already says whose
+					     app this is, and an alt text would say it twice. A logo
+					     on its own carries the name as its alt text. -->
+					<img
+						v-if="resolvedBrand.logo"
+						class="cn-app-nav__brand-logo"
+						:src="resolvedBrand.logo"
+						:alt="resolvedBrand.name ? '' : resolvedBrand.alt">
+					<span v-if="resolvedBrand.name || resolvedBrand.caption" class="cn-app-nav__brand-text">
+						<strong v-if="resolvedBrand.name" class="cn-app-nav__brand-name">{{ resolvedBrand.name }}</strong>
+						<span v-if="resolvedBrand.caption" class="cn-app-nav__brand-caption">{{ resolvedBrand.caption }}</span>
+					</span>
+				</div>
+			</slot>
 			<!--
 				@slot search
 				@description Forwarded into NcAppNavigation's #search slot.
@@ -531,6 +558,20 @@ export default {
 			type: String,
 			default: () => t('nextcloud-vue', 'Main navigation'),
 		},
+
+		/**
+		 * The brand block at the top of the navigation:
+		 * `{ logo?, name?, caption?, alt? }`. `logo` is an image URL, `name`
+		 * the app or organisation name, `caption` a line under it. Falls back
+		 * to the manifest's `nav.brand`. `null` (the default) with no manifest
+		 * brand renders nothing.
+		 *
+		 * @type {{logo?: string, name?: string, caption?: string, alt?: string}|null}
+		 */
+		brand: {
+			type: Object,
+			default: null,
+		},
 	},
 
 	emits: ['primary-action', 'primary-action-click'],
@@ -560,6 +601,31 @@ export default {
 			return this.translate ?? this.cnTranslate
 		},
 
+		/**
+		 * The brand to draw: the `brand` prop, else the manifest's
+		 * `nav.brand`. Name and caption go through the translate function,
+		 * like every other manifest label. Null when there is nothing to
+		 * show, which is what keeps the block out of a navigation that
+		 * declares no brand.
+		 *
+		 * @return {{logo: string, name: string, caption: string, alt: string}|null} The brand, or null.
+		 * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-navigation-brand
+		 */
+		resolvedBrand() {
+			const declared = this.brand ?? this.effectiveManifest?.nav?.brand
+			if (!declared || typeof declared !== 'object') {
+				return null
+			}
+			const text = (value) => (typeof value === 'string' && value !== '' ? this.effectiveTranslate(value) : '')
+			const brand = {
+				logo: typeof declared.logo === 'string' ? declared.logo : '',
+				name: text(declared.name),
+				caption: text(declared.caption),
+				alt: text(declared.alt),
+			}
+			return (brand.logo || brand.name || brand.caption) ? brand : null
+		},
+
 		/**
 		 * Manifest-declared root-level primary action (`nav.primaryAction`)
 		 * — retained for backwards compatibility with code that reads this
@@ -1118,11 +1184,51 @@ export default {
 			return this.effectiveTranslate(item.label)
 		},
 
+		/**
+		 * Whether a menu entry is the page the reader is on.
+		 *
+		 * Two entries may share a route and differ only in `query` ("My
+		 * work" and "Queue" on one list). The route name alone lit both. An
+		 * entry with a `query` is active only when the address carries that
+		 * query; an entry without one steps back when a sibling's query
+		 * matches, so exactly one of them is marked.
+		 *
+		 * @param {object} item Menu entry.
+		 * @return {boolean} True when the entry is the current page.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-menu-entries-that-differ-in-query
+		 */
 		isActive(item) {
 			if (item.href || !item.route) {
 				return false
 			}
-			return item.route === this.activeRouteName
+			if (item.route !== this.activeRouteName) {
+				return false
+			}
+			if (item.query && typeof item.query === 'object') {
+				return this.queryMatches(item)
+			}
+			const siblings = []
+			for (const entry of this.visibleItems) {
+				siblings.push(entry, ...this.visibleChildren(entry))
+			}
+			return !siblings.some((entry) => entry !== item
+				&& entry.route === item.route
+				&& entry.query && typeof entry.query === 'object'
+				&& this.queryMatches(entry))
+		},
+
+		/**
+		 * Whether the address carries every key of an entry's `query`.
+		 * Values are compared as strings, since an address has no numbers.
+		 *
+		 * @param {object} item Menu entry with a `query`.
+		 * @return {boolean} True when every declared key matches.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-menu-entries-that-differ-in-query
+		 */
+		queryMatches(item) {
+			const current = this.$route?.query ?? {}
+			const keys = Object.keys(item.query)
+			return keys.length > 0 && keys.every((key) => String(current[key] ?? '') === String(item.query[key]))
 		},
 
 		/**
@@ -1479,6 +1585,43 @@ export default {
 </script>
 
 <style>
+/* The brand block at the top of the navigation. */
+.cn-app-nav__brand {
+	align-items: center;
+	display: flex;
+	gap: calc(2.5 * var(--default-grid-baseline));
+	min-width: 0;
+	padding: calc(2 * var(--default-grid-baseline)) calc(2 * var(--default-grid-baseline)) calc(3 * var(--default-grid-baseline));
+}
+
+.cn-app-nav__brand-logo {
+	flex: none;
+	height: 34px;
+	max-width: 50%;
+	object-fit: contain;
+	width: auto;
+}
+
+.cn-app-nav__brand-text {
+	display: flex;
+	flex-direction: column;
+	line-height: 1.15;
+	min-width: 0;
+}
+
+.cn-app-nav__brand-name {
+	color: var(--color-main-text);
+	font-size: 1.2em;
+	font-weight: 700;
+	overflow-wrap: anywhere;
+}
+
+.cn-app-nav__brand-caption {
+	color: var(--color-text-maxcontrast);
+	font-size: 0.85em;
+	overflow-wrap: anywhere;
+}
+
 /*
  * The legacy `icon-*` classes in Nextcloud render a background-image
  * with a hardcoded dark fill, so they stay grey when an entry becomes