Package Exports

@peerme/extensions
@peerme/extensions/lib/index.esm.js
@peerme/extensions/lib/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@peerme/extensions) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Peerme Extensions

Extensions (Apps & Widgets) for the DAOs on peerme.io. For a general overview, please visit our Knowledge Base.

Available Extensions

Coindrip: coindrip.finance

Create your App

Please get in touch or create a Github Issue before starting to work on your integration!

Overview

Fork this repository & work on it locally
Make a copy of extensions/_template and adapt it to your needs
Register your extension in the root's config.ts
Start & keep working inside this directory
Create a pull request with your changes to this repository when done

Guidelines

Don't pull in any dependencies that are not absolutely necessary.
Only work inside the working directory of your extension

Installation

To install the repository run:

npm install

Run the Dev-Server

To start working, run the development server which opens a NextJs app with a development environment:

cd dev
npm install # only once
npm run dev

After doing changes to your extension, you may need to run npm run build from the root of the repository while keeping the dev-server running.

Framework

The Extension Framework provides developers with useful components & utilities to quickly develop their integrations.

By default, each App makes use of the useApp hook which exposes useful functions to hook into the main peerme.io application for DAOs:

app.requestProposalAction: assemble a transaction/smart contract call to be attached to a proposal
showToast(message, type): show a toast message to the user

To use these app hook functions in child components, simply pass it to them as a prop with type AppHook.

UI Components you can use from src/ui/elements:

<AppSection />: use to structure your app in sections

UI Components you can use from @peerme/web-ui:

Form components:

<Button />
<Input />
<Textarea />
<Editor />: use to collect formatted text input (HTML)
<Select />
<Dropdown />
<LinkButton />
<Pagination />
<RadioGroup />
<Switch />
<Slider />
<UserSelector />: use select a user (recommended when asking for e.g. blockchain address)
<EntitySelector />: use to select a registered DAO
<PaymentSelector />: use to select assets from the DAO Vault

Feedback:

<Alert />
<Tooltip />

Loaders:

<EllipsisLoader />