From 496827800bd579e7703704cb7782e680bbd6ae83 Mon Sep 17 00:00:00 2001 From: Mihaly Lengyel Date: Thu, 5 Oct 2023 21:00:51 +0200 Subject: [PATCH 1/2] feat: add autocomplete attributes on passwordless form fields --- lib/build/passwordless-shared3.js | 6 ++++++ .../passwordless/components/themes/signInUp/emailForm.tsx | 1 + .../components/themes/signInUp/emailOrPhoneForm.tsx | 3 +++ .../passwordless/components/themes/signInUp/phoneForm.tsx | 1 + .../components/themes/signInUp/userInputCodeForm.tsx | 1 + 5 files changed, 12 insertions(+) diff --git a/lib/build/passwordless-shared3.js b/lib/build/passwordless-shared3.js index de28acb50..54b23e5a7 100644 --- a/lib/build/passwordless-shared3.js +++ b/lib/build/passwordless-shared3.js @@ -579,6 +579,7 @@ var EmailForm = uiEntry.withOverride("PasswordlessEmailForm", function Passwordl optional: false, autofocus: true, placeholder: "", + autoComplete: "email", // We are using the default validator that allows any string validate: validators.defaultValidate, }, @@ -2774,6 +2775,9 @@ var EmailOrPhoneForm = uiEntry.withOverride( optional: false, autofocus: true, placeholder: "", + // We do not add an autocomplete prop in this case, since we do not really have any sensible option to set + // Setting them to either "tel" or "email" would give people the wrong impression since this could have either + // AFAIK we can't set them both at the same time validate: recipe$1.defaultValidate, }, ], @@ -3415,6 +3419,7 @@ var PhoneForm = uiEntry.withOverride("PasswordlessPhoneForm", function Passwordl optional: false, autofocus: true, placeholder: "", + autoComplete: "tel", validate: validators.defaultValidate, }, ], @@ -3636,6 +3641,7 @@ var UserInputCodeForm = uiEntry.withOverride( autofocus: true, optional: false, clearOnSubmit: true, + autoComplete: "one-time-code", placeholder: "", validate: recipe$1.userInputCodeValidate, }, diff --git a/lib/ts/recipe/passwordless/components/themes/signInUp/emailForm.tsx b/lib/ts/recipe/passwordless/components/themes/signInUp/emailForm.tsx index 451b60535..97159f306 100644 --- a/lib/ts/recipe/passwordless/components/themes/signInUp/emailForm.tsx +++ b/lib/ts/recipe/passwordless/components/themes/signInUp/emailForm.tsx @@ -40,6 +40,7 @@ export const EmailForm = withOverride( optional: false, autofocus: true, placeholder: "", + autoComplete: "email", // We are using the default validator that allows any string validate: defaultValidate, }, diff --git a/lib/ts/recipe/passwordless/components/themes/signInUp/emailOrPhoneForm.tsx b/lib/ts/recipe/passwordless/components/themes/signInUp/emailOrPhoneForm.tsx index 8e7bd9cb6..54d2f0295 100644 --- a/lib/ts/recipe/passwordless/components/themes/signInUp/emailOrPhoneForm.tsx +++ b/lib/ts/recipe/passwordless/components/themes/signInUp/emailOrPhoneForm.tsx @@ -59,6 +59,9 @@ export const EmailOrPhoneForm = withOverride( optional: false, autofocus: true, placeholder: "", + // We do not add an autocomplete prop in this case, since we do not really have any sensible option to set + // Setting them to either "tel" or "email" would give people the wrong impression since this could have either + // AFAIK we can't set them both at the same time validate: defaultValidate, }, ]} diff --git a/lib/ts/recipe/passwordless/components/themes/signInUp/phoneForm.tsx b/lib/ts/recipe/passwordless/components/themes/signInUp/phoneForm.tsx index f081908da..fb2b8805f 100644 --- a/lib/ts/recipe/passwordless/components/themes/signInUp/phoneForm.tsx +++ b/lib/ts/recipe/passwordless/components/themes/signInUp/phoneForm.tsx @@ -56,6 +56,7 @@ export const PhoneForm = withOverride( optional: false, autofocus: true, placeholder: "", + autoComplete: "tel", validate: defaultValidate, }, ]} diff --git a/lib/ts/recipe/passwordless/components/themes/signInUp/userInputCodeForm.tsx b/lib/ts/recipe/passwordless/components/themes/signInUp/userInputCodeForm.tsx index 7ce45d203..d237ed0e6 100644 --- a/lib/ts/recipe/passwordless/components/themes/signInUp/userInputCodeForm.tsx +++ b/lib/ts/recipe/passwordless/components/themes/signInUp/userInputCodeForm.tsx @@ -121,6 +121,7 @@ export const UserInputCodeForm = withOverride( autofocus: true, optional: false, clearOnSubmit: true, + autoComplete: "one-time-code", placeholder: "", validate: userInputCodeValidate, }, From a0c61cc3a7117ea3683cc37b489e5654bb22e6bd Mon Sep 17 00:00:00 2001 From: Mihaly Lengyel Date: Thu, 5 Oct 2023 21:50:51 +0200 Subject: [PATCH 2/2] chore: bump version --- CHANGELOG.md | 6 +++++- lib/build/version.d.ts | 2 +- lib/ts/version.ts | 2 +- package-lock.json | 4 ++-- package.json | 2 +- 5 files changed, 10 insertions(+), 6 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index da7a4f26a..43ce536ee 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html) -## [unreleased] +## [0.35.5] - 2023-10-06 + +### Changes + +- Setting `autocomplete` in passwordless forms for email, phone and OTP ### Example changes diff --git a/lib/build/version.d.ts b/lib/build/version.d.ts index 4d6e79bf1..a27549731 100644 --- a/lib/build/version.d.ts +++ b/lib/build/version.d.ts @@ -1 +1 @@ -export declare const package_version = "0.35.4"; +export declare const package_version = "0.35.5"; diff --git a/lib/ts/version.ts b/lib/ts/version.ts index b08b6a904..c769c2bf4 100644 --- a/lib/ts/version.ts +++ b/lib/ts/version.ts @@ -12,4 +12,4 @@ * License for the specific language governing permissions and limitations * under the License. */ -export const package_version = "0.35.4"; +export const package_version = "0.35.5"; diff --git a/package-lock.json b/package-lock.json index db4eba3ae..ce7194225 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "supertokens-auth-react", - "version": "0.35.4", + "version": "0.35.5", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "supertokens-auth-react", - "version": "0.35.4", + "version": "0.35.5", "license": "Apache-2.0", "dependencies": { "intl-tel-input": "^17.0.19", diff --git a/package.json b/package.json index 4038ce709..93f767599 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "supertokens-auth-react", - "version": "0.35.4", + "version": "0.35.5", "description": "ReactJS SDK that provides login functionality with SuperTokens.", "main": "./index.js", "engines": {