hashicorp-copywrite[bot]andCameron Perera
3d610427d0
* [COMPLIANCE] Add Copyright and License Headers * chore: 🤖 update Copyright headers to satisfy our lint rules --------- Co-authored-by: hashicorp-copywrite[bot] <110428419+hashicorp-copywrite[bot]@users.noreply.github.com> Co-authored-by: Cameron Perera <cameron.perera@hashicorp.com>
69 lines
1.6 KiB
JavaScript
69 lines
1.6 KiB
JavaScript
/**
|
|
* Copyright (c) HashiCorp, Inc.
|
|
* SPDX-License-Identifier: MPL-2.0
|
|
*/
|
|
|
|
import Component from '@glimmer/component';
|
|
import ClipboardJS from 'clipboard';
|
|
import { action } from '@ember/object';
|
|
import { generateComponentID } from 'rose/utilities/component-auto-id';
|
|
import { tracked } from '@glimmer/tracking';
|
|
import { later } from '@ember/runloop';
|
|
|
|
export default class CopyableComponent extends Component {
|
|
// =attributes
|
|
|
|
id = generateComponentID();
|
|
copyableButtonId = `copyable-button-${this.id}`;
|
|
|
|
actionIcon = 'flight-icons/svg/clipboard-copy-16';
|
|
successIcon = 'flight-icons/svg/clipboard-checked-16';
|
|
actionText = this.args.buttonText;
|
|
successText = this.args.acknowledgeText;
|
|
|
|
@tracked copied = false;
|
|
|
|
clipboard = null;
|
|
|
|
confirmCopy() {
|
|
this.copied = true;
|
|
later(() => (this.copied = false), 1000);
|
|
}
|
|
|
|
/**
|
|
* Checks for ClipboardJS support.
|
|
* @return {boolean}
|
|
*/
|
|
get isClipboardLibrarySupported() {
|
|
return ClipboardJS.isSupported();
|
|
}
|
|
|
|
// =actions
|
|
|
|
/**
|
|
* Initialize ClipboardJS library and register for it's events.
|
|
*/
|
|
@action
|
|
register() {
|
|
this.tearDown();
|
|
/* istanbul ignore next */
|
|
this.clipboard = new ClipboardJS(`#${this.copyableButtonId}`, {
|
|
text: () => this.args.text,
|
|
});
|
|
/* istanbul ignore next */
|
|
this.clipboard.on('success', (clipboardEvent) => {
|
|
clipboardEvent.clearSelection();
|
|
this.confirmCopy();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Destroy ClipboardJS library instance and cancel icon timer.
|
|
*/
|
|
@action
|
|
tearDown() {
|
|
this.clipboard?.destroy();
|
|
this.clipboard = null;
|
|
}
|
|
}
|