redux-clipboard-copy

Redux Clipboard Copy
=============

Demo

Clipboard copy middleware for Redux using document.execCommand.

document.execCommand is not yet supported in all browsers, you may need some sort of polifyll or a different lib may work for you.

``
npm install redux-clipboard-copy --save
yarn add redux-clipboard-copy --save
`

Note

If you use it in CommonJS environment, don’t forget to add .default to your import

`js
var reduxClipboardCopy = require('redux-clipboard-copy').default
`

If you used ES modules, you’re already all good:

`js
import reduxClipboardCopy from 'redux-clipboard-copy';
`

We also support a UMD build:

`js
var reduxClipboardCopy = window.reduxClipboardCopy.default
`

It also requires .default at the end.

Setup

You need to add into your store enhancers

`js
import { createStore, applyMiddleware } from 'redux';
import reduxClipboardCopy from 'redux-clipboard-copy';
import rootReducer from './reducers/index';

// Note: this API requires redux@>=3.1.0
const store = createStore(
rootReducer,
applyMiddleware(reduxClipboardCopy)
);
`

With this setup you can just dispatch copy action as:

`js
import { copy } from 'redux-clipboard-copy';

const value = 'value to be copied!';

dispatch(
copy({
payload: { value }
})
)
`

API

$3

`js
import { copy } from 'redux-clipboard-copy';

// ...
dispatch(
copy({
payload: {
value: 'to be copied'
}
})
);
`

$3

Triggered once document.execCommand fails.

`js
import { failed } from 'redux-clipboard-copy';

// ...
dispatch(failed());
`

$3

Triggered once document.execCommand succeed.

`js
import { success } from 'redux-clipboard-copy';

// ...
dispatch(success());
`

$3

Action type to handle copy start into reducers

`js
import { COPY } from 'redux-clipboard-copy';

// ...

function reducer(state = {}, action) {
switch(action.type) {
case COPY:
// do something once copy starts
return state;

default:
return state;
}
}

`

$3

Action type to handle copy success into reducers

`js
import { SUCCESS } from 'redux-clipboard-copy';

// ...

function reducer(state = {}, action) {
switch(action.type) {
case SUCCESS:
// do something once copy succeeded.
return state;

default:
return state;
}
}

`

$3

Action type to handle copy failure into reducers

`js
import { FAILED } from 'redux-clipboard-copy';

// ...

function reducer(state = {}, action) {
switch(action.type) {
case FAILED:
// do something once copy fails
return state;

default:
return state;
}
}

``

License

MIT