Add target prop for NcListItem

The component user should have full control over what tab they want the link to open in, if any. Signed-off-by: fenn-cs <[email protected]>
nextcloud-libraries · Dec 6, 2023 · bdcfe3c · bdcfe3c
1 parent 8008811
commit bdcfe3c
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/src/components/NcListItem/NcListItem.vue b/src/components/NcListItem/NcListItem.vue
@@ -316,7 +316,7 @@
 			<a :id="anchorId"
 				ref="list-item"
 				:href="routerLinkHref || href"
-				:target="href === '#' ? undefined : '_blank'"
+				:target="computedTarget"
 				:rel="href === '#' ? undefined : 'noopener noreferrer'"
 				class="list-item"
 				:aria-label="linkAriaLabel"
@@ -470,6 +470,11 @@ export default {
 			default: '#',
 		},
 
+		target: {
+			type: String,
+			required: false,
+		},
+
 		/**
 		 * Id for the `<a>` element
 		 */
@@ -585,7 +590,12 @@ export default {
 		computedActionsAriaLabel() {
 			return this.actionsAriaLabel || t('Actions for item with name "{name}"', { name: this.name })
 		},
-
+		computedTarget() {
+			if (this.target !== undefined && this.target !== null) {
+				return this.target
+			}
+			return this.href === '#' ? undefined : '_blank'
+		},
 	},
 
 	watch: {