Shipping Address Element

ShippingAddressElement Use the ShippingAddressElement from @the relevant part of the product to render and update the shipping address on the current Checkout Session. The component must be rendered inside a CheckoutElementsProvider. ### Props - id Sets the DOM id attribute on the rendered Element container. Use this to target the Element for styling or testing. - className Applies custom CSS classes to the Element container. - options Shipping Address Element initialization options. - contacts An array of objects that can be displayed as saved addresses in the Shipping Address Element. The first contact is automatically selected. - name The name of the contact. This might be a person, or a business name. - address The address of the contact. - line1 - line2 - city The name of a city, town, village, etc. - state The most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. - postal_code The postal code or ZIP code, also known as PIN code in India. - country Two-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. - phone The phone number of the contact. - display You can customize how certain fields are displayed. - name By default, the Shipping Address Element displays a full name field. Specify 'split' to display a first name field and a last name field. Specify 'organization' to display an organization field. - autocomplete By default, the Address Element will have autocomplete enabled with Stripe provided Google Maps API key for certain countries if any of the following condition is met: * If Payment Element is mounted in the same elements group as Address Element in a single page application. * If the Address Element is used in an active Link session (Link is also known as Onelink in the UK). [Contact Legal before editing or deleting the Google Maps autocomplete callout]: # By using autocomplete, you agree to comply with the Google Maps Platform Acceptable Use Policy. If you violate this policy, we might disable autocomplete, or take any other action as necessary. You can customize the autocomplete setting with this option. - mode Specify disabled to disable autocomplete in the Address Element. Specify google_maps_api to enable Google Maps API with your own key. It will only be used when Stripe provided Google Maps API key is not available. The default setting is automatic, where we'll support autocomplete when possible. - apiKey Specify your own Google Maps API key with it. Only needs to be passed in when autocomplete.mode is set to google_maps_api. - onChange Callback called when any value in the change event payload changes. - onReady Callback called once the Element is fully rendered. Recieves the ready event payload. - onBlur Callback called when the Element loses focus. - onFocus Callback called when the Element receives focus. - onEscape Callback called when the escape key is pressed within the Element. - onLoaderStart Callback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. - onLoadError Callback called when the Element fails to load. ### Example title Render ShippingAddressElement