cp-react-px-shipping
Version:
React Shipping Form Component for Limelight
84 lines (76 loc) • 2.05 kB
Markdown
# CP React Shipping Package
Please follow the instructions to use this package in React App:
## Import Package/Component
```bash
import ShippingForm from "cp-react-px-shipping/build/ShippingForm"
```
## Use the component
```bash
<ShippingForm />
```
## Submit Button
You can place custom content in button using following snippet:
```bash
<ShippingForm>
<span>Order Now</span>
</ShippingForm>
```
You can add class attribute to button
```bash
<ShippingForm buttonClass="btn mb10">
<span>Order Now</span>
</ShippingForm>
```
## onSubmission
This callback will be triggered, after submission of form<br/>
(its optional if `redirect` prop is set)
```bash
<ShippingForm onSubmission={(status, formData, response) => {
// status is true or false for status of the form
// formData contains field values entered by user
// response contains response from the API
}} />
```
## Configuration props
You can pass some config values in the prop `config`<br/>
These are `required` params
```bash
<ShippingForm config={{
COMPAIGN_ID: 1,
PRODUCT_ID: 1,
SHIPPING_ID: 1
}} />
```
## Re-order form fields and hide/show
You can re-order form fields using `fields` prop and set value to `-1` to hide the field
```bash, for example:
<ShippingForm fields={{
firstName: 0,
lastName: 1,
address1: 2,
city: 3,
state: 4,
country: 5,
zip: 6,
phone: 7,
email: 8
}} />
```
## UK Only or not
you can set option, if this submission is only for UK visitors or not<br/>
(This is `optional` and default value is `true`)
```bash, for example:
<ShippingForm config={{
onlyForUK: false
}} />
```
## Default Country Selection
You can set option for default country selection<br/>
use `0` for `UK` and `1` for `US`<br/>
(This is `optional` and default value is `0`)<br/>
Note: `onlyForUK` param should be `false` in case of other country
```bash, for example:
<ShippingForm config={{
selectedCountry: 1
}} />
```