import { Component, Input } from '@angular/core';
import { RdLib } from '../../base/rdLib';

declare const Clipboard;

@Component({
  selector: "rd-copy",
  template: `    
    <rd-button [rd-tooltip]="translateEn('Copy')" rd-size="small" rd-icon="far fa-copy" rd-color="yellow" data-clipboard="true" [attr.data-clipboard-target]="target"></rd-button>
  `
})
export class CopyClipboard {
  constructor() {
    new Clipboard("[data-clipboard=true]").on("success", (e) => {
      e.clearSelection(),
        this.toastr.info(this.translateEn("Copied!"));
    });
  }

  @Input("rd-target") target; // target must be css selector.(# -> id, . -> class, div>p , a[href] , h2,h3 -> element, attribute etc.. )

  toastr = RdLib.screenOperations.toastr;
  translateEn = RdLib.localization.translateEn;
}