Skip to content

Commit 4d46e4e

Browse files
chore(clerk-js): Add title attribute to email field (#6956)
1 parent 2a815eb commit 4d46e4e

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

52 files changed

+521
-73
lines changed

.changeset/eighty-coins-punch.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
'@clerk/localizations': patch
3+
'@clerk/clerk-js': patch
4+
'@clerk/types': patch
5+
---
6+
7+
Add title attribute to email address field with the recommended format.

packages/clerk-js/src/ui/primitives/Input.tsx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
22

3+
import { localizationKeys, useLocalizations } from '../localization';
34
import type { PrimitiveProps, RequiredProp, StyleVariants } from '../styledSystem';
45
import { common, createVariants, mqu } from '../styledSystem';
56
import { sanitizeInputProps, useFormField } from './hooks/useFormField';
@@ -63,6 +64,7 @@ export type InputProps = PrimitiveProps<'input'> & StyleVariants<typeof applyVar
6364

6465
export const Input = React.forwardRef<HTMLInputElement, InputProps>((props, ref) => {
6566
const fieldControl = useFormField() || {};
67+
const { t } = useLocalizations();
6668
// @ts-expect-error Typescript is complaining that `feedbackMessageId` does not exist. We are clearly passing them from above.
6769
const { feedbackMessageId, ignorePasswordManager, feedbackType, ...fieldControlProps } = sanitizeInputProps(
6870
fieldControl,
@@ -86,7 +88,12 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>((props, ref)
8688

8789
const typeProps =
8890
type === 'email'
89-
? { type: 'text' as const, pattern: '^.*@[a-zA-Z0-9\\-]+\\.[a-zA-Z0-9\\-\\.]+$', inputMode: 'email' as const }
91+
? {
92+
type: 'text' as const,
93+
pattern: '^.*@[a-zA-Z0-9\\-]+\\.[a-zA-Z0-9\\-\\.]+$',
94+
inputMode: 'email' as const,
95+
title: t(localizationKeys('formFieldInput__emailAddress_format')),
96+
}
9097
: { type: type || ('text' as const) };
9198

9299
const passwordManagerProps = ignorePasswordManager

packages/localizations/src/ar-SA.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,6 @@ export const arSA: LocalizationResource = {
121121
monthly: undefined,
122122
pastDue: undefined,
123123
pay: undefined,
124-
paymentMethods__label: undefined,
125124
paymentMethod: {
126125
applePayDescription: {
127126
annual: undefined,
@@ -136,6 +135,7 @@ export const arSA: LocalizationResource = {
136135
testCardInfo: undefined,
137136
},
138137
},
138+
paymentMethods__label: undefined,
139139
popular: undefined,
140140
pricingTable: {
141141
billingCycle: undefined,
@@ -220,6 +220,7 @@ export const arSA: LocalizationResource = {
220220
formFieldInputPlaceholder__password: undefined,
221221
formFieldInputPlaceholder__phoneNumber: undefined,
222222
formFieldInputPlaceholder__username: undefined,
223+
formFieldInput__emailAddress_format: undefined,
223224
formFieldLabel__apiKeyDescription: undefined,
224225
formFieldLabel__apiKeyExpiration: undefined,
225226
formFieldLabel__apiKeyName: undefined,
@@ -636,6 +637,10 @@ export const arSA: LocalizationResource = {
636637
titleNewTab: 'تم تسجيل الدخول في علامة تبويب أخرى',
637638
},
638639
},
640+
enterpriseConnections: {
641+
subtitle: undefined,
642+
title: undefined,
643+
},
639644
forgotPassword: {
640645
formTitle: 'رمز تحقق لإعادة تعيين كلمة المرور',
641646
resendButton: 'لم يصلك أي رمز؟ حاول مرة أخرى.',
@@ -758,6 +763,10 @@ export const arSA: LocalizationResource = {
758763
title: 'تم التحقق بنجاح من البريد الإلكتروني',
759764
},
760765
},
766+
enterpriseConnections: {
767+
subtitle: undefined,
768+
title: undefined,
769+
},
761770
legalConsent: {
762771
checkbox: {
763772
label__onlyPrivacyPolicy: undefined,

packages/localizations/src/be-BY.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,6 @@ export const beBY: LocalizationResource = {
121121
monthly: undefined,
122122
pastDue: undefined,
123123
pay: undefined,
124-
paymentMethods__label: undefined,
125124
paymentMethod: {
126125
applePayDescription: {
127126
annual: undefined,
@@ -136,6 +135,7 @@ export const beBY: LocalizationResource = {
136135
testCardInfo: undefined,
137136
},
138137
},
138+
paymentMethods__label: undefined,
139139
popular: undefined,
140140
pricingTable: {
141141
billingCycle: undefined,
@@ -221,6 +221,7 @@ export const beBY: LocalizationResource = {
221221
formFieldInputPlaceholder__password: 'Увядзіце ваш пароль',
222222
formFieldInputPlaceholder__phoneNumber: 'Увядзіце ваш нумар тэлефона',
223223
formFieldInputPlaceholder__username: 'Увядзіце імя карыстальніка',
224+
formFieldInput__emailAddress_format: undefined,
224225
formFieldLabel__apiKeyDescription: undefined,
225226
formFieldLabel__apiKeyExpiration: undefined,
226227
formFieldLabel__apiKeyName: undefined,
@@ -643,6 +644,10 @@ export const beBY: LocalizationResource = {
643644
titleNewTab: 'Залогіньцеся на іншай укладцы',
644645
},
645646
},
647+
enterpriseConnections: {
648+
subtitle: undefined,
649+
title: undefined,
650+
},
646651
forgotPassword: {
647652
formTitle: 'Код аднаўлення пароля',
648653
resendButton: 'Адправіць код яшчэ раз',
@@ -763,6 +768,10 @@ export const beBY: LocalizationResource = {
763768
title: 'Пошта верыфікавана',
764769
},
765770
},
771+
enterpriseConnections: {
772+
subtitle: undefined,
773+
title: undefined,
774+
},
766775
legalConsent: {
767776
checkbox: {
768777
label__onlyPrivacyPolicy: 'Я згаджаюся з палітыкай канфідэнцыяльнасці',

packages/localizations/src/bg-BG.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,6 @@ export const bgBG: LocalizationResource = {
122122
monthly: undefined,
123123
pastDue: undefined,
124124
pay: undefined,
125-
paymentMethods__label: undefined,
126125
paymentMethod: {
127126
applePayDescription: {
128127
annual: undefined,
@@ -137,6 +136,7 @@ export const bgBG: LocalizationResource = {
137136
testCardInfo: undefined,
138137
},
139138
},
139+
paymentMethods__label: undefined,
140140
popular: undefined,
141141
pricingTable: {
142142
billingCycle: undefined,
@@ -220,6 +220,7 @@ export const bgBG: LocalizationResource = {
220220
formFieldInputPlaceholder__password: 'Парола',
221221
formFieldInputPlaceholder__phoneNumber: '+359 123 456 789',
222222
formFieldInputPlaceholder__username: 'Име на потребител',
223+
formFieldInput__emailAddress_format: undefined,
223224
formFieldLabel__apiKeyDescription: undefined,
224225
formFieldLabel__apiKeyExpiration: undefined,
225226
formFieldLabel__apiKeyName: undefined,
@@ -639,6 +640,10 @@ export const bgBG: LocalizationResource = {
639640
titleNewTab: 'Влезнали сте в друг таб',
640641
},
641642
},
643+
enterpriseConnections: {
644+
subtitle: undefined,
645+
title: undefined,
646+
},
642647
forgotPassword: {
643648
formTitle: 'Код за нулиране на парола',
644649
resendButton: 'Не сте получили код? Изпрати отново',
@@ -760,6 +765,10 @@ export const bgBG: LocalizationResource = {
760765
title: 'Успешно потвърден имейл',
761766
},
762767
},
768+
enterpriseConnections: {
769+
subtitle: undefined,
770+
title: undefined,
771+
},
763772
legalConsent: {
764773
checkbox: {
765774
label__onlyPrivacyPolicy: 'Съгласен съм само с политиката за конфиденциалност',

packages/localizations/src/bn-IN.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,6 @@ export const bnIN: LocalizationResource = {
121121
monthly: undefined,
122122
pastDue: undefined,
123123
pay: undefined,
124-
paymentMethods__label: undefined,
125124
paymentMethod: {
126125
applePayDescription: {
127126
annual: undefined,
@@ -136,6 +135,7 @@ export const bnIN: LocalizationResource = {
136135
testCardInfo: undefined,
137136
},
138137
},
138+
paymentMethods__label: undefined,
139139
popular: undefined,
140140
pricingTable: {
141141
billingCycle: undefined,
@@ -219,6 +219,7 @@ export const bnIN: LocalizationResource = {
219219
formFieldInputPlaceholder__password: 'আপনার পাসওয়ার্ড লিখুন',
220220
formFieldInputPlaceholder__phoneNumber: 'আপনার ফোন নম্বর লিখুন',
221221
formFieldInputPlaceholder__username: undefined,
222+
formFieldInput__emailAddress_format: undefined,
222223
formFieldLabel__apiKeyDescription: undefined,
223224
formFieldLabel__apiKeyExpiration: undefined,
224225
formFieldLabel__apiKeyName: undefined,
@@ -641,6 +642,10 @@ export const bnIN: LocalizationResource = {
641642
titleNewTab: 'অন্য ট্যাবে সাইন ইন হয়েছে',
642643
},
643644
},
645+
enterpriseConnections: {
646+
subtitle: undefined,
647+
title: undefined,
648+
},
644649
forgotPassword: {
645650
formTitle: 'পাসওয়ার্ড রিসেট কোড',
646651
resendButton: 'কোনো কোড পাননি? পুনরায় পাঠান',
@@ -763,6 +768,10 @@ export const bnIN: LocalizationResource = {
763768
title: 'সফলভাবে ইমেইল যাচাই করা হয়েছে',
764769
},
765770
},
771+
enterpriseConnections: {
772+
subtitle: undefined,
773+
title: undefined,
774+
},
766775
legalConsent: {
767776
checkbox: {
768777
label__onlyPrivacyPolicy: 'আমি {{ privacyPolicyLink || link("গোপনীয়তা নীতি") }}-এর সাথে সম্মত',

packages/localizations/src/ca-ES.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,6 @@ export const caES: LocalizationResource = {
122122
monthly: undefined,
123123
pastDue: undefined,
124124
pay: undefined,
125-
paymentMethods__label: undefined,
126125
paymentMethod: {
127126
applePayDescription: {
128127
annual: undefined,
@@ -137,6 +136,7 @@ export const caES: LocalizationResource = {
137136
testCardInfo: undefined,
138137
},
139138
},
139+
paymentMethods__label: undefined,
140140
popular: undefined,
141141
pricingTable: {
142142
billingCycle: undefined,
@@ -220,6 +220,7 @@ export const caES: LocalizationResource = {
220220
formFieldInputPlaceholder__password: 'Contrasenya',
221221
formFieldInputPlaceholder__phoneNumber: 'Número de telèfon',
222222
formFieldInputPlaceholder__username: "Nom d'usuari",
223+
formFieldInput__emailAddress_format: undefined,
223224
formFieldLabel__apiKeyDescription: undefined,
224225
formFieldLabel__apiKeyExpiration: undefined,
225226
formFieldLabel__apiKeyName: undefined,
@@ -639,6 +640,10 @@ export const caES: LocalizationResource = {
639640
titleNewTab: "S'ha iniciat sessió en una altra pestanya",
640641
},
641642
},
643+
enterpriseConnections: {
644+
subtitle: undefined,
645+
title: undefined,
646+
},
642647
forgotPassword: {
643648
formTitle: 'Codi de restabliment de contrasenya',
644649
resendButton: 'No has rebut el codi? Reenvia',
@@ -760,6 +765,10 @@ export const caES: LocalizationResource = {
760765
title: 'Correu electrònic verificat amb èxit',
761766
},
762767
},
768+
enterpriseConnections: {
769+
subtitle: undefined,
770+
title: undefined,
771+
},
763772
legalConsent: {
764773
checkbox: {
765774
label__onlyPrivacyPolicy: undefined,

packages/localizations/src/cs-CZ.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,6 @@ export const csCZ: LocalizationResource = {
125125
monthly: 'Měsíčně',
126126
pastDue: 'Po splatnosti',
127127
pay: 'Zaplatit {{amount}}',
128-
paymentMethods__label: 'Platební metody',
129128
paymentMethod: {
130129
applePayDescription: {
131130
annual: 'Roční platba',
@@ -140,6 +139,7 @@ export const csCZ: LocalizationResource = {
140139
testCardInfo: 'Informace o testovací kartě',
141140
},
142141
},
142+
paymentMethods__label: 'Platební metody',
143143
popular: 'Populární',
144144
pricingTable: {
145145
billingCycle: 'Fakturační cyklus',
@@ -224,6 +224,7 @@ export const csCZ: LocalizationResource = {
224224
formFieldInputPlaceholder__password: 'Zadejte své heslo',
225225
formFieldInputPlaceholder__phoneNumber: 'Zadejte své telefonní číslo',
226226
formFieldInputPlaceholder__username: 'Zadejte své uživatelské jméno',
227+
formFieldInput__emailAddress_format: undefined,
227228
formFieldLabel__apiKeyDescription: 'Popis',
228229
formFieldLabel__apiKeyExpiration: 'Platnost',
229230
formFieldLabel__apiKeyName: 'Název tajného klíče',
@@ -646,6 +647,10 @@ export const csCZ: LocalizationResource = {
646647
titleNewTab: 'Přihlášeno na jiné kartě',
647648
},
648649
},
650+
enterpriseConnections: {
651+
subtitle: undefined,
652+
title: undefined,
653+
},
649654
forgotPassword: {
650655
formTitle: 'Kód pro resetování hesla',
651656
resendButton: 'Neobdrželi jste kód? Znovu poslat',
@@ -768,6 +773,10 @@ export const csCZ: LocalizationResource = {
768773
title: 'E-mail úspěšně ověřen',
769774
},
770775
},
776+
enterpriseConnections: {
777+
subtitle: undefined,
778+
title: undefined,
779+
},
771780
legalConsent: {
772781
checkbox: {
773782
label__onlyPrivacyPolicy: 'Souhlasím s {{ privacyPolicyLink || link("Zásadami ochrany osobních údajů") }}',

packages/localizations/src/da-DK.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,6 @@ export const daDK: LocalizationResource = {
121121
monthly: undefined,
122122
pastDue: undefined,
123123
pay: undefined,
124-
paymentMethods__label: undefined,
125124
paymentMethod: {
126125
applePayDescription: {
127126
annual: undefined,
@@ -136,6 +135,7 @@ export const daDK: LocalizationResource = {
136135
testCardInfo: undefined,
137136
},
138137
},
138+
paymentMethods__label: undefined,
139139
popular: undefined,
140140
pricingTable: {
141141
billingCycle: undefined,
@@ -220,6 +220,7 @@ export const daDK: LocalizationResource = {
220220
formFieldInputPlaceholder__password: 'Indtast adgangskode',
221221
formFieldInputPlaceholder__phoneNumber: 'Indtast telefonnummer',
222222
formFieldInputPlaceholder__username: 'Indtast brugernavn',
223+
formFieldInput__emailAddress_format: undefined,
223224
formFieldLabel__apiKeyDescription: undefined,
224225
formFieldLabel__apiKeyExpiration: undefined,
225226
formFieldLabel__apiKeyName: undefined,
@@ -638,6 +639,10 @@ export const daDK: LocalizationResource = {
638639
titleNewTab: 'Logget ind på anden fane',
639640
},
640641
},
642+
enterpriseConnections: {
643+
subtitle: undefined,
644+
title: undefined,
645+
},
641646
forgotPassword: {
642647
formTitle: 'Nulstil adgangskode',
643648
resendButton: 'Modtog du ikke en kode? Send igen',
@@ -758,6 +763,10 @@ export const daDK: LocalizationResource = {
758763
title: 'E-mail er bekræftet',
759764
},
760765
},
766+
enterpriseConnections: {
767+
subtitle: undefined,
768+
title: undefined,
769+
},
761770
legalConsent: {
762771
checkbox: {
763772
label__onlyPrivacyPolicy: undefined,

0 commit comments

Comments
 (0)