ordering-components-external 13.2.11 → 13.2.13

package/example/views/PaymentOptionStripeExample/index.js

@@ -1,47 +1,47 @@
-import React from 'react'
-
-import { PaymentOptionStripeUI } from '../../components/PaymentOptionStripeUI'
-import { PaymentOptionStripe } from '../../../src/components/PaymentOptionStripe'
-import { TestComponent } from '../../components/TestComponent'
-
-export const PaymentOptionStripeExample = () => {
-  const props = {
-    /**
-     * UI Component, this must be containt all graphic elements and use parent props
-     */
-    UIComponent: PaymentOptionStripeUI,
-    /**
-     * Business id to get cards from API
-     */
-    businessId: 41,
-    /**
-     * User id to pass in endpoint to get cards from API,
-     */
-    userId: 1,
-    /**
-     * handler stripe card selected from UI
-     */
-    handlerSelectCard: (e) => { console.log('card selected:', e) },
-    /**
-     * Components types before payment option
-     * Array of type components, the parent props will pass to these components
-     */
-    beforeComponents: [TestComponent],
-    /**
-     * Components types after payment option
-     * Array of type components, the parent props will pass to these components
-     */
-    afterComponents: [TestComponent],
-    /**
-     * Elements before payment option
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    beforeElements: [<p>Test Element Before</p>],
-    /**
-     * Elements after payment option
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    afterElements: [<p>Test Element After</p>]
-  }
-  return <PaymentOptionStripe {...props} />
-}
+import React from 'react'
+
+import { PaymentOptionStripeUI } from '../../components/PaymentOptionStripeUI'
+import { PaymentOptionStripe } from '../../../src/components/PaymentOptionStripe'
+import { TestComponent } from '../../components/TestComponent'
+
+export const PaymentOptionStripeExample = () => {
+  const props = {
+    /**
+     * UI Component, this must be containt all graphic elements and use parent props
+     */
+    UIComponent: PaymentOptionStripeUI,
+    /**
+     * Business id to get cards from API
+     */
+    businessId: 41,
+    /**
+     * User id to pass in endpoint to get cards from API,
+     */
+    userId: 1,
+    /**
+     * handler stripe card selected from UI
+     */
+    handlerSelectCard: (e) => { console.log('card selected:', e) },
+    /**
+     * Components types before payment option
+     * Array of type components, the parent props will pass to these components
+     */
+    beforeComponents: [TestComponent],
+    /**
+     * Components types after payment option
+     * Array of type components, the parent props will pass to these components
+     */
+    afterComponents: [TestComponent],
+    /**
+     * Elements before payment option
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    beforeElements: [<p>Test Element Before</p>],
+    /**
+     * Elements after payment option
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    afterElements: [<p>Test Element After</p>]
+  }
+  return <PaymentOptionStripe {...props} />
+}

package/example/views/PaymentOptionStripeRedirectExample/index.js

@@ -1,56 +1,56 @@
-import React from 'react'
-
-import { PaymentOptionStripeRedirectUI } from '../../components/PaymentOptionStripeRedirectUI'
-import { PaymentOptionStripeRedirect } from '../../../src/components/PaymentOptionStripeRedirect'
-import { TestComponent } from '../../components/TestComponent'
-
-export const PaymentOptionStripeRedirectExample = () => {
-  const props = {
-    /**
-     * UI Component, this must be containt all graphic elements and use parent props
-     */
-    UIComponent: PaymentOptionStripeRedirectUI,
-    /**
-     * Business id
-     */
-    businessId: 41,
-    /**
-     * currency to use stripe methods
-     */
-    currency: 'eur',
-    /**
-     * paymentMethods, array that must be contains a list of payment methods
-     */
-    paymentMethods: [
-      { name: 'Bancontact', value: 'bancontact' },
-      { name: 'Alipay', value: 'alipay' },
-      { name: 'Giropay', value: 'giropay' },
-      { name: 'iDEAL', value: 'ideal' }
-    ],
-    /**
-     * Method to get stripe source from a stripe redirect form
-     */
-    handlerStripeSource: (e) => { console.log('Stripe source: ', e) },
-    /**
-     * Components types before payment option stripe redirect
-     * Array of type components, the parent props will pass to these components
-     */
-    beforeComponents: [TestComponent],
-    /**
-     * Components types after payment option stripe redirect
-     * Array of type components, the parent props will pass to these components
-     */
-    afterComponents: [TestComponent],
-    /**
-     * Elements before payment option stripe redirect
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    beforeElements: [<p>Test Element Before</p>],
-    /**
-     * Elements after payment option stripe redirect
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    afterElements: [<p>Test Element After</p>]
-  }
-  return <PaymentOptionStripeRedirect {...props} />
-}
+import React from 'react'
+
+import { PaymentOptionStripeRedirectUI } from '../../components/PaymentOptionStripeRedirectUI'
+import { PaymentOptionStripeRedirect } from '../../../src/components/PaymentOptionStripeRedirect'
+import { TestComponent } from '../../components/TestComponent'
+
+export const PaymentOptionStripeRedirectExample = () => {
+  const props = {
+    /**
+     * UI Component, this must be containt all graphic elements and use parent props
+     */
+    UIComponent: PaymentOptionStripeRedirectUI,
+    /**
+     * Business id
+     */
+    businessId: 41,
+    /**
+     * currency to use stripe methods
+     */
+    currency: 'eur',
+    /**
+     * paymentMethods, array that must be contains a list of payment methods
+     */
+    paymentMethods: [
+      { name: 'Bancontact', value: 'bancontact' },
+      { name: 'Alipay', value: 'alipay' },
+      { name: 'Giropay', value: 'giropay' },
+      { name: 'iDEAL', value: 'ideal' }
+    ],
+    /**
+     * Method to get stripe source from a stripe redirect form
+     */
+    handlerStripeSource: (e) => { console.log('Stripe source: ', e) },
+    /**
+     * Components types before payment option stripe redirect
+     * Array of type components, the parent props will pass to these components
+     */
+    beforeComponents: [TestComponent],
+    /**
+     * Components types after payment option stripe redirect
+     * Array of type components, the parent props will pass to these components
+     */
+    afterComponents: [TestComponent],
+    /**
+     * Elements before payment option stripe redirect
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    beforeElements: [<p>Test Element Before</p>],
+    /**
+     * Elements after payment option stripe redirect
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    afterElements: [<p>Test Element After</p>]
+  }
+  return <PaymentOptionStripeRedirect {...props} />
+}

package/example/views/PaymentOptionsExample/index.js

@@ -1,47 +1,47 @@
-import React from 'react'
-
-import { PaymentOptionsUI } from '../../components/PaymentOptionsUI'
-import { PaymentOptions } from '../../../src/components/PaymentOptions'
-import { TestComponent } from '../../components/TestComponent'
-
-export const PaymentOptionsExample = () => {
-  const props = {
-    /**
-     * UI Component, this must be containt all graphic elements and use parent props
-     */
-    UIComponent: PaymentOptionsUI,
-    /**
-     * Options, this must be containt an array of payment options
-     */
-    options: null,
-    /**
-     * businessId, this must be contains business id to fetch business from API
-     */
-    businessId: 41,
-    /**
-     * Get option selected
-     */
-    onChangePayment: (e) => { console.log('onChangePayment', e) },
-    /**
-     * Components types before Payment options
-     * Array of type components, the parent props will pass to these components
-     */
-    beforeComponents: [TestComponent],
-    /**
-     * Components types after Payment options
-     * Array of type components, the parent props will pass to these components
-     */
-    afterComponents: [TestComponent],
-    /**
-     * Elements before Payment options
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    beforeElements: [<p>Test Element Before</p>],
-    /**
-     * Elements after Payment options
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    afterElements: [<p>Test Element After</p>]
-  }
-  return <PaymentOptions {...props} />
-}
+import React from 'react'
+
+import { PaymentOptionsUI } from '../../components/PaymentOptionsUI'
+import { PaymentOptions } from '../../../src/components/PaymentOptions'
+import { TestComponent } from '../../components/TestComponent'
+
+export const PaymentOptionsExample = () => {
+  const props = {
+    /**
+     * UI Component, this must be containt all graphic elements and use parent props
+     */
+    UIComponent: PaymentOptionsUI,
+    /**
+     * Options, this must be containt an array of payment options
+     */
+    options: null,
+    /**
+     * businessId, this must be contains business id to fetch business from API
+     */
+    businessId: 41,
+    /**
+     * Get option selected
+     */
+    onChangePayment: (e) => { console.log('onChangePayment', e) },
+    /**
+     * Components types before Payment options
+     * Array of type components, the parent props will pass to these components
+     */
+    beforeComponents: [TestComponent],
+    /**
+     * Components types after Payment options
+     * Array of type components, the parent props will pass to these components
+     */
+    afterComponents: [TestComponent],
+    /**
+     * Elements before Payment options
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    beforeElements: [<p>Test Element Before</p>],
+    /**
+     * Elements after Payment options
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    afterElements: [<p>Test Element After</p>]
+  }
+  return <PaymentOptions {...props} />
+}

package/example/views/PhoneAutocompleteExample/index.js

@@ -1,34 +1,34 @@
-import React from 'react'
-
-import { PhoneAutocompleteUI } from '../../components/PhoneAutocompleteUI'
-import { PhoneAutocomplete } from '../../../src/components/PhoneAutocomplete'
-import { TestComponent } from '../../components/TestComponent'
-
-export const PhoneAutocompleteExample = () => {
-  const props = {
-    /**
-     * UI Component, this must be containt all graphic elements and use parent props
-     */
-    UIComponent: PhoneAutocompleteUI,
-    /**
-     * Array of phones for autocomplete
-     */
-    beforeComponents: [TestComponent],
-    /**
-     * Components types after Payment options
-     * Array of type components, the parent props will pass to these components
-     */
-    afterComponents: [TestComponent],
-    /**
-     * Elements before Payment options
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    beforeElements: [<p>Test Element Before</p>],
-    /**
-     * Elements after Payment options
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    afterElements: [<p>Test Element After</p>]
-  }
-  return <PhoneAutocomplete {...props} />
-}
+import React from 'react'
+
+import { PhoneAutocompleteUI } from '../../components/PhoneAutocompleteUI'
+import { PhoneAutocomplete } from '../../../src/components/PhoneAutocomplete'
+import { TestComponent } from '../../components/TestComponent'
+
+export const PhoneAutocompleteExample = () => {
+  const props = {
+    /**
+     * UI Component, this must be containt all graphic elements and use parent props
+     */
+    UIComponent: PhoneAutocompleteUI,
+    /**
+     * Array of phones for autocomplete
+     */
+    beforeComponents: [TestComponent],
+    /**
+     * Components types after Payment options
+     * Array of type components, the parent props will pass to these components
+     */
+    afterComponents: [TestComponent],
+    /**
+     * Elements before Payment options
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    beforeElements: [<p>Test Element Before</p>],
+    /**
+     * Elements after Payment options
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    afterElements: [<p>Test Element After</p>]
+  }
+  return <PhoneAutocomplete {...props} />
+}

package/example/views/PlacesExample/index.js

@@ -1,94 +1,94 @@
-import React, { useState } from 'react'
-import { useOrder } from '../../../src/contexts/OrderContext'
-import { TestComponent } from '../../components/TestComponent'
-// import { useSession } from '../../../src/contexts/SessionContext'
-import { AddressList } from '../../../src/components/AddressList'
-import { AddressListUI } from '../../components/AddressListUI'
-import { AddressForm } from '../../../src/components/AddressForm'
-import { AddressFormUI } from '../../components/AddressFormUI'
-
-export const PlacesExample = () => {
-  const [orderState] = useOrder()
-  // const [{ user, token }] = useSession()
-  const [curAddress, setCurAddress] = useState(null)
-
-  const addressListProps = {
-    /**
-     * UI Component, this must be containt all graphic elements and use parent props
-     */
-    UIComponent: AddressListUI,
-    /**
-     * Behavior when click on address
-     * @param {object} address Address that was clicked
-     */
-    handleClickAddress: (address) => {
-      console.log('Address was clicked', address)
-      setCurAddress(address)
-    },
-    /**
-     * Custom set default address
-     * @param {object} address Address to make to as default
-     */
-    // handleClickSetDefault: (address) => {
-    //   console.log('Address to make to as default', address)
-    // },
-    /**
-     * Change order address with default
-     * Change order address when default address changed, only work if component
-     * is wrapped by OrderContext
-     */
-    changeOrderAddressWithDefault: true,
-    /**
-     * Components types before order type control
-     * Array of type components, the parent props will pass to these components
-     */
-    beforeComponents: [TestComponent],
-    /**
-     * Components types after order type control
-     * Array of type components, the parent props will pass to these components
-     */
-    afterComponents: [TestComponent],
-    /**
-     * Elements before order type control
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    beforeElements: [<p>Test Element Before</p>],
-    /**
-     * Elements after order type control
-     * Array of HTML/Components elements, these components will not get the parent props
-     */
-    afterElements: [<p>Test Element After</p>]
-  }
-
-  const addressFormProps = {
-    /**
-     * UI Component, this must be containt all graphic elements and use parent props
-     */
-    UIComponent: AddressFormUI,
-    /**
-     * Enable to get checkout fields to show/hide fields from Ordering API
-     */
-    useValidationFileds: true//,
-    /**
-     * Address object to edit
-     */
-    // address: { id: 3 },
-    /**
-     * User id of the address to load from Ordering API
-     * Omit if you use a SessionProvier context and the address is of the logged user
-     */
-    // userId: PropTypes.number,
-    /**
-     * Address id to edit and load from Ordering API
-     */
-    // addressId: 3,
-  }
-
-  return (
-    <>
-      <p>Current order address: {orderState?.options?.address?.address} ({orderState?.options?.address?.location?.lat}, {orderState?.options?.address?.location?.lng})</p>
-      <AddressForm {...addressFormProps} address={curAddress} />
-      <AddressList {...addressListProps} />
-    </>
-  )
-}
+import React, { useState } from 'react'
+import { useOrder } from '../../../src/contexts/OrderContext'
+import { TestComponent } from '../../components/TestComponent'
+// import { useSession } from '../../../src/contexts/SessionContext'
+import { AddressList } from '../../../src/components/AddressList'
+import { AddressListUI } from '../../components/AddressListUI'
+import { AddressForm } from '../../../src/components/AddressForm'
+import { AddressFormUI } from '../../components/AddressFormUI'
+
+export const PlacesExample = () => {
+  const [orderState] = useOrder()
+  // const [{ user, token }] = useSession()
+  const [curAddress, setCurAddress] = useState(null)
+
+  const addressListProps = {
+    /**
+     * UI Component, this must be containt all graphic elements and use parent props
+     */
+    UIComponent: AddressListUI,
+    /**
+     * Behavior when click on address
+     * @param {object} address Address that was clicked
+     */
+    handleClickAddress: (address) => {
+      console.log('Address was clicked', address)
+      setCurAddress(address)
+    },
+    /**
+     * Custom set default address
+     * @param {object} address Address to make to as default
+     */
+    // handleClickSetDefault: (address) => {
+    //   console.log('Address to make to as default', address)
+    // },
+    /**
+     * Change order address with default
+     * Change order address when default address changed, only work if component
+     * is wrapped by OrderContext
+     */
+    changeOrderAddressWithDefault: true,
+    /**
+     * Components types before order type control
+     * Array of type components, the parent props will pass to these components
+     */
+    beforeComponents: [TestComponent],
+    /**
+     * Components types after order type control
+     * Array of type components, the parent props will pass to these components
+     */
+    afterComponents: [TestComponent],
+    /**
+     * Elements before order type control
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    beforeElements: [<p>Test Element Before</p>],
+    /**
+     * Elements after order type control
+     * Array of HTML/Components elements, these components will not get the parent props
+     */
+    afterElements: [<p>Test Element After</p>]
+  }
+
+  const addressFormProps = {
+    /**
+     * UI Component, this must be containt all graphic elements and use parent props
+     */
+    UIComponent: AddressFormUI,
+    /**
+     * Enable to get checkout fields to show/hide fields from Ordering API
+     */
+    useValidationFileds: true//,
+    /**
+     * Address object to edit
+     */
+    // address: { id: 3 },
+    /**
+     * User id of the address to load from Ordering API
+     * Omit if you use a SessionProvier context and the address is of the logged user
+     */
+    // userId: PropTypes.number,
+    /**
+     * Address id to edit and load from Ordering API
+     */
+    // addressId: 3,
+  }
+
+  return (
+    <>
+      <p>Current order address: {orderState?.options?.address?.address} ({orderState?.options?.address?.location?.lat}, {orderState?.options?.address?.location?.lng})</p>
+      <AddressForm {...addressFormProps} address={curAddress} />
+      <AddressList {...addressListProps} />
+    </>
+  )
+}