🖲 Beacon: DevTools
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
images
public
scripts
src
.babelrc Add babelrc Dec 14, 2018
.gitignore Add eslintcache to gitignore Dec 12, 2018
.npmrc
.prettierignore Add localState for size/position Dec 12, 2018
.prettierrc.yml
LICENSE Preparing for release Dec 12, 2018
README.md
package-lock.json
package.json

README.md

Beacon DevTools

DevTools for Help Scout's Beacon Embed

Beacon DevTools

Table of contents

Installation

npm install --save-dev @helpscout/beacon-devtools

Usage

Development

import React from 'react'
import BeaconDevTools from '@helpscout/beacon-devtools'

class MyApp extends React.Component {
  render() {
    return (
      <div>
        ...
        <BeaconDevTools />
      </div>
    )
  }
}

In Browser

To add Beacon DevTools to your page, copy/paste the following snippet into your HTML:

<script
  crossorigin
  src="https://unpkg.com/@helpscout/beacon-devtools/dist/beacon-devtools.umd.js"
></script>

Alternatively, you can add this snippet:

<script>
  ;(function() {
    var u =
      'https://unpkg.com/@helpscout/beacon-devtools/dist/beacon-devtools.umd.js'
    var s = document.createElement('script')
    s.type = 'text/javascript'
    s.charset = 'utf-8'
    s.src = u
    document.body.appendChild(s)
  })()
</script>

Demo

Check out the demo on Netlify!

Props

<BeaconDevTools />
Prop Type Default Description
isAutoOpen boolean false Automatically opens Beacon on load.
beaconIds Array<Object> [] A collection of Beacon IDs to load into a select.

beaconIds example

const beaconIds = [
  { id: '...', label: 'My Test Beacon 1' },
  { id: '...', label: 'Production Beacon' },
  { id: '...', label: 'Marketing Beacon' },
]

// ...

<BeaconDevTools beaconIds={beaconId} />

Check out Beacon

Beacon is way more than chat.

Say farewell to overwhelming chat volume, staffing nightmares, and frustrated customers abandoned in chat windows. Ready to make your website more helpful?

👉 Check it out