> ## Documentation Index
> Fetch the complete documentation index at: https://docs.overflow.co/llms.txt
> Use this file to discover all available pages before exploring further.

# Shipping address

> Collect an order shipping destination.

The `shippingAddress` element mirrors [`billingAddress`](/payment-elements/elements/address/billing-address): the same six atoms, the same optional `fullName` and `companyName` slots, and the same autocomplete option surface. Use it standalone alongside an order form, or configure it as a section inside [Checkout](/payment-elements/elements/checkout/sections/shipping-address).

## Factory

```typescript theme={null}
overflow.shippingAddress(options?: ShippingAddressElementOptions): ShippingAddressElement
```

## Example

```javascript theme={null}
const shipping = overflow.shippingAddress({
  fields: {
    fullName: {},
    country: { supportedCountries: ['US', 'CA'] },
  },
});

shipping.on('onChange', ({ complete, value }) => {
  payButton.disabled = !complete;
});

shipping.mount('#shipping');
```

## Optional slots

* `fields.fullName`: opts in a full-name field above the address atoms.
* `fields.companyName`: opts in a company-name field for shipping to a business (for example, "ship to ACME's office"). This is distinct from the contact-block company name, which captures the shopper's employer for the contact record.

## Submitted value

```typescript theme={null}
type ShippingAddressValue = {
  line1: string;
  line2?: string;
  city: string;
  state: string;
  postalCode: string;
  country: string;
  fullName?: { firstName: string; lastName: string } | null;
  companyName?: string;
};
```

## Inside Checkout

```javascript theme={null}
overflow.checkout({
  paymentMethods: ['card'],
  shippingAddress: {
    fields: { country: { supportedCountries: ['US', 'CA'] } },
  },
});
```

When both `shippingAddress` and `billingAddress` are configured, Checkout renders a "Same as shipping" toggle on the billing section (default checked). See [Shipping address section](/payment-elements/elements/checkout/sections/shipping-address).

## See also

* [Billing address](/payment-elements/elements/address/billing-address)
* [Address autocomplete](/payment-elements/elements/address/autocomplete)
* [Address reference](/payment-elements/elements/address/reference)
