@commercelayer/react-components
Version:
The Official Commerce Layer React Components
30 lines (29 loc) • 1.63 kB
TypeScript
import { type JSX } from 'react';
import type { BaseSelectComponentProps } from '../../typings/index';
import { type AddressValuesKeys } from '../../context/BillingAddressFormContext';
type SelectFieldName = `billing_address_${`metadata_${string}`}` | `shipping_address_${`metadata_${string}`}`;
interface Props extends Omit<BaseSelectComponentProps, 'name'>, Pick<JSX.IntrinsicElements['select'], 'className' | 'id' | 'style'> {
name: Extract<AddressValuesKeys, SelectFieldName>;
required?: boolean;
disabled?: boolean;
}
/**
* The AddressInputSelect component creates a form `select` related to the `metadata` attribute of the `address` object.
*
* It requires a `name` prop to define the field name associated with the select and accepts most of HTML `select` tag standard props.
*
* <span title="Name prop" type="info">
* The `name` prop must respect the convention of mentioning one of the available addresses forms (`billing_address` or `shipping_address`) concatenated to the `metadata` address attribute with a `_` separator. Eg.: `billing_address_metadata_your-key`.
* </span>
*
* <span title="Requirement" type="warning">
* It must to be used inside either the `<BillingAddressForm>` or the `<ShippingAddressForm>` component.
* </span>
*
* <span title="Fields" type="info">
* Check the `addresses` resource from our [Core API documentation](https://docs.commercelayer.io/core/v/api-reference/addresses/object)
* for more details about the available attributes to render.
* </span>
*/
export declare function AddressInputSelect(props: Props): JSX.Element;
export default AddressInputSelect;