@acctglobal/shipping-simulator NPM

Shipping Simmulator

Getting Started

This component can be used anywhere you want in e-commerce, in a responsive and agnostic way. You just need to have React on your project.

Installation and usage

To use Image Gallery, you need to install the package via yarn or npm and import it wherever you want to use it.

yarn add @acctglobal/shipping-simmulator
// or npm install

Now you just need to import and use the component.

import ShippingSimulator from '@acctglobal/shipping-simulator';

<ShippingSimulator
  zipValidation={handleZipValidation}
  shippingSimulation={handleShippingSimulation}
  hrefLinks={{
    firstLink: 'https://tools.usps.com/go/ZipLookupAction!input.action',
    secondLink: '/',
  }}
  customTexts={{
    title: 'Delivery',
    buttonLabel: 'Apply',
    dontKnowZip: "I don't know my zip code",
    placeHolder: 'Zip code',
    moreInfo: 'More informations',
    moneyType: '$',
    estimatedTimeMeasure: 'day/s',
    invalidZipCode: 'Invalid zip code. Try again!',
  }}
  items={[
    {
      id,
      quantity: '3',
      seller: '1',
    },
  ]}
/>

Styling

All css selectors

shipping-simulator-container request-container shipping-simmulator-title shipping-form-container form-input form-button dont-know-zip-link shipping-result-table table-row shipping-name shipping-infos shipping-time shipping-price more-info-link invalid-zipcode-alert

Props

Parameter	Type	Description
`hrefLinks`	`HrefLinks`	Optional. Object of URLs for component links.
`customTexts`	`CustomTexts`	Mandatory. Object containing custom texts for each component part.
`item`	`Array`	Mandatory. Array contain object with 3 elements { id: string, quantity: string, seller: string}.
`zipValidation`	`(zipcode: string) => boolean or Promise<boolean>`	Mandatory. Function that will validade zipcode. Need to receive `zipcode` as `string` and return a `boolean`.
`shippingSimulation`	`(zipcode: string) => ShippingMethodsType or Promise<ShippingMethodsType>`	Mandatory. Function that will simulate shipping. Need to receive `zipcode` as `string` and return the `ShippingMethods`.

Types

HrefLinks

Property	Type	Description
`dontKnowZipLink`	`string`	Optional
`moreInfoLink`	`string`	Optional

CustomTexts

Property	Type	Description
`placeHolder`	`string`	Mandatory
`title`	`string`	Mandatory
`buttonLabel`	`string`	Mandatory
`dontKnowZip`	`string`	Mandatory
`moreInfo`	`string`	Mandatory
`moneyType`	`string`	Mandatory
`estimatedTimeMeasure`	`string`	Mandatory
`invalidZipCode`	`string`	Mandatory

ShippingMethodsType

Property	Type	Description
`name`	`string`	Mandatory
`shippingEstimate`	`string`	Mandatory
`price`	`number`	Mandatory

Contributing

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

Fork the Project
Create your Feature Branch (git checkout -b feature/AmazingFeature)
Commit your Changes (git commit -m 'Add some AmazingFeature')
Push to the Branch (git push origin feature/AmazingFeature)
Open a Pull Request
And don't forget to update the changelog

Contact

Jonathan Paoroso - jonathan.paoroso@acct.global Raphael Marinho - raphael.marinho@acct.global

@everything-registry/sub-chunk-24

0.1.1

2 years ago

0.1.0

2 years ago