For recommended vscode setup run yarn setup-vscode or npm run setup-vscode & then install workspace @recommended extensions. Note that src/javascript/apiV4.ts is autogenerated and needs to be manually copied over if relevant API parts change.

With yarn:

yarn add betterplace-react-components

With npm:

npm i betterplace-react-components

import { ProjectTeaser } from 'betterplace-react-components'

<ProjectTeaser project={betterplaceOrgApiV4Response}>

import { FacebookButton } from 'betterplace-react-components'

<FacebookButton shape='round' shareUrl='www.foo.bar' />

etc. - run yarn start to get a preview of all components.

<FacebookButton
  shape='round'
  shareUrl='www.foo.bar'
  utmParams={{ utm_campaign: 'user_share', utm_medium: 'foo', utm_source: 'bar' }}
/>

You can also use the click action handler only in case you want to use custom styled buttons.

import { facebookShareAction } from 'betterplace-react-components'

const MyShareButton = () => {
  const handleClick = () => facebookShareAction({
    shareUrl: 'www.foo.bar',
    utmParams: { utm_campaign: 'user_share', utm_medium: 'foo', utm_source: 'bar' }
  })

  return <span onClick={handleClick}>i luv facebook</span>
}

There is no theming support yet. Some styles can be set via props, e.g.

<ProjectTeaser progressbarColor='#0000ff' />

Install development / testing dependencies:

yarn

Run hot-reloading preview:

yarn start

Run tests:

yarn test

Release a new version:

yarn publish

betterplace-react-components is released under the Apache 2.0 license and Copyright 2018..2022 gut.org gAG.