Merge pull request #3980 from nextcloud/fix/noid/inverted-label-logic

src/components/NcInputField/NcInputField.vue

@@ -34,7 +34,7 @@ For a list of all available props and attributes, please check the [HTMLInputEle
 
 <template>
 	<div class="input-field">
-		<label v-if="!labelOutside && label !== undefined"
+		<label v-if="!labelOutside && isValidLabel"
 			class="input-field__label"
 			:class="{ 'input-field__label--hidden': !labelVisible }"
 			:for="computedId">
@@ -283,15 +283,12 @@ export default {
 				return this.hasPlaceholder ? this.placeholder : this.label
 			}
 		},
-	},
-
-	watch: {
-		label() {
-			this.validateLabel()
-		},
-
-		labelOutside() {
-			this.validateLabel()
+		isValidLabel() {
+			const isValidLabel = this.label || this.labelOutside
+			if (!isValidLabel) {
+				console.warn('You need to add a label to the NcInputField component. Either use the prop label or use an external one, as per the example in the documentation.')
+			}
+			return isValidLabel
 		},
 	},
 
@@ -303,12 +300,6 @@ export default {
 		handleTrailingButtonClick(event) {
 			this.$emit('trailing-button-click', event)
 		},
-
-		validateLabel() {
-			if (this.label && !this.labelOutside) {
-				throw new Error('You need to add a label to the textField component. Either use the prop label or use an external one, as per the example in the documentation')
-			}
-		},
 	},
 }
 </script>