Merge pull request #4052 from nextcloud/fix/noid/name-title-deprecation

src/components/NcActionButton/NcActionButton.vue

@@ -196,9 +196,9 @@ export default {
 			</slot>
 
 			<!-- long text with name -->
-			<p v-if="nameTitleFallback">
+			<p v-if="name">
 				<strong class="action-button__title">
-					{{ nameTitleFallback }}
+					{{ name }}
 				</strong>
 				<br>
 				<!-- white space is shown on longtext, so we can't

src/components/NcActionLink/NcActionLink.vue

@@ -67,9 +67,9 @@ export default {
 			</slot>
 
 			<!-- long text with name -->
-			<p v-if="nameTitleFallback">
+			<p v-if="name">
 				<strong class="action-link__title">
-					{{ nameTitleFallback }}
+					{{ name }}
 				</strong>
 				<br>
 				<!-- white space is shown on longtext, so we can't

src/components/NcActionRouter/NcActionRouter.vue

@@ -38,9 +38,9 @@
 			</slot>
 
 			<!-- long text with name -->
-			<p v-if="nameTitleFallback">
+			<p v-if="name">
 				<strong class="action-router__title">
-					{{ nameTitleFallback }}
+					{{ name }}
 				</strong>
 				<br>
 				<!-- white space is shown on longtext, so we can't

src/components/NcActionText/NcActionText.vue

@@ -35,9 +35,9 @@
 			</slot>
 
 			<!-- long text with name -->
-			<p v-if="nameTitleFallback">
+			<p v-if="name">
 				<strong class="action-text__title">
-					{{ nameTitleFallback }}
+					{{ name }}
 				</strong>
 				<br>
 				<!-- white space is shown on longtext, so we can't

src/components/NcActionTextEditable/NcActionTextEditable.vue

@@ -76,8 +76,8 @@ export default {
 				<input :id="id" type="submit" class="action-text-editable__submit">
 
 				<!-- name -->
-				<strong v-if="nameTitleFallback" class="action-text__title">
-					{{ nameTitleFallback }}
+				<strong v-if="name" class="action-text__title">
+					{{ name }}
 				</strong>
 
 				<textarea :disabled="disabled"

src/components/NcAppNavigationItem/NcAppNavigationItem.vue

@@ -228,7 +228,7 @@ Just set the `pinned` prop.
 					:aria-expanded="opened.toString()"
 					:href="href || routerLinkHref || '#'"
 					:target="isExternal(href) ? '_blank' : ''"
-					:title="title || nameTitleFallback"
+					:title="title || name"
 					@blur="handleBlur"
 					@click="onClick($event, navigate, routerLinkHref)"
 					@focus="handleFocus"
@@ -242,12 +242,12 @@ Just set the `pinned` prop.
 						<slot v-else-if="isIconShown" name="icon" />
 					</div>
 					<span v-if="!editingActive" class="app-navigation-entry__title">
-						{{ nameTitleFallback }}
+						{{ name }}
 					</span>
 					<div v-if="editingActive" class="editingContainer">
 						<NcInputConfirmCancel ref="editingInput"
 							v-model="editingValue"
-							:placeholder="editPlaceholder !== '' ? editPlaceholder : nameTitleFallback"
+							:placeholder="editPlaceholder !== '' ? editPlaceholder : name"
 							@cancel="cancelEditing"
 							@confirm="handleEditingDone" />
 					</div>
@@ -257,7 +257,7 @@ Just set the `pinned` prop.
 				<!-- undo entry -->
 				<div v-if="undo" class="app-navigation-entry__deleted">
 					<div class="app-navigation-entry__deleted-description">
-						{{ nameTitleFallback }}
+						{{ name }}
 					</div>
 				</div>
 
@@ -347,20 +347,14 @@ export default {
 	props: {
 		/**
 		 * The main text content of the entry.
-		 * Previously called `title`, now deprecated
 		 */
 		name: {
 			type: String,
-			// TODO: Make it required in the next major release (see title prop)
-			default: '',
+			required: true,
 		},
 
 		/**
 		 * The title attribute of the element.
-		 *
-		 * ⚠ Using this prop as the main content text is DEPRECATED
-		 * Please use `name` instead. If you were planning to define the
-		 * html element title attribute, this is the proper way.
 		 */
 		title: {
 			type: String,
@@ -561,17 +555,6 @@ export default {
 	},
 
 	computed: {
-		/**
-		 * TODO: drop on the 8.0.0 major, see title/name prop
-		 */
-		nameTitleFallback() {
-			if (!this.name) {
-				console.warn('The `name` prop is required. Please migrate away from the deprecated `title` prop.')
-				return this.title
-			}
-			return this.name
-		},
-
 		isRouterLink() {
 			return this.to && !this.href
 		},
@@ -665,7 +648,7 @@ export default {
 
 		// Edition methods
 		handleEdit() {
-			this.editingValue = this.nameTitleFallback
+			this.editingValue = this.name
 			this.editingActive = true
 			this.onMenuToggle(false)
 			this.$nextTick(() => {
@@ -676,8 +659,6 @@ export default {
 			this.editingActive = false
 		},
 		handleEditingDone() {
-			// @deprecated, please use `name` instead
-			this.$emit('update:title', this.editingValue)
 			this.$emit('update:name', this.editingValue)
 			this.editingValue = ''
 			this.editingActive = false

src/components/NcBreadcrumb/NcBreadcrumb.vue

@@ -40,22 +40,22 @@ This component is meant to be used inside a Breadcrumbs component.
 		@dragenter="dragEnter"
 		@dragleave="dragLeave">
 		<component :is="tag"
-			v-if="(nameTitleFallback || icon) && !$slots.default"
+			v-if="(name || icon) && !$slots.default"
 			:title="title"
 			v-bind="linkAttributes"
 			v-on="$listeners">
 			<!-- @slot Slot for passing a material design icon. Precedes the icon and title prop. -->
 			<slot name="icon">
 				<span v-if="icon" :class="icon" class="icon" />
-				<span v-else>{{ nameTitleFallback }}</span>
+				<span v-else>{{ name }}</span>
 			</slot>
 		</component>
 		<NcActions v-if="$slots.default"
 			ref="actions"
 			type="tertiary"
 			:force-menu="forceMenu"
 			:open="open"
-			:menu-title="nameTitleFallback"
+			:menu-title="name"
 			:title="title"
 			:force-title="true"
 			:container="`.vue-crumb[${crumbId}]`"
@@ -86,19 +86,13 @@ export default {
 	props: {
 		/**
 		 * The main text content of the entry.
-		 * Previously called `title`, now deprecated
 		 */
 		name: {
 			type: String,
-			// TODO: Make it required in the next major release (see title prop)
-			default: null,
+			required: true,
 		},
 		/**
 		 * The title attribute of the element.
-		 *
-		 * ⚠ Using this prop as the main content text is DEPRECATED
-		 * Please use `name` instead. If you were planning to define the
-		 * html element title attribute, this is the proper way.
 		 */
 		title: {
 			type: String,
@@ -183,16 +177,6 @@ export default {
 		}
 	},
 	computed: {
-		/**
-		 * TODO: drop on the 8.0.0 major, see title/name prop
-		 */
-		nameTitleFallback() {
-			if (this.name === null) {
-				console.warn('The `name` prop is required. Please migrate away from the deprecated `title` prop.')
-				return this.title
-			}
-			return this.name
-		},
 		/**
 		 * Determines which element tag to use
 		 *

src/components/NcBreadcrumbs/NcBreadcrumbs.vue

@@ -552,8 +552,7 @@ export default {
 				const href = crumb.componentOptions.propsData.href
 				const disabled = crumb.componentOptions.propsData.disableDrop
 				const title = crumb.componentOptions.propsData.title
-				// TODO: Remove this fallback once nameTitleFallback is removed from NcBreadcrumb
-				const name = crumb.componentOptions.propsData.name || title
+				const name = crumb.componentOptions.propsData.name
 
 				// Decide whether to show the breadcrumbs as ActionRouter or ActionLink
 				let element = 'NcActionLink'
@@ -573,7 +572,6 @@ export default {
 					props: {
 						href,
 						title,
-						name: '', // TODO: Remove this once nameTitleFallback is removed from actionText.js mixin
 						to,
 					},
 					// Prevent the breadcrumbs from being draggable

src/mixins/actionText.js

@@ -35,19 +35,13 @@ export default {
 		},
 		/**
 		 * The main text content of the entry.
-		 * Previously called `title`, now deprecated
 		 */
 		name: {
 			type: String,
-			// TODO: Make the default an empty string in the next major release (see title prop)
-			default: null,
+			default: '',
 		},
 		/**
 		 * The title attribute of the element.
-		 *
-		 * ⚠ Using this prop as the main content text is DEPRECATED
-		 * Please use `name` instead. If you were planning to define the
-		 * html element title attribute, this is the proper way.
 		 */
 		title: {
 			type: String,
@@ -81,17 +75,6 @@ export default {
 	],
 
 	computed: {
-		/**
-		 * TODO: drop on the 8.0.0 major, see title/name prop
-		 */
-		nameTitleFallback() {
-			if (this.name === null && this.title) {
-				console.warn('The `title` prop was renamed. Please use the `name` prop instead if you intend to set the main content text.')
-				return this.title
-			}
-			return this.name
-		},
-
 		isIconUrl() {
 			try {
 				return new URL(this.icon)