open-index/open-npm huggingface dataset:
npm package: @resonate/api-factory-generator
Description: Project first published as @zerowastemap/api-factory-generator. Forked it to allow more specific configuration for resonate.
Author: Augustin Godiscal
Latest version: 2.1.4

# API factory generator

Project first published as @zerowastemap/api-factory-generator. Forked it to allow more specific configuration for resonate.

- Uses fetch
- Uses ajv for schema validation
- Sane defaults
- Sends token if provided
- Each route can have specific options

## Installation

```sh
$ npm i --save @resonate/api-factory-generator
```

## Usage

```javascript

const generator = require('@resonate/api-factory-generator')

// set default options for each requests
const options = {
  mode: 'cors',
  domain: 'resonate.localhost',
  scheme: 'https://',
  prefix: '/api',
  version: 1,
  token: 'some bearer token'
}

// configure your routes
// you can nest routes
const routes = {
  auth: {
    login: {
      path: '/auth/login',
      options: {
        method: 'POST'
      },
      schema: {
        type: 'object',
        required: ['email'],
        properties: {
          email: {
            type: 'string'
          }
        }
      }
    }
  },
  upload: {
    path: '/locate',
    options: {
      method: 'POST',
      auth: true, // will enable credentials
      multipart: true
    }
  }
  locate: {
    path: '/locate',
    schema: {
      type: 'object',
      required: ['longitude', 'latitude'],
      properties: {
        longitude: Longitude,
        latitude: Latitude
      }
    }
  }
}

const api = generator(routes, options) 

// api.auth.login('salut@zerowastemap.app') works too if we have a schema
api.auth.login({ email: 'salut@zerowastemap.app' }).then(response => {
  ...
})

```

## Testing

Browser tests won't pass your machine because it test against api which is not released yet

## See also

[JavaScript Factory Functions vs Constructor Functions vs Classes](https://medium.com/javascript-scene/javascript-factory-functions-vs-constructor-functions-vs-classes-2f22ceddf33e)

## LICENSE

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/button
Description: Render a button element
Author: Augustin Godiscal
Latest version: 2.1.0

# @resonate/button

Render an HTML button element

## Install

```sh
$ npm i --save @resonate/button
```

## Usage

```js

const button = require('@resonate/button')

const myButton = button({
  style: 'blank',
  prefix: 'play-button',
  onClick: () => {
    // do something
  },
  title: playing ? 'Pause' : 'Play',
  iconName: playing ? 'pause' : 'play'
})

document.body.appendChild(myButton)

```

## Options

- `prefix` A single class or classlist
- `onClick` Button onclick event handler
- `value` Button value
- `type` Button type (default is 'button')
- `disabled` Button disabled state (default is false)
- `style` Button style (default, blank)
- `iconName` SVG icon name
- `iconFill` Class names for svg icon fills (see: @resonate/theme-skins)
- `iconSize` SVG icon size (xs, sm, md, lg)
- `text` Button text

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/button-component
Description: Component wrapper for `@resonate/button` element
Author: Augustin Godiscal
Latest version: 1.1.0

# @resonate/button-component

Component wrapper for `@resonate/button` element

## Installation

```sh
$ npm i --save @resonate/button-component
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/choo-plugins
Description: All choo plugins for resonate
Author: Augustin Godiscal
Latest version: 1.1.2

# @resonate/choo-plugins

Library for all choo plugins in resonate frontend projects

- Full screen
- Gestures
- Offline/online detection
- Resize event
- Tabbing
- Theme
- Visibility

## Installation

```sh
$ npm i --save @resonate/choo-plugins
```

## Usage

```javascript

  const { offlineDetect: offlineDetectPlugin } = require('@resonate/choo-plugins')

  const app = choo()

  app.use(offlineDetectPlugin())

```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/counter
Description: Render a play count counter svg elemen
Author: Augustin Godiscal
Latest version: 2.1.3

# Counter

Render a play count element (to be used with @resonate/play-count)

## Installation

```sh
$ npm i --save @resonate/counter
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/dialog-component
Description: Dialog element component
Author: Augustin Godiscal
Latest version: 1.1.5

# @resonate/dialog-component

Dialog element component

# Installation

```sh
npm i --save-dev @resonate/dialog-component
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/envlocalify
Description: Bundle env variables
Author: Augustin Godiscal
Latest version: 1.1.1

# @resonate/envlocalify

Expose process.env variables in bundle

# Installation

```sh
npm i --save-dev @resonate/envlocalify
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/icon-element
Description: Icon element
Author: Augustin Godiscal
Latest version: 1.4.0

# @resonate/icon-element

Render an svg element from an SVG icons set

## Installation

```sh
npm i --save @resonate/icon-element
```

## Usage

```javascript

const html = require('nanohtml')
const icon = require('@resonate/icon-element')

module.exports = () => html`
  <div>
    ${icon('logo', { 'class': 'icon icon--xs fill-black' })} 
  </div>
`

```

## SVG icons set example

```html
...

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:none" width="100" height="100">
  <symbol viewBox="0 0 100 100" id="icon-logo">
    <path d="M100 50c0-12.9-5.5-24.5-14.2-33l-18 17.3a21.7 21.7 0 0 1 0 31.5l18 17.3a45.7 45.7 0 0 0 14.2-33zm-74.6 0c0-6 2.6-11.6 6.8-15.7L14.2 17a45.7 45.7 0 0 0 0 66.1l18-17.3c-4.2-4-6.8-9.6-6.8-15.7z"/>
  </symbol>
</svg>
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/input-element
Description: <input/> Element
Author: Augustin Godiscal
Latest version: 1.4.1

# @resonate/input-element

Render an HTML input element

## Install

```sh
npm i --save @resonate/input-element
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/link-element
Description: Render html link element
Author: Augustin Godiscal
Latest version: 1.2.0

# @resonate/link-element 

Render an HTML link element

## Install

```sh
npm i --save @resonate/link-element
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/menu-button
Description: Actions menu button
Author: Augustin Godiscal
Latest version: 3.0.0-0

# @resonate/menu-button

Render a menu button

## Installation

```sh
npm i --save @resonate/menu-button
```

## Usage

```javascript
const MenuButton = require('@resonate/menu-button')

module.exports = (state, emit) => {
  const menuButton = state.cache(MenuButton, 'super-menu-button')

  const button = menuButton.render({ 
    id: 'super-button',
    orientation: 'left', // popup menu orientation (top, right, left, bottom)
    style: 'blank', (default, blank)
    iconName: 'dropdown', // button icon
    text: 'Click' // optional if icon name present,
    hover: false, // disabled activation on mousehover
    items: [
      { iconName: 'star', text: 'favorite', actionName: 'favorite' },
      { iconName: 'share', text: 'share', actionName: 'share' },
      { iconName: 'plus', text: 'add to playlist', actionName: 'add' }
    ],
    updateLastAction (actionName) {
      const eventName = actionName
      emit(eventName, { props })
    } 
  })

  return button
}

```

## See also

- [Original example](https://www.w3.org/TR/2016/WD-wai-aria-practices-1.1-20161214/examples/menu-button/menu-button-1/menu-button-1.html)

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/menu-button-options
Description: Resonate sharable config for @resonate/menu-button
Author: Augustin Godiscal
Latest version: 1.0.0

# @resonate/menu-button-options

Resonate sharable config for `@resonate/menu-button`

## Installation

```sh
npm i --save @resonate/menu-button-options
```

## See also

- [@resonate/menu-button](https://github.com/resonatecoop/stream2own/tree/master/packages/menu-button)

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/play-count
Description: Render or animate counter elemen
Author: Augustin Godiscal
Latest version: 2.1.2

# Play count

Render or animate play count counter element

## Installation

```sh
npm i --save @resonate/play-count
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/play-count-component
Description: Play count element component wrapper
Author: Augustin Godiscal
Latest version: 1.0.0

# @resonate/play-count-component

Wrapper around `@resonate/play-count` element

## Installation

```sh
npm install @resonate/play-count-compnent --save
```

## LICENSE

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/player-component
Description: Player component
Author: Augustin Godiscal
Latest version: 3.0.0-1

# @resonate/player-component

Player component

## Installation

```sh
$ npm i --save @resonate/player-component
```

## Usage

```js

const Player = require('@resonate/player-component')

function (state, emit) {
  return html`
    <div class="bg-black white fixed bottom-0 left-0 right-0 w-100">
      ${state.cache('player').render({
        menu: {
          items: [
            {
              iconName: 'star',
              text: 'favorite',
              toggleState: state.track.fav === 0,
              action: (toggle, data) => {
                emit(toggle ? 'favorite' : 'unfavorite', data.id)
              }
            },
            {
              iconName: 'share',
              text: 'share'
            },
            {
              iconName: 'info',
              text: 'artist profile'
            }
          ]
        }
      })}
    </div>
  `
}

...
```

## Options

- `prefix` A single class or classlist
- `menu` An array of menu item configuration for `@resonate/menu-button`

## Playback control

Player state is exposed in `state.components[componentId]`

Playback state machine can be controlled

```js
...

machine.playback.emit('play')

machine.playback.emit('pause')

```

## Icons

See `@resonate/icon-element`

SVG icons set configuration.

Icon names

- play
- pause
- previous
- next
- volume

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>
npm package: @resonate/playlist-component
Description: Playlist component for resonate
Author: Augustin Godiscal
Latest version: 3.0.0-0

# @resonate/playlist-component

Playlist component

## Installation

```sh
$ npm i --save @resonate/playlist-component
```

## License

MIT

## Author(s)

- Augustin Godiscal <auggod@resonate.is>