@conduction/nextcloud-vue 2.56.0-beta.3 → 2.56.0-beta.5

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: 33667612 bytes
-sha256: 99d23a886ff7c0e30fbe0745ed20fa6399710f26529d6b8495de7aa1f01e40a1
+size: 33724477 bytes
+sha256: c593f3967574b3cc9859bbff81c44bf2dcc4e304406f11ca2a1267065ef51df2

package/dist/nextcloud-vue.css

@@ -364,6 +364,32 @@
 	background-color: var(--color-primary-light);
 }
 
+/* A row with a route is a real link (see CnDataTable's row link): the anchor
+   in its first cell is stretched over the whole row. The row's own controls
+   sit above it so they stay usable; keep the list in step with NESTED_CONTROL
+   in utils/rowAuxClick.js. */
+.cn-table-row--linked {
+	position: relative;
+}
+
+.cn-table-row__link {
+	position: absolute;
+	inset: 0;
+	cursor: pointer;
+}
+
+.cn-table-row__link:focus-visible {
+	outline: 2px solid var(--color-main-text);
+	outline-offset: -2px;
+}
+
+.cn-table-row--linked .cn-table-col--checkbox,
+.cn-table-row--linked .cn-table-col--actions,
+.cn-table-row--linked td :is(a, button, input, select, textarea, label, summary, [role='button'], [role='checkbox'], [role='link'], [contenteditable='true']):not(.cn-table-row__link) {
+	position: relative;
+	z-index: 1;
+}
+
 /* Column Types */
 .cn-table-col--checkbox {
 	width: 50px;
@@ -5995,6 +6021,32 @@ svg.leaflet-image-layer.leaflet-interactive path {
 	background-color: var(--color-primary-light);
 }
 
+/* A row with a route is a real link (see CnDataTable's row link): the anchor
+   in its first cell is stretched over the whole row. The row's own controls
+   sit above it so they stay usable; keep the list in step with NESTED_CONTROL
+   in utils/rowAuxClick.js. */
+.cn-table-row--linked {
+	position: relative;
+}
+
+.cn-table-row__link {
+	position: absolute;
+	inset: 0;
+	cursor: pointer;
+}
+
+.cn-table-row__link:focus-visible {
+	outline: 2px solid var(--color-main-text);
+	outline-offset: -2px;
+}
+
+.cn-table-row--linked .cn-table-col--checkbox,
+.cn-table-row--linked .cn-table-col--actions,
+.cn-table-row--linked td :is(a, button, input, select, textarea, label, summary, [role='button'], [role='checkbox'], [role='link'], [contenteditable='true']):not(.cn-table-row__link) {
+	position: relative;
+	z-index: 1;
+}
+
 /* Column Types */
 .cn-table-col--checkbox {
 	width: 50px;
@@ -9701,14 +9753,18 @@ a.cn-deck-tab__card-title[data-v-3501a864]:hover {
 	background: none;
 	border: none;
 	padding: 6px 0;
-	cursor: pointer;
 	text-align: left;
 	color: inherit;
 	font: inherit;
 	text-decoration: none;
 	box-sizing: border-box;
 }
-.cn-email-card__open:hover .cn-email-card__subject[data-v-fda51a6a] {
+
+/* Only a row with Mail ids is a link; the rest must not look clickable. */
+a.cn-email-card__open[data-v-fda51a6a] {
+	cursor: pointer;
+}
+a.cn-email-card__open:hover .cn-email-card__subject[data-v-fda51a6a] {
 	color: var(--color-primary-element);
 }
 .cn-email-card__avatar[data-v-fda51a6a] {
@@ -9949,10 +10005,14 @@ a.cn-deck-tab__card-title[data-v-3501a864]:hover {
 	border-radius: var(--border-radius-large, 8px);
 	color: inherit;
 	text-decoration: none;
-	cursor: pointer;
 	position: relative;
 }
-.cn-email-tab__row[data-v-0bcebbac]:hover {
+
+/* Only a row with Mail ids is a link; the rest must not look clickable. */
+a.cn-email-tab__row[data-v-0bcebbac] {
+	cursor: pointer;
+}
+a.cn-email-tab__row[data-v-0bcebbac]:hover {
 	background-color: var(--color-background-hover);
 }
 .cn-email-tab__unread-dot[data-v-0bcebbac] {
@@ -17677,7 +17737,11 @@ to { background-position: -200% 0;
 }
 
 /* A fade over the clipped edge, only on the side that hides tabs. Stops a
-   pixel above the bar's rule so the rule keeps its full colour. */
+   pixel above the bar's rule so the rule keeps its full colour.
+
+   z-index 2 so the fades outrank a lifted tab: CnTabsWidget puts the open tab
+   at 1, and a tie goes to DOM order, which would draw that tab over the start
+   fade (it precedes the tabs) while the end fade still covered it. */
 .cn-tabs__strip[data-v-5c1a056f]::before,
 .cn-tabs__strip[data-v-5c1a056f]::after {
 	content: '';
@@ -17686,7 +17750,7 @@ to { background-position: -200% 0;
 	pointer-events: none;
 	position: absolute;
 	width: 56px;
-	z-index: 1;
+	z-index: 2;
 }
 .cn-tabs__strip[data-v-5c1a056f]::before {
 	background: linear-gradient(to right, var(--color-main-background) 30%, transparent);
@@ -17720,7 +17784,7 @@ to { background-position: -200% 0;
 	padding: 0;
 	position: absolute;
 	width: 28px;
-	z-index: 2;
+	z-index: 3;
 }
 
 /* Nextcloud's `button:hover` rule would otherwise fill the chevron. */
@@ -23058,6 +23122,13 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-75628
 	color: var(--color-main-text);
 }
 
+/* An on-demand step that did not run says so quietly: it is a choice the
+   user did not make, not a failure. */
+.cn-setup-summary__item--not-run .cn-setup-summary__value[data-v-75b2078b] {
+	font-weight: normal;
+	color: var(--color-text-maxcontrast);
+}
+
 
 .cn-admin-settings-shell[data-v-260aa222] {
 	max-width: 900px;

package/l10n/en.json

@@ -354,6 +354,7 @@
     "No widgets configured": "No widgets configured",
     "Not configured": "Not configured",
     "Not set": "Not set",
+    "Not run": "Not run",
     "Notes": "Notes",
     "Number": "Number",
     "Number configuration": "Number configuration",
@@ -373,6 +374,7 @@
     "One of": "One of",
     "Open": "Open",
     "Open access:": "Open access:",
+    "Open row": "Open row",
     "Operator": "Operator",
     "Order": "Order",
     "Owner:": "Owner:",

package/l10n/nl.json

@@ -354,6 +354,7 @@
     "No widgets configured": "Geen widgets geconfigureerd",
     "Not configured": "Niet geconfigureerd",
     "Not set": "Niet ingesteld",
+    "Not run": "Niet uitgevoerd",
     "Notes": "Notities",
     "Number": "Getal",
     "Number configuration": "Nummerconfiguratie",
@@ -371,6 +372,7 @@
     "One of": "Één van",
     "Open": "Openen",
     "Open access:": "Openbare toegang:",
+    "Open row": "Rij openen",
     "Operator": "Operator",
     "Order": "Volgorde",
     "Owner:": "Eigenaar:",

package/package.json

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

@@ -109,7 +109,7 @@
 				@event add
 				@description User clicked the primary Add button. No payload.
 			-->
-			<!-- With `addHref` / `addTo` the button is a real link (middle-click, new tab), and still emits `add`. -->
+			<!-- With `addHref` / `addTo` the button is a real link (middle-click, new tab), and still emits `add`, except on a modified click, which opens a new tab. -->
 			<NcButton v-if="showAdd"
 				variant="primary"
 				:disabled="addDisabled"
@@ -153,8 +153,7 @@
 
 				<NcActionLink v-if="documentationUrl"
 					:href="documentationUrl"
-					target="_blank"
-					rel="noopener noreferrer">
+					target="_blank">
 					<template #icon>
 						<BookOpenVariantOutline :size="20" />
 					</template>
@@ -372,6 +371,7 @@ import ViewGridOutline from 'vue-material-design-icons/ViewGridOutline.vue'
 import ViewListOutline from 'vue-material-design-icons/ViewListOutline.vue'
 import CnBuildiqEditButton from '../CnBuildiqEditButton/CnBuildiqEditButton.vue'
 import { followItemActionLink, resolveItemActionLink } from '../../utils/actionLink.js'
+import { isModifiedClick } from '../../utils/linkNavigation.js'
 import { CnIcon } from '../CnIcon/index.js'
 
 /**
@@ -923,12 +923,17 @@ export default {
 
 		/**
 		 * Add button click: a plain click on an in-app link routes in place,
-		 * anything else on a link is the browser's. Emits `add` either way.
+		 * anything else on a link is the browser's. Emits `add`, except for a
+		 * modified click on a link, which opens in a new tab: a host `@add`
+		 * would otherwise run in the tab the user is leaving.
 		 *
 		 * @param {MouseEvent} event The click event.
 		 */
 		onAddClick(event) {
 			if (this.addLink) {
+				if (isModifiedClick(event)) {
+					return
+				}
 				followItemActionLink(event, this.addLink, this.$router)
 			}
 			this.$emit('add')
@@ -936,13 +941,17 @@ export default {
 
 		/**
 		 * A header link entry was clicked: route a plain in-app click and emit
-		 * `header-action` as the button would.
+		 * `header-action` as the button would. A modified click is the
+		 * browser's alone (a new tab), so nothing is emitted for it.
 		 *
 		 * @param {object} entry The header action.
 		 * @param {object} link The resolved link.
 		 * @param {MouseEvent} event The click event.
 		 */
 		onHeaderLinkClick(entry, link, event) {
+			if (isModifiedClick(event)) {
+				return
+			}
 			followItemActionLink(event, link, this.$router)
 			this.$emit('header-action', { action: entry.id, id: entry.id })
 		},

package/src/components/CnActionsMenu/CnActionsMenu.vue

@@ -69,7 +69,6 @@
 				v-if="showRequestFeature && resolvedRequestFeatureUrl"
 				:href="resolvedRequestFeatureUrl"
 				target="_blank"
-				rel="noopener noreferrer"
 				:data-testid="`${testidBase}-action-request-feature`"
 				:closeAfterClick="true"
 				@click="onRequestFeatureClick">
@@ -92,7 +91,6 @@
 				v-if="showReportBug && resolvedReportBugUrl"
 				:href="resolvedReportBugUrl"
 				target="_blank"
-				rel="noopener noreferrer"
 				:data-testid="`${testidBase}-action-report-bug`"
 				:closeAfterClick="true">
 				<template #icon>
@@ -104,7 +102,6 @@
 				v-if="showDocumentation && resolvedDocumentationUrl"
 				:href="resolvedDocumentationUrl"
 				target="_blank"
-				rel="noopener noreferrer"
 				:data-testid="`${testidBase}-action-documentation`"
 				:closeAfterClick="true">
 				<template #icon>

package/src/components/CnAdminSettingsShell/CnAdminSettingsShell.vue

@@ -47,8 +47,7 @@
 				<NcButton
 					v-if="showHelp && helpUrl"
 					:href="helpUrl"
-					target="_blank"
-					rel="noopener noreferrer">
+					target="_blank">
 					<template #icon>
 						<HelpCircleOutline :size="20" />
 					</template>

package/src/components/CnAppRoot/CnAppRoot.vue

@@ -487,9 +487,18 @@
 			  dismissed the walkthrough remounts and the first-visit tour
 			  starts (or resumes) then. `!== true` keeps apps that opted out
 			  of the support note (`cnSupportVisible` undefined) unaffected.
+
+			  Withheld the same way while the setup status is still loading
+			  and while the non-gating setup wizard is open
+			  (`walkthroughHeldForSetup`). On a first run the wizard and the
+			  first-visit tour both qualify; the tour used to open behind the
+			  wizard, and its window-level ESC listener meant closing the
+			  wizard with ESC also dismissed the tour and recorded it as seen.
+			  Held back, the tour is never mounted, so nothing is recorded; it
+			  starts when the wizard is dismissed or finished.
 			-->
 			<!-- @slot walkthrough Override the gating-free walkthrough overlay. Scope: { manifest, seenVersion }. -->
-			<slot v-if="walkthroughEnabled && walkthroughSeenResolved && cnSupportVisible !== true"
+			<slot v-if="walkthroughEnabled && walkthroughSeenResolved && cnSupportVisible !== true && !walkthroughHeldForSetup"
 				name="walkthrough"
 				:manifest="manifest"
 				:seenVersion="walkthroughSeenVersion">
@@ -2376,6 +2385,10 @@ export default {
 		 * Neither guard subsumes the other — (1) is about steps the server never
 		 * reports, (2) about steps it can never mark done — so both are needed.
 		 *
+		 * 3. On-demand steps (`onDemand: true`) are excluded too: they run only
+		 *    when the user asks (learniq's "Remove the example data"), so they
+		 *    are never outstanding work.
+		 *
 		 * @return {boolean} True when an actionable optional step is genuinely outstanding.
 		 */
 		optionalSetupPending() {
@@ -2395,7 +2408,9 @@ export default {
 			const outstanding = s.completed.value === true
 				? (s.optionalUnmetReported ? s.optionalUnmetReported.value : [])
 				: s.optionalUnmet.value
-			return outstanding.some((st) => st.type !== 'info' && st.type !== 'summary')
+			// On-demand steps (`onDemand: true`) run only when the user asks,
+			// so they are never outstanding and never reason to open the wizard.
+			return outstanding.some((st) => st.type !== 'info' && st.type !== 'summary' && st.onDemand !== true)
 		},
 
 		/**
@@ -2478,6 +2493,20 @@ export default {
 			return (w && typeof w.completionConfigKey === 'string' && w.completionConfigKey) || ''
 		},
 
+		/**
+		 * Whether the setup flow holds the walkthrough back: the setup status
+		 * has not settled yet (an outstanding optional step may still open the
+		 * wizard), or the non-gating setup wizard is open. The gating setup
+		 * phase needs no check here, it replaces the shell (and the tour with
+		 * it) outright. Apps without a `setup` block settle immediately, so
+		 * this is `false` for them from the first render.
+		 *
+		 * @return {boolean} True while the tour must wait for setup.
+		 */
+		walkthroughHeldForSetup() {
+			return !this.setupStatusSettled || this.setupWizardOpen
+		},
+
 		/**
 		 * The user's last-seen app version for walkthrough composition. Resolved
 		 * from the per-user `completionConfigKey` preference (cross-device) with

package/src/components/CnBoardView/CnBoardView.vue

@@ -108,6 +108,7 @@
 								:data-card-id="cardKey(card)"
 								:aria-label="cardLabel(card, column)"
 								@click="openCard(card, $event)"
+								@mousedown="preventMiddleClickAutoscroll"
 								@auxclick="onCardAuxClick(card, $event)">
 								{{ openLabel }}
 							</button>
@@ -161,7 +162,7 @@ import { translate as t } from '@nextcloud/l10n'
 import { buildBoardColumns } from '../../utils/boardColumns.js'
 import { buildSwimlanes } from '../../utils/boardSwimlanes.js'
 import { DROP_OUTCOMES, runBoardDrop } from '../../utils/boardTransition.js'
-import { isRowMiddleClick } from '../../utils/rowAuxClick.js'
+import { isRowMiddleClick, preventMiddleClickAutoscroll } from '../../utils/rowAuxClick.js'
 
 /**
  * CnBoardView — the index page's rows as a board, one column per stage.
@@ -253,7 +254,7 @@ export default {
 		},
 	},
 
-	emits: ['card-click', 'moved', 'refused', 'stale'],
+	emits: ['card-click', 'card-aux-click', 'moved', 'refused', 'stale'],
 
 	data() {
 		return {
@@ -333,6 +334,8 @@ export default {
 	methods: {
 		t,
 
+		preventMiddleClickAutoscroll,
+
 		/**
 		 * Open one card. The pointer and the keyboard both come through here,
 		 * so a reader on Enter reaches the same record as a reader on click.
@@ -343,13 +346,15 @@ export default {
 		 */
 		openCard(card, event) {
 			/**
-			 * @event card-click Emitted when a reader opens a card, by click, Enter or middle click. Payload: `(card, event)` — the card row and the native event, so the host can open it in a new tab on a ctrl/cmd/shift or middle click.
+			 * @event card-click Emitted when a reader opens a card, by click or Enter. Payload: `(card, event)` — the card row and the native event, so the host can open it in a new tab on a ctrl/cmd/shift click. A middle click emits `card-aux-click` instead.
 			 */
 			this.$emit('card-click', card, event)
 		},
 
 		/**
-		 * Middle click on a card's open button: open it like a click would.
+		 * Middle click on a card's open button: emits `card-aux-click`, not
+		 * `card-click`, so an existing listener that navigates never moves the
+		 * current tab away.
 		 *
 		 * @param {object} card The card the reader picked.
 		 * @param {MouseEvent} event The auxclick event.
@@ -357,7 +362,10 @@ export default {
 		 */
 		onCardAuxClick(card, event) {
 			if (isRowMiddleClick(event)) {
-				this.openCard(card, event)
+				/**
+				 * @event card-aux-click Emitted when a reader middle-clicks a card, for opening it in a new tab (see `openRowTarget`). Payload: `(card, event)` — the card row and the native auxclick event.
+				 */
+				this.$emit('card-aux-click', card, event)
 			}
 		},
 

package/src/components/CnCardGrid/CnCardGrid.vue

@@ -149,7 +149,7 @@ export default {
 		},
 	},
 
-	emits: ['click', 'select'],
+	emits: ['click', 'select', 'aux-click'],
 
 	computed: {
 		/**
@@ -184,6 +184,14 @@ export default {
 			const listeners = { select: () => this.toggleSelect(object) }
 			if (!this.selectable || this.clickToView) {
 				listeners.click = (_card, event) => this.$emit('click', object, event)
+				// A middle click, kept off `click` so a navigating listener stays put.
+				listeners['aux-click'] = (_card, event) => {
+					/**
+					 * @event aux-click Emitted when a navigating card is middle-clicked, for opening it in a new tab (see `openRowTarget`). Payload: `(object, event)` — the card's object and the native auxclick event.
+					 * @type {object} The card's object.
+					 */
+					this.$emit('aux-click', object, event)
+				}
 			}
 			return listeners
 		},

package/src/components/CnContextMenu/CnContextMenu.vue

@@ -94,6 +94,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 { CnIcon } from '../CnIcon/index.js'
 
 /**
@@ -493,13 +494,17 @@ export default {
 		/**
 		 * A link entry was clicked: route a plain in-app click, leave the rest to
 		 * the browser, and emit `action` as a button would. The `handler` is not
-		 * called, since navigating is what the link already does.
+		 * called, since navigating is what the link already does. A modified
+		 * click opens a new tab, so nothing is emitted in this one.
 		 *
 		 * @param {object} action The action descriptor.
 		 * @param {object} link The resolved link.
 		 * @param {MouseEvent} event The click event.
 		 */
 		onLinkAction(action, link, event) {
+			if (isModifiedClick(event)) {
+				return
+			}
 			followItemActionLink(event, link, this.$router)
 			this.$emit('action', { action: action.label, row: this.targetItem })
 		},

package/src/components/CnDataTable/CnDataTable.md

@@ -229,7 +229,7 @@ features are folded in here as opt-in props (bare-table usage is unchanged):
 - `fetchParams` — extra query params for the self-fetch (a resolved filter map,
   `_order[field]` ordering, `_limit`); changing it re-triggers the fetch. Used by
   `CnWidgetObjectTable`'s declarative `source`.
-- `rowClickRoute` — a function mapping a clicked row to a vue-router route to push.
+- `rowClickRoute` — a function mapping a row to a vue-router route. Each such row renders a real `<a href>` in its first cell, stretched over the row, so hovering shows the URL, a plain or alt click routes in place, a ctrl/cmd/shift or middle click opens a new tab, and the row is reachable with Tab. The link is named by the first cell's text ("Open row" when that is empty or not plain text). There is no link on a `selectable` table without `rowClickToView`, where a row click selects. `CnWidgetObjectTable` rows inherit it. Trade-offs: cell text cannot be selected by dragging on a linked row, and a right-click on it shows the browser's link menu only when no host listens to `row-context-menu`.
 - `hideHeader` — drop the column-label row for a compact list widget.
 - `#footer` slot — supply a custom footer link (e.g. "+ New" or an always-shown
   "View all") with its own handler; works outside a vue-router context.