@crediblefinance/credible-ui
Version:
Credible's standard UI library
48 lines • 8.94 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/cdk/clipboard";
import * as i2 from "@angular/material/tooltip";
export class CfRedirectComponent {
clipboard;
value;
class;
label;
trim = false;
trimLength = 22;
trimmedValue = '';
constructor(clipboard) {
this.clipboard = clipboard;
this.value = '';
this.class = '';
this.label = '';
}
ngOnChanges(changes) {
if (changes.value) {
const currentValue = changes.value.currentValue;
if (this.trim && currentValue.length > this.trimLength)
this.trimmedValue = currentValue.slice(0, this.trimLength) + '...';
else
this.trimmedValue = currentValue;
}
}
copyAddress(address) {
this.clipboard?.copy(address);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: CfRedirectComponent, deps: [{ token: i1.Clipboard }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: CfRedirectComponent, selector: "cf-redirect", inputs: { value: "value", class: "class", label: "label", trim: "trim", trimLength: "trimLength" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cf-redirect\">\n <div>\n <label class=\"label\">{{ label }}</label>\n </div>\n <div class=\"redirect-holder\">\n <a [class]=\"class\" [href]=\"value\" target=\"_blank\">\n {{ trimmedValue }}\n </a>\n <i\n class=\"fa-solid fa-copy\"\n [matTooltip]=\"'Copy ' + label\"\n (click)=\"copyAddress(value)\"\n ></i>\n <a [class]=\"class\" [href]=\"value\" target=\"_blank\">\n <i\n class=\"fa-solid fa-square-up-right\"\n matTooltip=\"Open in new tab\"\n ></i>\n </a>\n </div>\n</div>\n", styles: [".cf-redirect{padding:0 1rem;height:max-content;margin-left:auto;margin-right:auto;margin-bottom:1rem}.cf-redirect .redirect-holder{border:.5px solid rgba(0,0,0,.05);border-radius:2px;padding:.4rem 1rem;display:flex;justify-content:space-between}.cf-redirect .redirect-holder a{border:none;overflow-wrap:anywhere}.cf-redirect .redirect-holder .fa-copy{margin-left:.5em;font-size:1rem}.cf-redirect .redirect-holder .fa-square-up-right{color:#000;margin-left:.5em;font-size:1rem}.cf-redirect .redirect-holder .fa-square-up-right:hover{color:#00000080;cursor:pointer}.cf-redirect .label{font-weight:700;font-size:.8rem}\n"], dependencies: [{ kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: CfRedirectComponent, decorators: [{
type: Component,
args: [{ selector: 'cf-redirect', template: "<div class=\"cf-redirect\">\n <div>\n <label class=\"label\">{{ label }}</label>\n </div>\n <div class=\"redirect-holder\">\n <a [class]=\"class\" [href]=\"value\" target=\"_blank\">\n {{ trimmedValue }}\n </a>\n <i\n class=\"fa-solid fa-copy\"\n [matTooltip]=\"'Copy ' + label\"\n (click)=\"copyAddress(value)\"\n ></i>\n <a [class]=\"class\" [href]=\"value\" target=\"_blank\">\n <i\n class=\"fa-solid fa-square-up-right\"\n matTooltip=\"Open in new tab\"\n ></i>\n </a>\n </div>\n</div>\n", styles: [".cf-redirect{padding:0 1rem;height:max-content;margin-left:auto;margin-right:auto;margin-bottom:1rem}.cf-redirect .redirect-holder{border:.5px solid rgba(0,0,0,.05);border-radius:2px;padding:.4rem 1rem;display:flex;justify-content:space-between}.cf-redirect .redirect-holder a{border:none;overflow-wrap:anywhere}.cf-redirect .redirect-holder .fa-copy{margin-left:.5em;font-size:1rem}.cf-redirect .redirect-holder .fa-square-up-right{color:#000;margin-left:.5em;font-size:1rem}.cf-redirect .redirect-holder .fa-square-up-right:hover{color:#00000080;cursor:pointer}.cf-redirect .label{font-weight:700;font-size:.8rem}\n"] }]
}], ctorParameters: () => [{ type: i1.Clipboard }], propDecorators: { value: [{
type: Input
}], class: [{
type: Input
}], label: [{
type: Input
}], trim: [{
type: Input
}], trimLength: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2YtcmVkaXJlY3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY3JlZGlibGUtdWkvc3JjL2xpYi9jZi1yZWRpcmVjdC9jZi1yZWRpcmVjdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jcmVkaWJsZS11aS9zcmMvbGliL2NmLXJlZGlyZWN0L2NmLXJlZGlyZWN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDSCxTQUFTLEVBQUUsS0FBSyxFQUNuQixNQUFNLGVBQWUsQ0FBQzs7OztBQU92QixNQUFNLE9BQU8sbUJBQW1CO0lBU1I7SUFSWCxLQUFLLENBQVU7SUFDZixLQUFLLENBQVM7SUFDZCxLQUFLLENBQVM7SUFDZCxJQUFJLEdBQVksS0FBSyxDQUFDO0lBQ3RCLFVBQVUsR0FBVyxFQUFFLENBQUM7SUFFakMsWUFBWSxHQUFXLEVBQUUsQ0FBQztJQUUxQixZQUFvQixTQUFvQjtRQUFwQixjQUFTLEdBQVQsU0FBUyxDQUFXO1FBQ3BDLElBQUksQ0FBQyxLQUFLLEdBQUcsRUFBRSxDQUFDO1FBQ2hCLElBQUksQ0FBQyxLQUFLLEdBQUcsRUFBRSxDQUFDO1FBQ2hCLElBQUksQ0FBQyxLQUFLLEdBQUcsRUFBRSxDQUFDO0lBQ3BCLENBQUM7SUFFRCxXQUFXLENBQUMsT0FBc0I7UUFDOUIsSUFBSSxPQUFPLENBQUMsS0FBSyxFQUFFO1lBQ2YsTUFBTSxZQUFZLEdBQUcsT0FBTyxDQUFDLEtBQUssQ0FBQyxZQUFZLENBQUM7WUFFaEQsSUFBSSxJQUFJLENBQUMsSUFBSSxJQUFJLFlBQVksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLFVBQVU7Z0JBQ2xELElBQUksQ0FBQyxZQUFZLEdBQUcsWUFBWSxDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxHQUFHLEtBQUssQ0FBQzs7Z0JBR25FLElBQUksQ0FBQyxZQUFZLEdBQUcsWUFBWSxDQUFDO1NBQ3hDO0lBQ0wsQ0FBQztJQUVELFdBQVcsQ0FBQyxPQUFlO1FBQ3ZCLElBQUksQ0FBQyxTQUFTLEVBQUUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ2xDLENBQUM7dUdBN0JRLG1CQUFtQjsyRkFBbkIsbUJBQW1CLDRLQ1RoQywwb0JBcUJBOzsyRkRaYSxtQkFBbUI7a0JBTC9CLFNBQVM7K0JBQ0ksYUFBYTs4RUFLZCxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gICAgQ29tcG9uZW50LCBJbnB1dCwgT25DaGFuZ2VzLCBTaW1wbGVDaGFuZ2VzXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ2xpcGJvYXJkIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NsaXBib2FyZCc7XG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2NmLXJlZGlyZWN0JyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vY2YtcmVkaXJlY3QuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2NmLXJlZGlyZWN0LmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgQ2ZSZWRpcmVjdENvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gICAgQElucHV0KCkgdmFsdWUhOiBzdHJpbmc7XG4gICAgQElucHV0KCkgY2xhc3M6IHN0cmluZztcbiAgICBASW5wdXQoKSBsYWJlbDogc3RyaW5nO1xuICAgIEBJbnB1dCgpIHRyaW06IGJvb2xlYW4gPSBmYWxzZTtcbiAgICBASW5wdXQoKSB0cmltTGVuZ3RoOiBudW1iZXIgPSAyMjtcblxuICAgIHRyaW1tZWRWYWx1ZTogc3RyaW5nID0gJyc7XG5cbiAgICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNsaXBib2FyZDogQ2xpcGJvYXJkKSB7XG4gICAgICAgIHRoaXMudmFsdWUgPSAnJztcbiAgICAgICAgdGhpcy5jbGFzcyA9ICcnO1xuICAgICAgICB0aGlzLmxhYmVsID0gJyc7XG4gICAgfVxuXG4gICAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgICAgICBpZiAoY2hhbmdlcy52YWx1ZSkge1xuICAgICAgICAgICAgY29uc3QgY3VycmVudFZhbHVlID0gY2hhbmdlcy52YWx1ZS5jdXJyZW50VmFsdWU7XG5cbiAgICAgICAgICAgIGlmICh0aGlzLnRyaW0gJiYgY3VycmVudFZhbHVlLmxlbmd0aCA+IHRoaXMudHJpbUxlbmd0aClcbiAgICAgICAgICAgICAgICB0aGlzLnRyaW1tZWRWYWx1ZSA9IGN1cnJlbnRWYWx1ZS5zbGljZSgwLCB0aGlzLnRyaW1MZW5ndGgpICsgJy4uLic7XG5cbiAgICAgICAgICAgIGVsc2VcbiAgICAgICAgICAgICAgICB0aGlzLnRyaW1tZWRWYWx1ZSA9IGN1cnJlbnRWYWx1ZTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIGNvcHlBZGRyZXNzKGFkZHJlc3M6IHN0cmluZykge1xuICAgICAgICB0aGlzLmNsaXBib2FyZD8uY29weShhZGRyZXNzKTtcbiAgICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiY2YtcmVkaXJlY3RcIj5cbiAgICA8ZGl2PlxuICAgICAgICA8bGFiZWwgY2xhc3M9XCJsYWJlbFwiPnt7IGxhYmVsIH19PC9sYWJlbD5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwicmVkaXJlY3QtaG9sZGVyXCI+XG4gICAgICAgIDxhIFtjbGFzc109XCJjbGFzc1wiIFtocmVmXT1cInZhbHVlXCIgdGFyZ2V0PVwiX2JsYW5rXCI+XG4gICAgICAgICAgICB7eyB0cmltbWVkVmFsdWUgfX1cbiAgICAgICAgPC9hPlxuICAgICAgICA8aVxuICAgICAgICAgICAgY2xhc3M9XCJmYS1zb2xpZCBmYS1jb3B5XCJcbiAgICAgICAgICAgIFttYXRUb29sdGlwXT1cIidDb3B5ICcgKyBsYWJlbFwiXG4gICAgICAgICAgICAoY2xpY2spPVwiY29weUFkZHJlc3ModmFsdWUpXCJcbiAgICAgICAgPjwvaT5cbiAgICAgICAgPGEgW2NsYXNzXT1cImNsYXNzXCIgW2hyZWZdPVwidmFsdWVcIiB0YXJnZXQ9XCJfYmxhbmtcIj5cbiAgICAgICAgICAgIDxpXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJmYS1zb2xpZCBmYS1zcXVhcmUtdXAtcmlnaHRcIlxuICAgICAgICAgICAgICAgIG1hdFRvb2x0aXA9XCJPcGVuIGluIG5ldyB0YWJcIlxuICAgICAgICAgICAgPjwvaT5cbiAgICAgICAgPC9hPlxuICAgIDwvZGl2PlxuPC9kaXY+XG4iXX0=