121 lines
3.1 KiB
TypeScript
121 lines
3.1 KiB
TypeScript
/**
|
|
* External dependencies
|
|
*/
|
|
import type { AllHTMLAttributes, AriaAttributes } from 'react';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import { getSetting } from './utils';
|
|
import { SelectOption } from '../../base/components';
|
|
|
|
// A list of attributes that can be added to a custom field when registering it.
|
|
type CustomFieldAttributes = Pick<
|
|
AllHTMLAttributes< HTMLInputElement >,
|
|
| 'maxLength'
|
|
| 'readOnly'
|
|
| 'pattern'
|
|
| 'title'
|
|
| 'autoCapitalize'
|
|
| 'autoComplete'
|
|
> &
|
|
AriaAttributes;
|
|
|
|
export interface FormField {
|
|
// The label for the field.
|
|
label: string;
|
|
// The label for the field if made optional.
|
|
optionalLabel: string;
|
|
// The HTML autocomplete attribute value. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
|
|
autocomplete: string;
|
|
// How this field value is capitalized.
|
|
autocapitalize?: string;
|
|
// Set to true if the field is required.
|
|
required: boolean;
|
|
// Set to true if the field should not be rendered.
|
|
hidden: boolean;
|
|
// Fields will be sorted and render in this order, lowest to highest.
|
|
index: number;
|
|
// The type of input to render. Defaults to text.
|
|
type?: string;
|
|
// The options if this is a select field
|
|
options?: SelectOption[];
|
|
// The placeholder for the field, only applicable for select fields.
|
|
placeholder?: string;
|
|
// Additional attributes added when registering a field. String in key is required for data attributes.
|
|
attributes?: Record< keyof CustomFieldAttributes, string >;
|
|
}
|
|
|
|
export interface LocaleSpecificFormField extends Partial< FormField > {
|
|
priority?: number | undefined;
|
|
}
|
|
|
|
export interface CoreAddressForm {
|
|
first_name: FormField;
|
|
last_name: FormField;
|
|
company: FormField;
|
|
address_1: FormField;
|
|
address_2: FormField;
|
|
country: FormField;
|
|
city: FormField;
|
|
state: FormField;
|
|
postcode: FormField;
|
|
phone: FormField;
|
|
}
|
|
|
|
export interface CoreContactForm {
|
|
email: FormField;
|
|
}
|
|
|
|
export type AddressForm = CoreAddressForm & Record< string, FormField >;
|
|
export type ContactForm = CoreContactForm & Record< string, FormField >;
|
|
export type FormFields = AddressForm & ContactForm;
|
|
export type AddressFormValues = Omit< ShippingAddress, 'email' >;
|
|
export type ContactFormValues = { email: string };
|
|
export type AdditionalInformationFormValues = Record< string, string >;
|
|
export type FormType =
|
|
| 'billing'
|
|
| 'shipping'
|
|
| 'contact'
|
|
| 'additional-information';
|
|
|
|
export interface CoreAddress {
|
|
first_name: string;
|
|
last_name: string;
|
|
company: string;
|
|
address_1: string;
|
|
address_2: string;
|
|
country: string;
|
|
city: string;
|
|
state: string;
|
|
postcode: string;
|
|
phone: string;
|
|
}
|
|
|
|
export type AdditionalValues = Record<
|
|
Exclude< string, keyof CoreAddress >,
|
|
string | boolean
|
|
>;
|
|
|
|
export type ShippingAddress = CoreAddress;
|
|
export interface BillingAddress extends ShippingAddress {
|
|
email: string;
|
|
}
|
|
|
|
export type KeyedFormField = FormField & {
|
|
key: keyof FormFields;
|
|
errorMessage?: string;
|
|
};
|
|
|
|
export type CountryAddressForm = Record< string, FormFields >;
|
|
|
|
export type FormFieldsConfig = Record< keyof FormFields, Partial< FormField > >;
|
|
|
|
/**
|
|
* Default field properties.
|
|
*/
|
|
export const defaultFields: FormFields =
|
|
getSetting< FormFields >( 'defaultFields' );
|
|
|
|
export default defaultFields;
|