@vendasta/store
Version:
Components and data for Store
139 lines • 14.2 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { BillingModel } from '@vendasta/core/billing';
var VaHeaderContainerComponent = /** @class */ (function () {
function VaHeaderContainerComponent() {
this.loaded = true;
this.showEnableAddon = false;
this.prerequisiteSelected = new EventEmitter();
this.actionSelected = new EventEmitter();
this.pricingActionSelected = new EventEmitter();
}
/**
* @return {?}
*/
VaHeaderContainerComponent.prototype.onActionSelected = /**
* @return {?}
*/
function () {
this.actionSelected.emit();
};
/**
* @return {?}
*/
VaHeaderContainerComponent.prototype.onPrerequisiteSelected = /**
* @return {?}
*/
function () {
this.prerequisiteSelected.emit();
};
/**
* @param {?} billedProduct
* @return {?}
*/
VaHeaderContainerComponent.prototype.showPricingModel = /**
* @param {?} billedProduct
* @return {?}
*/
function (billedProduct) {
return billedProduct && [BillingModel.Tiered, BillingModel.Stairstep].includes(billedProduct.billingModel);
};
/**
* @param {?} billingModel
* @return {?}
*/
VaHeaderContainerComponent.prototype.getPricingModelTooltips = /**
* @param {?} billingModel
* @return {?}
*/
function (billingModel) {
switch (billingModel) {
case BillingModel.Stairstep:
return 'Price applies per unit within a range';
case BillingModel.Tiered:
return 'Price applies to all units once range is met';
default:
return '';
}
};
VaHeaderContainerComponent.decorators = [
{ type: Component, args: [{
selector: 'va-header-container',
template: "<div class=\"header-container\">\n <div class=\"product-overview\">\n <div class=\"product-id\">\n\n <va-icon [iconUrl]=\"iconUrl\" [name]=\"title\" [diameter]=\"120\"></va-icon>\n\n <div class=\"product-id-text\">\n\n <h1 [ngClass]=\"{'stencil-title stencil-shimmer': !title, 'product-title': title}\">\n {{ title }}\n </h1>\n\n <span [ngClass]=\"{'stencil-tagline stencil-shimmer': !title && !tagline, 'tagline': tagline}\">\n {{ tagline }}\n </span>\n\n <div *ngIf=\"prerequisite\" class=\"prerequisite\">\n <span class=\"requires-text\">Requires </span>\n <span>{{ prerequisite }}</span>\n </div>\n\n <mat-chip-list>\n <mat-chip *ngFor=\"let chip of chipLabels\">{{ chip }}</mat-chip>\n </mat-chip-list>\n\n </div>\n </div>\n\n <div class=\"pricing\">\n\n <button *ngIf=\"showAction && !showEnableAddon\" mat-raised-button class=\"app-enable-button\" [disabled]=\"!actionEnabled\" (click)=\"onActionSelected()\">\n {{ actionLabel }}\n </button>\n\n <button *ngIf=\"showEnableAddon && !showAction\" mat-raised-button class=\"app-enable-button\" [disabled]=\"!showEnableAddon\" (click)=\"onActionSelected()\">\n {{ actionLabel }}\n </button>\n\n <div *ngIf=\"prerequisiteLabel && !showEnableAddon\" class=\"addon-enable\" (click)=\"onPrerequisiteSelected()\">\n Enabled with {{prerequisiteLabel}}\n </div>\n\n <div *ngIf=\"showPricing\" class=\"price-box\">\n <div *ngIf=\"pricing?.prices?.length\" class=\"wholesale-price\">{{ pricingLabel }}\n <div *ngIf=\"showPricingModel(billedProduct) && hasVerifiedContract\"\n class=\"pricing-model\"\n matTooltip=\"{{getPricingModelTooltips(billedProduct.billingModel)}}\">({{ billedProduct.billingModel }})\n </div>\n </div>\n <va-pricing [pricing]=\"pricing\"\n [billedProduct]=\"billedProduct\"\n [hasVerifiedContract]=\"hasVerifiedContract\"\n [loaded]=\"loaded\"></va-pricing>\n </div>\n\n <p *ngIf=\"pricingActionEnabled\" class=\"pricing-action-container\">\n <a (click)=\"pricingActionSelected.emit()\">{{ pricingActionLabel }}</a>\n </p>\n\n </div>\n\n </div>\n</div>\n",
styles: [":host{font-size:16px}.product-title{font-size:24px}.product-overview{display:flex;flex-wrap:wrap;border-bottom:1px solid #e0e0e0}.product-overview h1{margin:0;font-weight:400;line-height:1.2}.product-overview mat-chip{margin-bottom:3px}.product-id{display:flex;width:100%;padding:24px;flex-grow:1}.product-id va-icon{margin-right:20px}@media screen and (max-width:600px){.product-id va-icon ::ng-deep .va-icon-container{width:40px!important;height:40px!important}.product-id va-icon ::ng-deep .va-icon-container span{line-height:40px!important;font-size:15px!important}}.product-id .product-id-text{display:flex;flex-direction:column;justify-content:center}.product-id span{overflow:hidden}.product-id .tagline{color:#616161;margin:.5em 0 1em;font-size:16px}@media screen and (min-width:600px){.product-title{font-size:32px}.product-id .tagline{font-size:20px}.product-id{width:66%;padding-right:20px}}.product-id .prerequisite{margin:.5em 0 1em;font-size:14px}.product-id .requires-text{color:#9e9e9e}.inline-link{display:inline-flex!important;color:#1e88e5;cursor:pointer;padding-top:5px}.pricing{display:flex;flex-direction:column;width:100%;padding:0 24px 24px;color:#616161}@media screen and (min-width:600px){.pricing{width:34%;padding-top:24px;padding-left:20px}}.pricing span{display:block}.pricing span:nth-child(2){margin:.5em 0 1em}.pricing .price{font-size:24px;font-weight:700;line-height:1;color:#4caf50}.pricing .price-box{padding-top:10px}.pricing .pricing-action-container{margin:8px 0}.pricing .pricing-action-container mat-icon{vertical-align:middle;margin-right:6px}.pricing .pricing-action-container a{cursor:pointer}.pricing .pricing-model{display:inline-block;font-size:.8rem;color:#9e9e9e;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.app-enable-button{height:inherit;color:#fff;background-color:#4caf50;font-size:20px;padding:14px 16px;line-height:1}.addon-enable{height:inherit;background-color:#e0e0e0;font-size:14px;padding:14px 16px;line-height:1;color:#1e88e5;cursor:pointer;text-align:center}.wholesale-price{margin-top:0;padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid #e0e0e0}.stencil-title{height:32px;width:200px;margin-bottom:5px!important}.stencil-tagline{height:32px;width:250px}"]
}] }
];
VaHeaderContainerComponent.propDecorators = {
iconUrl: [{ type: Input }],
title: [{ type: Input }],
tagline: [{ type: Input }],
prerequisite: [{ type: Input }],
chipLabels: [{ type: Input }],
pricing: [{ type: Input }],
billedProduct: [{ type: Input }],
loaded: [{ type: Input }],
hasVerifiedContract: [{ type: Input }],
pricingLabel: [{ type: Input }],
pricingActionLabel: [{ type: Input }],
pricingActionEnabled: [{ type: Input }],
actionEnabled: [{ type: Input }],
actionLabel: [{ type: Input }],
showAction: [{ type: Input }],
showPricing: [{ type: Input }],
showEnableAddon: [{ type: Input }],
prerequisiteLabel: [{ type: Input }],
prerequisiteSelected: [{ type: Output }],
actionSelected: [{ type: Output }],
pricingActionSelected: [{ type: Output }]
};
return VaHeaderContainerComponent;
}());
export { VaHeaderContainerComponent };
if (false) {
/** @type {?} */
VaHeaderContainerComponent.prototype.iconUrl;
/** @type {?} */
VaHeaderContainerComponent.prototype.title;
/** @type {?} */
VaHeaderContainerComponent.prototype.tagline;
/** @type {?} */
VaHeaderContainerComponent.prototype.prerequisite;
/** @type {?} */
VaHeaderContainerComponent.prototype.chipLabels;
/** @type {?} */
VaHeaderContainerComponent.prototype.pricing;
/** @type {?} */
VaHeaderContainerComponent.prototype.billedProduct;
/** @type {?} */
VaHeaderContainerComponent.prototype.loaded;
/** @type {?} */
VaHeaderContainerComponent.prototype.hasVerifiedContract;
/** @type {?} */
VaHeaderContainerComponent.prototype.pricingLabel;
/** @type {?} */
VaHeaderContainerComponent.prototype.pricingActionLabel;
/** @type {?} */
VaHeaderContainerComponent.prototype.pricingActionEnabled;
/** @type {?} */
VaHeaderContainerComponent.prototype.actionEnabled;
/** @type {?} */
VaHeaderContainerComponent.prototype.actionLabel;
/** @type {?} */
VaHeaderContainerComponent.prototype.showAction;
/** @type {?} */
VaHeaderContainerComponent.prototype.showPricing;
/** @type {?} */
VaHeaderContainerComponent.prototype.showEnableAddon;
/** @type {?} */
VaHeaderContainerComponent.prototype.prerequisiteLabel;
/** @type {?} */
VaHeaderContainerComponent.prototype.prerequisiteSelected;
/** @type {?} */
VaHeaderContainerComponent.prototype.actionSelected;
/** @type {?} */
VaHeaderContainerComponent.prototype.pricingActionSelected;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVhZGVyLWNvbnRhaW5lci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AdmVuZGFzdGEvc3RvcmUvIiwic291cmNlcyI6WyJsaWIvaGVhZGVyLWNvbnRhaW5lci9oZWFkZXItY29udGFpbmVyLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUVyRSxPQUFPLEVBQWdCLFlBQVksRUFBQyxNQUFNLHdCQUF3QixDQUFDO0FBRW5FO0lBQUE7UUFjVyxXQUFNLEdBQUcsSUFBSSxDQUFDO1FBU2Qsb0JBQWUsR0FBRyxLQUFLLENBQUM7UUFFdkIseUJBQW9CLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUMxQyxtQkFBYyxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFDcEMsMEJBQXFCLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztJQXdCdkQsQ0FBQzs7OztJQXRCQyxxREFBZ0I7OztJQUFoQjtRQUNFLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDN0IsQ0FBQzs7OztJQUVELDJEQUFzQjs7O0lBQXRCO1FBQ0UsSUFBSSxDQUFDLG9CQUFvQixDQUFDLElBQUksRUFBRSxDQUFDO0lBQ25DLENBQUM7Ozs7O0lBRUQscURBQWdCOzs7O0lBQWhCLFVBQWlCLGFBQTRCO1FBQzNDLE9BQU8sYUFBYSxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sRUFBRSxZQUFZLENBQUMsU0FBUyxDQUFDLENBQUMsUUFBUSxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsQ0FBQztJQUM3RyxDQUFDOzs7OztJQUVELDREQUF1Qjs7OztJQUF2QixVQUF3QixZQUEwQjtRQUNoRCxRQUFRLFlBQVksRUFBRTtZQUNwQixLQUFLLFlBQVksQ0FBQyxTQUFTO2dCQUN6QixPQUFPLHVDQUF1QyxDQUFDO1lBQ2pELEtBQUssWUFBWSxDQUFDLE1BQU07Z0JBQ3RCLE9BQU8sOENBQThDLENBQUM7WUFDeEQ7Z0JBQ0UsT0FBTyxFQUFFLENBQUM7U0FDYjtJQUNILENBQUM7O2dCQWxERixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLHFCQUFxQjtvQkFDL0IsazZFQUFnRDs7aUJBRWpEOzs7MEJBR0UsS0FBSzt3QkFDTCxLQUFLOzBCQUNMLEtBQUs7K0JBQ0wsS0FBSzs2QkFDTCxLQUFLOzBCQUNMLEtBQUs7Z0NBQ0wsS0FBSzt5QkFDTCxLQUFLO3NDQUNMLEtBQUs7K0JBQ0wsS0FBSztxQ0FDTCxLQUFLO3VDQUNMLEtBQUs7Z0NBQ0wsS0FBSzs4QkFDTCxLQUFLOzZCQUNMLEtBQUs7OEJBQ0wsS0FBSztrQ0FDTCxLQUFLO29DQUNMLEtBQUs7dUNBQ0wsTUFBTTtpQ0FDTixNQUFNO3dDQUNOLE1BQU07O0lBd0JULGlDQUFDO0NBQUEsQUFuREQsSUFtREM7U0E3Q1ksMEJBQTBCOzs7SUFDckMsNkNBQXlCOztJQUN6QiwyQ0FBdUI7O0lBQ3ZCLDZDQUF5Qjs7SUFDekIsa0RBQThCOztJQUM5QixnREFBOEI7O0lBQzlCLDZDQUEwQjs7SUFDMUIsbURBQXNDOztJQUN0Qyw0Q0FBdUI7O0lBQ3ZCLHlEQUFzQzs7SUFDdEMsa0RBQThCOztJQUM5Qix3REFBb0M7O0lBQ3BDLDBEQUF1Qzs7SUFDdkMsbURBQWdDOztJQUNoQyxpREFBNkI7O0lBQzdCLGdEQUE2Qjs7SUFDN0IsaURBQThCOztJQUM5QixxREFBaUM7O0lBQ2pDLHVEQUFtQzs7SUFDbkMsMERBQW9EOztJQUNwRCxvREFBOEM7O0lBQzlDLDJEQUFxRCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtQcmljaW5nfSBmcm9tICcuLi9wcmljaW5nL3ByaWNpbmcnO1xuaW1wb3J0IHtCaWxsZWRQcm9kdWN0LCBCaWxsaW5nTW9kZWx9IGZyb20gJ0B2ZW5kYXN0YS9jb3JlL2JpbGxpbmcnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd2YS1oZWFkZXItY29udGFpbmVyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2hlYWRlci1jb250YWluZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9oZWFkZXItY29udGFpbmVyLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5cbmV4cG9ydCBjbGFzcyBWYUhlYWRlckNvbnRhaW5lckNvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGljb25Vcmw6IHN0cmluZztcbiAgQElucHV0KCkgdGl0bGU6IHN0cmluZztcbiAgQElucHV0KCkgdGFnbGluZTogc3RyaW5nO1xuICBASW5wdXQoKSBwcmVyZXF1aXNpdGU6IHN0cmluZztcbiAgQElucHV0KCkgY2hpcExhYmVsczogc3RyaW5nW107XG4gIEBJbnB1dCgpIHByaWNpbmc6IFByaWNpbmc7XG4gIEBJbnB1dCgpIGJpbGxlZFByb2R1Y3Q6IEJpbGxlZFByb2R1Y3Q7XG4gIEBJbnB1dCgpIGxvYWRlZCA9IHRydWU7XG4gIEBJbnB1dCgpIGhhc1ZlcmlmaWVkQ29udHJhY3Q6IGJvb2xlYW47XG4gIEBJbnB1dCgpIHByaWNpbmdMYWJlbDogc3RyaW5nO1xuICBASW5wdXQoKSBwcmljaW5nQWN0aW9uTGFiZWw6IHN0cmluZztcbiAgQElucHV0KCkgcHJpY2luZ0FjdGlvbkVuYWJsZWQ6IGJvb2xlYW47XG4gIEBJbnB1dCgpIGFjdGlvbkVuYWJsZWQ6IGJvb2xlYW47XG4gIEBJbnB1dCgpIGFjdGlvbkxhYmVsOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHNob3dBY3Rpb246IGJvb2xlYW47XG4gIEBJbnB1dCgpIHNob3dQcmljaW5nOiBib29sZWFuO1xuICBASW5wdXQoKSBzaG93RW5hYmxlQWRkb24gPSBmYWxzZTtcbiAgQElucHV0KCkgcHJlcmVxdWlzaXRlTGFiZWw6IHN0cmluZztcbiAgQE91dHB1dCgpIHByZXJlcXVpc2l0ZVNlbGVjdGVkID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICBAT3V0cHV0KCkgYWN0aW9uU2VsZWN0ZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIEBPdXRwdXQoKSBwcmljaW5nQWN0aW9uU2VsZWN0ZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgb25BY3Rpb25TZWxlY3RlZCgpOiB2b2lkIHtcbiAgICB0aGlzLmFjdGlvblNlbGVjdGVkLmVtaXQoKTtcbiAgfVxuXG4gIG9uUHJlcmVxdWlzaXRlU2VsZWN0ZWQoKTogdm9pZCB7XG4gICAgdGhpcy5wcmVyZXF1aXNpdGVTZWxlY3RlZC5lbWl0KCk7XG4gIH1cblxuICBzaG93UHJpY2luZ01vZGVsKGJpbGxlZFByb2R1Y3Q6IEJpbGxlZFByb2R1Y3QpOiBib29sZWFuIHtcbiAgICByZXR1cm4gYmlsbGVkUHJvZHVjdCAmJiBbQmlsbGluZ01vZGVsLlRpZXJlZCwgQmlsbGluZ01vZGVsLlN0YWlyc3RlcF0uaW5jbHVkZXMoYmlsbGVkUHJvZHVjdC5iaWxsaW5nTW9kZWwpO1xuICB9XG5cbiAgZ2V0UHJpY2luZ01vZGVsVG9vbHRpcHMoYmlsbGluZ01vZGVsOiBCaWxsaW5nTW9kZWwpOiBzdHJpbmcge1xuICAgIHN3aXRjaCAoYmlsbGluZ01vZGVsKSB7XG4gICAgICBjYXNlIEJpbGxpbmdNb2RlbC5TdGFpcnN0ZXA6XG4gICAgICAgIHJldHVybiAnUHJpY2UgYXBwbGllcyBwZXIgdW5pdCB3aXRoaW4gYSByYW5nZSc7XG4gICAgICBjYXNlIEJpbGxpbmdNb2RlbC5UaWVyZWQ6XG4gICAgICAgIHJldHVybiAnUHJpY2UgYXBwbGllcyB0byBhbGwgdW5pdHMgb25jZSByYW5nZSBpcyBtZXQnO1xuICAgICAgZGVmYXVsdDpcbiAgICAgICAgcmV0dXJuICcnO1xuICAgIH1cbiAgfVxufVxuIl19