1.3.7 • Published 2 years ago

simi-pagebuilder-react-testing123 v1.3.7

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

simi-pagebuilder-react

SimiCart React PageBuilder Client

NPM JavaScript Style Guide

Install

npm install --save simi-pagebuilder-react

Usage

import React, { Component } from 'react'

import { PageBuilderComponent } from 'simi-pagebuilder-react'

class Example extends Component {
  render() {
    return <PageBuilderComponent endPoint={endPoint} maskedId={maskedId} />
  }
}

Develop

git clone https://github.com/Simicart/simi-pagebuilder-react
cd simi-pagebuilder-react
yarn install && cd example && yarn install && cd ..
yarn start

Then go to example directory, run another yarn start command.

Props

  • endPoint - String
  • maskedId - String
  • toPreview - Boolean
  • ProductList - ReactComponent - which would receive item data as props
  • ProductGrid - ReactComponent - which would receive item data as props
  • ProductScroll - ReactComponent - which would receive item data as props
  • CategoryScroll - ReactComponent - which would receive item data as props
  • Link - ReactComponent - For internal linking
  • history - Object - For history push inside pagebuilder component
  • formatMessage - Function - For Localization Purpose
  • lazyloadPlaceHolder - ReactComponent - Place holder for lazyload Image, if false/ no lazyload applied
  • overRender - Function - Function to override render function for each Item

usePbFinder

usePbFinder is a hook to help you find your page from the pages you created on Pagebuilder dashboard.

// storeCode is optional
const pbFinderProps = usePbFinder({
    endPoint,
    integrationToken,
    storeCode
});
const {
    loading,
    pageMaskedId,
    findPage,
    pathToFind,
    pageData,
    allPages
} = pbFinderProps;

with findPage(pathname) and use pageData and pageMaskedId to find your page with path_name

and findPage() to getData and check `allPages` to get page with your own condition.

License

MIT © SimiCart