Skip to content

GetmeUK/manhattan-js-interactions

Repository files navigation

Manhattan interactions

A set of functions to implement common UI interactions.

npm version Build Status Coverage Status dependencies status

Installation

npm install manhattan-interactions --save-dev

Usage

<div id="content-to-copy">
    I want to copy this content into the clipboard.
</div>

<a href="#copy" data-mh-copy-to-clipboard="#content-to-copy">Click to copy</a>


<form id="proxied-form">
    <label>Field <input type="text" name="field"></label>
    <button type="submit">Button</button>
</form>

<a href="#submit" data-mh-sumbit-by-proxy="#proxied-form">Click to submit</a>
import * as $ from 'manhattan-essentials'
import * as interactions from 'manhattan-interactions'

for (const copyElement of $.many('[data-mh-copy-to-clipboard]')) {
    $.listen(copyElement, {'click': interactions.copyToClipboard.onCopy()})
}

for (const submitElement of $.many('[data-mh-submit-by-proxy]')) {
    $.listen(submitElement, {'click': interactions.submitByProxy.onSubmit()})
}