# Shipping Details

## Overview

This is a fully-responsive module that includes common UI components for adding a shipping address and selecting a delivery method.

## Structure

* When this module is added to a page, it is placed within a group called `Group page860Group` . This group contains the responsive settings for all modules.
* This module `Group shippingDetails` contains three main groups:
  * `Group Header` contains the title text and a hidden description text
  * `Group Collapsible content - shipping` contains five components
    * `Group selected shipping` is used to display the selected shipping address. Clicking on the `CHANGE button` will toggle `Group enter shipping`.
    * `Group enter shipping` includes a form that will allow you to enter a new shipping address. Clicking the `SAVE button` or `CANCEL button` will hide this form group.
    * All shipping methods will be displayed in `RepeatingGroup Dummy`&#x20;
    * `Group Buttons` contains a `BACK` and `NEXT button`
    * `Group PLACEHOLDER`  - If you add more elements to the group, please resize this group and ensure it is not overlapping with any other elements.
  * `Group MAIN PLACEHOLDER` - Please resize this group if you add more elements to the group

## How to set up

* Update all text elements in the module.
* Add workflows to `Button CHANGE`, `Button SAVE`, `Button CANCEL`, `Button NEXT`, and `Button BACK`.
* Update the data source of `RepeatingGroup Dummy` and update the image and text elements to reference current cell's data. Add workflow to `Group Dummy Select`.
