2018-03-17 18:26:18 +05:30
|
|
|
<script>
|
|
|
|
/**
|
|
|
|
* Falls back to the code used in `copy_to_clipboard.js`
|
|
|
|
*/
|
2018-03-27 19:54:05 +05:30
|
|
|
import tooltip from '../directives/tooltip';
|
2018-03-17 18:26:18 +05:30
|
|
|
|
|
|
|
export default {
|
|
|
|
name: 'ClipboardButton',
|
|
|
|
directives: {
|
|
|
|
tooltip,
|
|
|
|
},
|
|
|
|
props: {
|
|
|
|
text: {
|
|
|
|
type: String,
|
|
|
|
required: true,
|
|
|
|
},
|
|
|
|
title: {
|
|
|
|
type: String,
|
|
|
|
required: true,
|
|
|
|
},
|
|
|
|
tooltipPlacement: {
|
|
|
|
type: String,
|
|
|
|
required: false,
|
|
|
|
default: 'top',
|
|
|
|
},
|
|
|
|
tooltipContainer: {
|
|
|
|
type: [String, Boolean],
|
|
|
|
required: false,
|
|
|
|
default: false,
|
|
|
|
},
|
2018-03-27 19:54:05 +05:30
|
|
|
cssClass: {
|
|
|
|
type: String,
|
|
|
|
required: false,
|
|
|
|
default: 'btn-default',
|
|
|
|
},
|
2018-03-17 18:26:18 +05:30
|
|
|
},
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<button
|
|
|
|
type="button"
|
2018-03-27 19:54:05 +05:30
|
|
|
class="btn"
|
|
|
|
:class="cssClass"
|
2018-03-17 18:26:18 +05:30
|
|
|
:title="title"
|
|
|
|
:data-clipboard-text="text"
|
|
|
|
v-tooltip
|
|
|
|
:data-container="tooltipContainer"
|
|
|
|
:data-placement="tooltipPlacement"
|
|
|
|
>
|
|
|
|
<i
|
|
|
|
aria-hidden="true"
|
|
|
|
class="fa fa-clipboard"
|
|
|
|
>
|
|
|
|
</i>
|
|
|
|
</button>
|
|
|
|
</template>
|