yew_bootstrap/component/form/form_autocomplete.rs
1use yew::prelude::*;
2
3/// HTML attribute: autocomplete
4/// https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
5///
6#[derive(Clone, PartialEq)]
7pub enum AutocompleteNameType {
8 /// The field expects the value to be a person's full name.
9 FullName,
10 /// The prefix or title, such as "Mrs.", "Mr.", "Miss", "Ms.", "Dr.", or "Mlle.".
11 HonorificPrefix,
12 /// The given (or "first") name.
13 GivenName,
14 /// The middle name.
15 AdditionalName,
16 /// The family (or "last") name.
17 FamilyName,
18 /// The suffix, such as "Jr.", "B.Sc.", "PhD.", "MBASW", or "IV".
19 HonorificSuffix,
20 /// A nickname or handle.
21 Nickname,
22}
23
24/// The street address to send the product.
25/// This can be combined with other tokens,
26/// such as "shipping street-address" and "shipping address-level2"
27/// or "billing street-address" and "billing address-level2".
28#[derive(Clone, PartialEq)]
29pub enum AutocompleteAddressType {
30 StreetAddress,
31 AddressLevel2,
32}
33
34
35#[derive(Clone, PartialEq)]
36pub enum AutocompletePasswordType {
37 /// A new password. When creating a new account or changing passwords,
38 /// this should be used for an "Enter your new password" or "Confirm new password" field,
39 /// as opposed to a general "Enter your current password" field that might be present.
40 NewPassword,
41 /// The user's current password.
42 CurrentPassword,
43}
44
45#[derive(Clone, PartialEq)]
46pub enum AutocompleteTelType {
47 /// A full telephone number, including the country code.
48 Tel,
49 /// The country code, such as "1" for the United States, Canada, and
50 /// other areas in North America and parts of the Caribbean.
51 TelCountryCode,
52 /// The entire phone number without the country code component,
53 /// including a country-internal prefix. For the phone number "1-855-555-6502",
54 /// this field's value would be "855-555-6502".
55 TelNational,
56 /// The area code, with any country-internal prefix applied if appropriate.
57 TelAreaCode,
58 /// The phone number without the country or area code. This can be split further into two parts,
59 /// for phone numbers which have an exchange number and then a number within the exchange.
60 /// For the phone number "555-6502", use "tel-local-prefix" for "555" and "tel-local-suffix" for "6502".
61 TelLocal,
62 TelLocalPrefix,
63 TelLocalSuffix,
64 /// A telephone extension code within the phone number,
65 /// such as a room or suite number in a hotel or an office extension in a company.
66 TelExtension,
67}
68
69/// # Type of form autocomplete, to be used with [crate::component::form::FormControl].
70#[derive(Clone, PartialEq)]
71
72pub enum FormAutocompleteType {
73 /// The browser is not permitted to automatically enter or select a value for this field.
74 /// It is possible that the document or application provides its own autocomplete feature,
75 /// or that security concerns require that the field's value not be automatically entered.
76 Off,
77 /// The browser is allowed to automatically complete the input.
78 /// No guidance is provided as to the type of data expected in the field, so the browser may use its own judgement.
79 On,
80
81 Name { value: AutocompleteNameType },
82 /// An email address.
83 Email,
84 /// A username or account name.
85 Username,
86
87 Password { value: AutocompletePasswordType },
88 ///A one-time password (OTP) for verifying user identity that is used as an additional factor in a sign-in flow.
89 /// Most commonly this is a code received via some out-of-channel mechanism, such as SMS, email, or authenticator application.
90 OTP,
91 /// A job title, or the title a person has within an organization, such as
92 /// "Senior Technical Writer", "President", or "Assistant Troop Leader".
93 OrganizationTitle,
94 /// A company or organization name, such as "Acme Widget Company" or "Girl Scouts of America".
95 Organization,
96 /// A street address. This can be multiple lines of text, and should fully identify the location of the address
97 /// within its second administrative level (typically a city or town), but should not include the city name,
98 /// ZIP or postal code, or country name.
99 StreetAddress,
100
101 ShippingAddress { value: AutocompleteAddressType },
102 BillingAddress { value: AutocompleteAddressType },
103 /// Each individual line of the street address. These should only be present if the "street-address" is not present.
104 AddressLine1,
105 AddressLine2,
106 AddressLine3,
107 /// The finest-grained administrative level, in addresses which have four levels.
108 AddressLevel4,
109 /// The third administrative level, in addresses with at least three administrative levels.
110 AddressLevel3,
111 /// The second administrative level, in addresses with at least two of them. In countries with two administrative levels,
112 /// this would typically be the city, town, village, or other locality in which the address is located.
113 AddressLevel2,
114 /// The first administrative level in the address. This is typically the province in which the address is located.
115 /// In the United States, this would be the state. In Switzerland, the canton. In the United Kingdom, the post town.
116 AddressLevel1,
117 /// A country or territory code.
118 Country,
119 /// A country or territory name.
120 CountryName,
121 /// A postal code (in the United States, this is the ZIP code).
122 PostalCode,
123 /// The full name as printed on or associated with a payment instrument such as a credit card.
124 /// Using a full name field is preferred, typically, over breaking the name into pieces.
125 CcName,
126 /// A given (first) name as given on a payment instrument like a credit card.
127 CcGivenName,
128 /// A middle name as given on a payment instrument or credit card.
129 CcAdditionalName,
130 /// A family name, as given on a credit card.
131 CcFamilyName,
132 /// A credit card number or other number identifying a payment method, such as an account number.
133 CcNumber,
134 /// A payment method expiration date, typically in the form "MM/YY" or "MM/YYYY".
135 CcExp,
136 /// The month in which the payment method expires.
137 CcExpMonth,
138 /// The year in which the payment method expires.
139 CcExpYear,
140 /// The security code for the payment instrument; on credit cards,
141 /// this is the 3-digit verification number on the back of the card.
142 CcCsc,
143 /// The type of payment instrument (such as "Visa" or "Master Card").
144 CcType,
145 /// The currency in which the transaction is to take place.
146 TransactionCurrency,
147 /// The amount, given in the currency specified by "transaction-currency", of the transaction, for a payment form.
148 TransactionAmount,
149 /// A preferred language, given as a valid BCP 47 language tag
150 Language,
151 /// A birth date, as a full date.
152 Bday,
153 /// The day of the month of a birth date.
154 BdayDay,
155 /// The month of the year of a birth date.
156 BdayMonth,
157 /// The year of a birth date.
158 BdayYear,
159 /// A gender identity (such as "Female", "Fa'afafine", "Hijra", "Male", "Nonbinary"), as freeform text without newlines.
160 Sex,
161 Tel { value: AutocompleteTelType },
162 /// A URL for an instant messaging protocol endpoint, such as "xmpp:username@example.net".
163 Impp,
164 /// A URL, such as a home page or company website address as appropriate given the context of the other fields in the form.
165 Url,
166 /// The URL of an image representing the person, company, or contact information given in the other fields in the form.
167 Photo,
168 /// Passkeys generated by the Web Authentication API, as requested by a conditional navigator.credentials.get() call (i.e., one that includes mediation: 'conditional').
169 Webauthn,
170}
171
172impl FormAutocompleteType {
173 /// Convert enum to HTML type string
174 pub fn to_str(&self) -> AttrValue {
175 let value = match &self {
176 Self::Off => "off",
177 Self::On => "on",
178 Self::Name { value } => {
179 match value {
180 AutocompleteNameType::FullName => "name",
181 AutocompleteNameType::HonorificPrefix => "honorific-prefix",
182 AutocompleteNameType::GivenName => "given-name",
183 AutocompleteNameType::AdditionalName => "additional-name",
184 AutocompleteNameType::FamilyName => "family-name",
185 AutocompleteNameType::HonorificSuffix => "honorific-suffix",
186 AutocompleteNameType::Nickname => "nickname"
187 }
188 }
189 Self::Email => "email",
190 Self::Username => "username",
191 Self::Password { value } => {
192 match value {
193 AutocompletePasswordType::NewPassword => "new-password",
194 AutocompletePasswordType::CurrentPassword => "current-password"
195 }
196 },
197 Self::OTP => "one-time-code",
198 Self::OrganizationTitle => "organization-title",
199 Self::Organization => "organization",
200
201 Self::StreetAddress => "street-address",
202 Self::ShippingAddress { value } => {
203 match value {
204 AutocompleteAddressType::StreetAddress => "shipping street-address",
205 AutocompleteAddressType::AddressLevel2 => "shipping address-level2"
206 }
207 }
208 Self::BillingAddress { value } => {
209 match value {
210 AutocompleteAddressType::StreetAddress => "billing street-address",
211 AutocompleteAddressType::AddressLevel2 => "billing address-level2"
212 }
213 }
214 Self::AddressLine1 => "address-line1",
215 Self::AddressLine2 => "address-line2",
216 Self::AddressLine3 => "address-line3",
217 Self::AddressLevel4 => "address-level4",
218 Self::AddressLevel3 => "address-level3",
219 Self::AddressLevel2 => "address-level2",
220 Self::AddressLevel1 => "address-level1",
221 Self::Country => "country",
222 Self::CountryName => "country-name",
223 Self::PostalCode => "postal-code",
224 Self::CcName => "cc-name",
225 Self::CcGivenName => "cc-given-name",
226 Self::CcAdditionalName => "cc-additional-name",
227 Self::CcFamilyName => "cc-family-name",
228 Self::CcNumber => "cc-number",
229 Self::CcExp => "cc-exp",
230 Self::CcExpMonth => "cc-exp-month",
231 Self::CcExpYear => "cc-exp-year",
232 Self::CcCsc => "cc-csc",
233 Self::CcType => "cc-type",
234 Self::TransactionCurrency => "transaction-currency",
235 Self::TransactionAmount => "transaction-amount",
236 Self::Language => "language",
237 Self::Bday => "bday",
238 Self::BdayDay => "bday-day",
239 Self::BdayMonth => "bday-month",
240 Self::BdayYear => "bday-year",
241 Self::Sex => "sex",
242 Self::Tel { value } => {
243 match value {
244 AutocompleteTelType::Tel => "tel",
245 AutocompleteTelType::TelCountryCode => "tel-country-code",
246 AutocompleteTelType::TelNational => "tel-national",
247 AutocompleteTelType::TelAreaCode => "tel-area-code",
248 AutocompleteTelType::TelLocal => "tel-local",
249 AutocompleteTelType::TelLocalPrefix => "tel-local-prefix",
250 AutocompleteTelType::TelLocalSuffix => "tel-local-suffix",
251 AutocompleteTelType::TelExtension => "tel-extension",
252 }
253 }
254 Self::Impp => "impp",
255 Self::Url => "url",
256 Self::Photo => "photo",
257 Self::Webauthn => "webauthn",
258
259 };
260
261 AttrValue::from(value)
262 }
263}
264