Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 12 additions & 59 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,69 +1,22 @@
<div align="center">
<img align="center" width="230" src="https://i.imgur.com/pGGFGpi.png" />
<h2>Javascript Library Boilerplate Basic</h2>
<blockquote>Minimal Library Starter Kit for your Javascript projects</blockquote>

<a href="https://www.npmjs.com/package/@hodgef/js-library-boilerplate-basic"><img src="https://badgen.net/npm/v/@hodgef/js-library-boilerplate-basic?color=blue" alt="npm version"></a> <a href="https://github.com/hodgef/js-library-boilerplate-basic"><img src="https://img.shields.io/github/last-commit/hodgef/js-library-boilerplate-basic" alt="lastest commit"></a> <a href="https://github.com/hodgef/js-library-boilerplate-basic/actions"><img alt="Build Status" src="https://github.com/hodgef/js-library-boilerplate-basic/workflows/Build/badge.svg?color=green" /></a> <a href="https://github.com/hodgef/js-library-boilerplate-basic/actions"> <img alt="Publish Status" src="https://github.com/hodgef/js-library-boilerplate-basic/workflows/Publish/badge.svg?color=green" /></a>

<strong>If you like TypeScript, check out [ts-library-boilerplate-basic](https://github.com/hodgef/ts-library-boilerplate-basic).</strong><br />
<strong>Want a more robust (yet bulkier) alternative? Check out [js-library-boilerplate](https://github.com/hodgef/js-library-boilerplate).</strong><br />
</div>
# Gleap JavaScript Admin Helper

## ⭐️ Features
A DOM element picker used by Gleap admin tools. It lets a user select a page element and returns a unique CSS selector through `onElementPicked`.

- Webpack 5
- Babel 7
- Hot reloading (`npm start`)
- UMD exports, so your library works everywhere.
- Jest unit testing
- Customizable file headers for your build [(Example 1)](https://github.com/hodgef/js-library-boilerplate-basic/blob/master/build/index.js) [(Example2)](https://github.com/hodgef/js-library-boilerplate-basic/blob/master/build/css/index.css)
- Daily [dependabot](https://dependabot.com) dependency updates
The helper switches between `picker` and `navigate` modes. It excludes the Gleap admin overlay from selection.

## 📦 Getting Started
For customer-facing live chat, in-app bug reporting and feedback, use the [Gleap JavaScript SDK](https://github.com/GleapSDK/JavaScript-SDK).

```
git clone https://github.com/hodgef/js-library-boilerplate-basic.git GleapHelper
npm install
```

## 💎 Customization
[Gleap](https://www.gleap.ai) · [JavaScript SDK documentation](https://docs.gleap.ai/documentation/javascript/README)

> Before shipping, make sure to:
## Development

1. Edit `LICENSE` file
2. Edit `package.json` information (These will be used to generate the headers for your built files)
3. Edit `library: "GleapHelper"` with your library's export name in `./webpack.config.js`
The package uses Webpack and Babel. Its source is in `src/lib/index.js`.

## 🚀 Deployment

1. `npm publish`
2. Your users can include your library as usual

### npm

```
import GleapHelper from 'my-library';
const libraryInstance = new GleapHelper();
...
```

### self-host/cdn

```
<script src="build/index.js"></script>

const GleapHelper = window.GleapHelper.default;
const libraryInstance = new GleapHelper();
...
```sh
npm install
npm run build
```

## ✅ Libraries built with this boilerplate

> Made a library using this starter kit? Share it here by [submitting a pull request](https://github.com/hodgef/js-library-boilerplate-basic/pulls)!
## Attribution and license

- [Canvas-Txt](https://github.com/geongeorge/Canvas-Txt) - A library to print multiline text on HTML5 canvas with better line breaks and alignments
- [moon-phase-widget](https://github.com/g00dv1n/moon-phase-widget) - Super tiny javascript library to add awesome moon phase widget to your website
- [simple-keyboard-autocorrect](https://github.com/hodgef/simple-keyboard-autocorrect) - Autocorrect module for simple-keyboard
- [simple-keyboard-input-mask](https://github.com/hodgef/simple-keyboard-input-mask) - Input mask module for simple-keyboard
- [simple-keyboard-key-navigation](https://github.com/hodgef/simple-keyboard-key-navigation) - Key navigation module for simple-keyboard
- [swipe-keyboard](https://github.com/hodgef/swipe-keyboard) - Swype type keyboard module for simple-keyboard
The build setup originated from Francisco Hodge's [JavaScript Library Boilerplate Basic](https://github.com/hodgef/js-library-boilerplate-basic). See [LICENSE](LICENSE) for the retained MIT license and copyright notice.
12 changes: 7 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "gleap-admin-helper",
"version": "1.0.3",
"description": "Helper library for the Gleap JS SDK.",
"description": "JavaScript DOM element picker for Gleap admin tools. Select page elements and return unique CSS selectors for the Gleap SDK.",
"main": "build/index.js",
"scripts": {
"start": "webpack serve --config webpack.config.demo.js",
Expand All @@ -15,16 +15,18 @@
"type": "git",
"url": "https://github.com/GleapSDK/JavaScript-AdminHelper-SDK"
},
"author": "Lukas Böhler <lukas@gleap.io> (https://gleap.io)",
"author": "Lukas Böhler <lukas@gleap.io> (https://www.gleap.ai)",
"license": "MIT",
"bugs": {
"url": "https://github.com/GleapSDK/JavaScript-AdminHelper-SDK/issues"
},
"homepage": "https://github.com/GleapSDK/JavaScript-AdminHelper-SDK",
"keywords": [
"library",
"starter",
"es6"
"gleap",
"javascript",
"dom",
"element-picker",
"css-selector"
],
"devDependencies": {
"@babel/cli": "^7.22.10",
Expand Down
Loading