@dorgtech/web3modal-angular
Version:
Web3Modal implementation for Angular
101 lines • 9.15 kB
JavaScript
/**
* @fileoverview added by tsickle
* Generated from: lib/web3-modal/web3-modal.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, ViewEncapsulation } from '@angular/core';
import { Web3ModalService } from './web3-modal.service';
export class Web3ModalComponent {
/**
* @param {?} service
*/
constructor(service) {
this.service = service;
this.open = false;
this.providers = [];
}
/**
* @return {?}
*/
ngOnInit() {
this.openSubscription = this.service.shouldOpen.subscribe({
next: (/**
* @param {?} open
* @return {?}
*/
open => {
this.open = open;
}),
});
this.providersSubscription = this.service.providers.subscribe({
next: (/**
* @param {?} providers
* @return {?}
*/
providers => {
this.providers = providers;
}),
});
}
/**
* @return {?}
*/
ngOnDestroy() {
this.openSubscription.unsubscribe();
this.providersSubscription.unsubscribe();
}
/**
* @return {?}
*/
close() {
this.service.close();
}
}
Web3ModalComponent.decorators = [
{ type: Component, args: [{
selector: 'm-web3-modal',
template: "<m-modal [open]=\"open\" (closed)=\"close()\">\n <div class=\"m-web3Modal\">\n <div class=\"m-web3Modal__header\">\n <h3 class=\"m-web3ModalHeader__title\">\n {{ title }}\n </h3>\n <div class=\"m-web3ModalHeader__description\">\n <p class=\"m-web3ModalHeader__text\">\n {{ description }}\n </p>\n <p\n class=\"m-web3ModalHeader__text--gray m-web3ModalHeader__text\"\n >\n {{ descriptionGray }}\n </p>\n </div>\n </div>\n <div class=\"m-web3Modal__body\">\n <div class=\"m-web3ModalBody__provider\">\n <div\n class=\"m-web3ModalProvider__body\"\n *ngFor=\"let provider of providers\"\n (click)=\"provider.onClick()\"\n >\n <div class=\"m-web3ModalProviderBody__icon\">\n <img [src]=\"provider.logo\" [alt]=\"provider.logo\" />\n </div>\n <div class=\"m-web3ModalProviderBody__name\">\n {{ provider.name }}\n </div>\n </div>\n </div>\n </div>\n <div class=\"m-web3Modal__footer\">\n <div class=\"m-web3ModalFooter__description\">\n <p class=\"m-web3ModalFooter__text\" (click)=\"close()\">\n {{ dismissText }}\n </p>\n </div>\n </div>\n </div> \n</m-modal>\n",
encapsulation: ViewEncapsulation.None,
styles: [".m-web3Modal{background-color:#fff;box-sizing:border-box;display:block;margin:auto;position:relative;width:100%}@media screen and (max-width:540px){.m-web3Modal{border-radius:0;display:flex;flex:1;flex-direction:column;justify-content:space-between;margin:0}}.m-web3Modal__header{padding:40px 50px 0}.m-web3ModalHeader__title{color:#4f4f50;font-size:30px;font-weight:800;margin:0}.m-web3ModalHeader__text{color:#4f4f50;font-size:16px;font-weight:600;line-height:22px;margin:0}.m-web3ModalHeader__description{display:flex;flex-direction:column;justify-content:center;min-height:70px}.m-web3ModalHeader__text--gray{color:#7d7d82;margin:0}.m-web3Modal__footer{display:flex;flex-direction:column;height:100px;justify-content:center;margin-top:-40px;padding:0 50px}@media screen and (max-width:768px){.m-web3Modal__footer{margin-top:-20px}}.m-web3ModalFooter__text{color:#7d7d82;cursor:pointer;font-size:17px;font-weight:600;margin:0;text-align:center}.m-web3Modal__body{max-height:420px;overflow-y:auto;padding:20px 50px}.m-web3ModalBody__provider{display:flex;flex-wrap:wrap;justify-content:space-between}@media screen and (max-width:540px){.m-web3ModalBody__provider{justify-content:center}}.m-web3ModalProvider__body{align-items:center;background-color:#fff;border:1px solid #dce2e4;cursor:pointer;display:flex;flex-direction:column;height:165px;justify-content:center;margin-bottom:20px;width:194px}.m-web3ModalProviderBody__name{color:#4f4f50;font-size:15px;font-weight:600;margin-top:12px}.m-web3ModalProviderBody__icon{align-items:center;border-radius:50%;box-shadow:none;display:flex;height:60px;justify-content:center;overflow:visible;width:60px}.m-web3ModalProviderBody__icon img{height:100%;width:100%}"]
}] }
];
/** @nocollapse */
Web3ModalComponent.ctorParameters = () => [
{ type: Web3ModalService }
];
Web3ModalComponent.propDecorators = {
title: [{ type: Input }],
description: [{ type: Input }],
descriptionGray: [{ type: Input }],
dismissText: [{ type: Input }]
};
if (false) {
/** @type {?} */
Web3ModalComponent.prototype.open;
/** @type {?} */
Web3ModalComponent.prototype.providers;
/**
* @type {?}
* @private
*/
Web3ModalComponent.prototype.openSubscription;
/**
* @type {?}
* @private
*/
Web3ModalComponent.prototype.providersSubscription;
/** @type {?} */
Web3ModalComponent.prototype.title;
/** @type {?} */
Web3ModalComponent.prototype.description;
/** @type {?} */
Web3ModalComponent.prototype.descriptionGray;
/** @type {?} */
Web3ModalComponent.prototype.dismissText;
/**
* @type {?}
* @private
*/
Web3ModalComponent.prototype.service;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2ViMy1tb2RhbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiL2hvbWUvbmFtZXN0eS9Eb2N1bWVudHMvbWluZHNkb3JnL21pbmRzZG9yZy93ZWIzbW9kYWwtYW5ndWxhci9wcm9qZWN0cy93ZWIzbW9kYWwvc3JjLyIsInNvdXJjZXMiOlsibGliL3dlYjMtbW9kYWwvd2ViMy1tb2RhbC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUdwRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQVF4RCxNQUFNLE9BQU8sa0JBQWtCOzs7O0lBWTdCLFlBQW9CLE9BQXlCO1FBQXpCLFlBQU8sR0FBUCxPQUFPLENBQWtCO1FBWDdDLFNBQUksR0FBWSxLQUFLLENBQUM7UUFDdEIsY0FBUyxHQUEyQixFQUFFLENBQUM7SUFVVSxDQUFDOzs7O0lBRWxELFFBQVE7UUFDTixJQUFJLENBQUMsZ0JBQWdCLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxVQUFVLENBQUMsU0FBUyxDQUFDO1lBQ3hELElBQUk7Ozs7WUFBRSxJQUFJLENBQUMsRUFBRTtnQkFDWCxJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQztZQUNuQixDQUFDLENBQUE7U0FDRixDQUFDLENBQUM7UUFFSCxJQUFJLENBQUMscUJBQXFCLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsU0FBUyxDQUFDO1lBQzVELElBQUk7Ozs7WUFBRSxTQUFTLENBQUMsRUFBRTtnQkFDaEIsSUFBSSxDQUFDLFNBQVMsR0FBRyxTQUFTLENBQUM7WUFDN0IsQ0FBQyxDQUFBO1NBQ0YsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzs7OztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsZ0JBQWdCLENBQUMsV0FBVyxFQUFFLENBQUE7UUFDbkMsSUFBSSxDQUFDLHFCQUFxQixDQUFDLFdBQVcsRUFBRSxDQUFBO0lBQzFDLENBQUM7Ozs7SUFFRCxLQUFLO1FBQ0gsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUN2QixDQUFDOzs7WUF6Q0YsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxjQUFjO2dCQUN4QiwreUNBQXdDO2dCQUV4QyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTs7YUFDdEM7Ozs7WUFQUSxnQkFBZ0I7OztvQkFldEIsS0FBSzswQkFDTCxLQUFLOzhCQUNMLEtBQUs7MEJBQ0wsS0FBSzs7OztJQVROLGtDQUFzQjs7SUFDdEIsdUNBQXVDOzs7OztJQUV2Qyw4Q0FBdUM7Ozs7O0lBQ3ZDLG1EQUE0Qzs7SUFFNUMsbUNBQXNCOztJQUN0Qix5Q0FBNkI7O0lBQzdCLDZDQUFpQzs7SUFDakMseUNBQTZCOzs7OztJQUVqQixxQ0FBaUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgU3Vic2NyaXB0aW9uIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBJUHJvdmlkZXJVc2VyT3B0aW9ucyB9IGZyb20gJ0BtaW5kc29yZy93ZWIzbW9kYWwtdHMnO1xuaW1wb3J0IHsgV2ViM01vZGFsU2VydmljZSB9IGZyb20gJy4vd2ViMy1tb2RhbC5zZXJ2aWNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbS13ZWIzLW1vZGFsJyxcbiAgdGVtcGxhdGVVcmw6ICd3ZWIzLW1vZGFsLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vd2ViMy1tb2RhbC5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxufSlcbmV4cG9ydCBjbGFzcyBXZWIzTW9kYWxDb21wb25lbnQge1xuICBvcGVuOiBib29sZWFuID0gZmFsc2U7XG4gIHByb3ZpZGVyczogSVByb3ZpZGVyVXNlck9wdGlvbnNbXSA9IFtdO1xuXG4gIHByaXZhdGUgb3BlblN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuICBwcml2YXRlIHByb3ZpZGVyc1N1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuXG4gIEBJbnB1dCgpIHRpdGxlOiBzdHJpbmdcbiAgQElucHV0KCkgZGVzY3JpcHRpb24/OiBzdHJpbmdcbiAgQElucHV0KCkgZGVzY3JpcHRpb25HcmF5Pzogc3RyaW5nXG4gIEBJbnB1dCgpIGRpc21pc3NUZXh0Pzogc3RyaW5nXG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBzZXJ2aWNlOiBXZWIzTW9kYWxTZXJ2aWNlKSB7IH1cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLm9wZW5TdWJzY3JpcHRpb24gPSB0aGlzLnNlcnZpY2Uuc2hvdWxkT3Blbi5zdWJzY3JpYmUoe1xuICAgICAgbmV4dDogb3BlbiA9PiB7XG4gICAgICAgIHRoaXMub3BlbiA9IG9wZW47XG4gICAgICB9LFxuICAgIH0pO1xuXG4gICAgdGhpcy5wcm92aWRlcnNTdWJzY3JpcHRpb24gPSB0aGlzLnNlcnZpY2UucHJvdmlkZXJzLnN1YnNjcmliZSh7XG4gICAgICBuZXh0OiBwcm92aWRlcnMgPT4ge1xuICAgICAgICB0aGlzLnByb3ZpZGVycyA9IHByb3ZpZGVycztcbiAgICAgIH0sXG4gICAgfSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICB0aGlzLm9wZW5TdWJzY3JpcHRpb24udW5zdWJzY3JpYmUoKVxuICAgIHRoaXMucHJvdmlkZXJzU3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKClcbiAgfVxuXG4gIGNsb3NlKCkge1xuICAgIHRoaXMuc2VydmljZS5jbG9zZSgpO1xuICB9XG59XG4iXX0=