From e1266fc9bd8f5008592e2cb8043718d75187af1f Mon Sep 17 00:00:00 2001
From: "Grigorii K. Shartsev" <me@shgk.me>
Date: Fri, 2 Aug 2024 10:22:22 +0200
Subject: [PATCH] feat(NcPasswordField): add as-text prop to remove
 autocomplete

Signed-off-by: Grigorii K. Shartsev <me@shgk.me>

[skip ci]
---
 .../NcPasswordField/NcPasswordField.vue       | 27 ++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/components/NcPasswordField/NcPasswordField.vue b/src/components/NcPasswordField/NcPasswordField.vue
index f2f8464641..2f846361b4 100644
--- a/src/components/NcPasswordField/NcPasswordField.vue
+++ b/src/components/NcPasswordField/NcPasswordField.vue
@@ -44,6 +44,10 @@ General purpose password field component.
 		<NcPasswordField v-model="text5"
 			:disabled="true"
 			label="Disabled" />
+
+		<NcPasswordField :value.sync="text6"
+			label="Secret token"
+			as-text />
 	</div>
 </template>
 <script>
@@ -57,6 +61,7 @@ export default {
 			text3: 'hunter',
 			text4: '',
 			text5: '',
+			text6: 'secret-token',
 		}
 	},
 
@@ -91,7 +96,7 @@ export default {
 <template>
 	<NcInputField v-bind="propsToForward"
 		ref="inputField"
-		:type="isPasswordHidden ? 'password' : 'text'"
+		:type="isPasswordHidden && !asText ? 'password' : 'text'"
 		:trailing-button-label="trailingButtonLabelPassword"
 		:helper-text="computedHelperText"
 		:error="computedError"
@@ -204,6 +209,18 @@ export default {
 			type: Number,
 			default: null,
 		},
+
+		/**
+		 * Render as input[type=text] that looks like password field.
+		 * Allows to avoid unwanted password-specific browser behavior,
+		 * such as save or generate password prompt.
+		 * Useful for secret token fields.
+		 * Note: autocomplete="off" is ignored by browsers.
+		 */
+		asText: {
+			type: Boolean,
+			default: false,
+		},
 	},
 
 	emits: [
@@ -324,3 +341,11 @@ export default {
 	},
 }
 </script>
+
+<style lang="scss" scoped>
+:deep(.password-field__input--secure-text) {
+	// Emulate password field look
+	// This is not a part of the standard but well supported
+	-webkit-text-security: disc;
+}
+</style>