@vendasta/store/fesm5/vendasta-store.js

import { CommonModule } from '@angular/common';
import { Component, Input, NgModule, EventEmitter, Output, Injectable, ChangeDetectionStrategy, Pipe, ChangeDetectorRef, InjectionToken, Inject } from '@angular/core';
import { MatCardModule, MatButtonModule, MatIconModule, MatMenuModule, MatChipsModule, MatTooltipModule, MatCheckboxModule, MatExpansionModule, MatInputModule, MatOptionModule, MatProgressSpinnerModule, MatSelectModule, MatListModule as MatListModule$1, MatDividerModule } from '@angular/material';
import { ImageTransformationService, ImageTransformationModule } from '@vendasta/core/image-transformation';
import { VaIconModule, VaBadgeModule, VaSafeHtmlModule, VaListModule, VaImageGalleryModule, VaBreadcrumbsModule, CheckboxFilterField, FilterSection, Filters, TabbedFilterField, FilterService, UIKitModule } from '@vendasta/uikit';
import { __read, __spread, __extends, __assign, __values } from 'tslib';
import { DisplayPriceService, CoreSharedModule, formatDisplayPrice, formatBillingFrequency, Addon } from '@vendasta/core/shared';
import { BehaviorSubject, combineLatest, of, ReplaySubject, merge, zip } from 'rxjs';
import { TranslateService, TranslateModule } from '@ngx-translate/core';
import { map, switchMap, debounceTime, distinctUntilChanged, startWith, filter, take, skipWhile, shareReplay, tap } from 'rxjs/operators';
import { Validators, FormControl, FormGroup, FormArray, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatListModule } from '@angular/material/list';
import { VaFormsModule } from '@vendasta/forms';
import { BillingModel, buildBilledProductFromProductPricingAndAddon, BillingService, BillingModule } from '@vendasta/core/billing';
import { FieldType, Field, CustomField, AddonKey, CommonField } from '@vendasta/sales-orders';
import uuid from 'uuid/v4';
import { MatProgressSpinnerModule as MatProgressSpinnerModule$1 } from '@angular/material/progress-spinner';
import { isNullOrUndefined } from 'util';
import { Categories, Pricing as Pricing$1, Currency } from '@vendasta/core/marketplace-packages';
import { trigger, state, style, transition, animate } from '@angular/animations';

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/*tslint:disable*/
var En = /** @class */ (function () {
    function En() {
    }
    En.en = {
        "FRONTEND.STORE": {
            "TOTAL": "Total",
            "CONTACT_SALES": "Contact Sales",
            "FREE": "Free",
            "STARTING_AT": "Starting at",
            "ENABLED_UPPER": "ENABLED",
            "ENABLE_UPPER": "ENABLE",
            "MIN_TO_MAX": "{{minRange}} to {{maxRange}}",
            "PRODUCT_PRICING_WITH_FREQUENCY": "{{pricingTier}} accounts {{frequency}}",
            "COMMITMENT_WITH_RENEWAL": "*{{initial}} {{frequencyString}} minimum, renews for {{recurring}} {{frequencyString}} periods",
            "COMMITMENT": "${{initial}} ${{frequencyString}} commitment",
            "PRICING_FREQUENCIES": {
                "MONTH": "month",
                "YEAR": "year"
            },
            "REQUIRES_DESCRIPTOR": "(Requires {{requirementName}})",
            "ADMINISTRATIVE_QUESTIONS": "Administrative Questions",
            "AUTO_TITLE_TEXT": {
                "SOME_FIELDS_INVALID": "* Some fields are invalid and/or required but empty",
                "OPTIONAL_FIELDS_UNANSWERED": "Optional fields unanswered",
                "COMPLETE": "Complete"
            },
            "REQUIRES": "Requires",
            "ENABLED_WITH_PREREQUISITE": "Enabled with {{prerequisite}}",
            "PRICE_APPLIES_PER_UNIT": "Price applies per unit within a range",
            "PRICE_APPLIES_TO_ALL_UNITS": "Price applies to all units once range is met",
            "PRICING": "Pricing",
            "FAQS": "FAQs",
            "GALLERY": "Gallery",
            "FILES": "Files",
            "GET_IT_NOW": "Get It Now",
            "CONTAINS_NUM_ITEMS": "Contains {{itemCount}} items"
        }
    };
    return En;
}());
if (false) {
    /** @type {?} */
    En.en;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/*tslint:disable*/
var Cs = /** @class */ (function () {
    function Cs() {
    }
    Cs.cs = {
        "FRONTEND.STORE": {
            "TOTAL": "Celkem",
            "CONTACT_SALES": "Kontaktovat obchodního zástupce",
            "FREE": "Zdarma",
            "STARTING_AT": "Začíná na",
            "ENABLED_UPPER": "POVOLENO",
            "ENABLE_UPPER": "POVOLIT",
            "MIN_TO_MAX": "{{minRange}} až {{maxRange}}",
            "PRODUCT_PRICING_WITH_FREQUENCY": "{{pricingTier}} účtů za {{frequency}}",
            "COMMITMENT_WITH_RENEWAL": "*{{initial}} {{frequencyString}} minimum, obnovuje se na {{recurring}} {{frequencyString}}",
            "COMMITMENT": "Závazek {{initial}} {{frequencyString}}",
            "PRICING_FREQUENCIES": {
                "MONTH": "měsíč",
                "YEAR": "rok"
            },
            "REQUIRES_DESCRIPTOR": "(Vyžaduje {{requirementName}})",
            "ADMINISTRATIVE_QUESTIONS": "Administrativní otázky",
            "AUTO_TITLE_TEXT": {
                "SOME_FIELDS_INVALID": "* Některá pole jsou neplatná a/nebo povinná, ale prázdná",
                "OPTIONAL_FIELDS_UNANSWERED": "Volitelná pole nezodpovězena",
                "COMPLETE": "Kompletní"
            },
            "REQUIRES": "Vyžaduje",
            "ENABLED_WITH_PREREQUISITE": "Povoleno s {{prerequisite}}",
            "PRICE_APPLIES_PER_UNIT": "Cena platí za jednotku v rozsahu",
            "PRICE_APPLIES_TO_ALL_UNITS": "Cena se vztahuje na všechny jednotky, jakmile je dosaženo rozsahu",
            "PRICING": "Cena",
            "FAQS": "FAQ",
            "GALLERY": "Galerie",
            "FILES": "Soubory",
            "GET_IT_NOW": "Získat hned",
            "CONTAINS_NUM_ITEMS": "Obsahuje {{itemCount}} položek"
        }
    };
    return Cs;
}());
if (false) {
    /** @type {?} */
    Cs.cs;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPricingComponent = /** @class */ (function () {
    function VaPricingComponent(translateService, displayPriceService) {
        var _this = this;
        this.translateService = translateService;
        this.displayPriceService = displayPriceService;
        this.pricing = null;
        this.wrapFrequency = false;
        this.isAddon = false;
        this.hasVerifiedContract = false;
        this.highlightPrice = true;
        this.loaded = true;
        this.pricing$$ = new BehaviorSubject(null);
        this.billedProduct$$ = new BehaviorSubject(null);
        this.hasVerifiedContract$$ = new BehaviorSubject(false);
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
        this.isFree$ = combineLatest([this.pricing$, this.billedProduct$, this.hasVerifiedContract$]).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 3), pricing = _b[0], billedProduct = _b[1], hasVerifiedContract = _b[2];
            /** @type {?} */
            var isFreeHelper = (/**
             * @param {?} prices
             * @return {?}
             */
            function (prices) {
                return prices ? prices.some((/**
                 * @param {?} p
                 * @return {?}
                 */
                function (p) { return p.price === 0 || p.price === undefined; })) : false;
            });
            if (hasVerifiedContract && billedProduct) {
                return billedProduct.pricingTiers.length === 1 ? isFreeHelper(billedProduct.pricingTiers) : false;
            }
            return !!pricing && isFreeHelper(pricing.prices);
        })));
        this.shouldContactSales$ = combineLatest([this.pricing$, this.billedProduct$, this.hasVerifiedContract$]).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 3), pricing = _b[0], billedProduct = _b[1], hasVerifiedContract = _b[2];
            /** @type {?} */
            var nestedPricesIsContactSales = (/**
             * @param {?} prices
             * @return {?}
             */
            function (prices) {
                return prices && prices.length > 0 ? prices.some((/**
                 * @param {?} p
                 * @return {?}
                 */
                function (p) { return p.price === null || p.price < 0; })) : true;
            });
            if (hasVerifiedContract && billedProduct) {
                return nestedPricesIsContactSales(billedProduct.pricingTiers);
            }
            if (!pricing) {
                return true;
            }
            return nestedPricesIsContactSales(pricing.prices);
        })));
        this.isFlatPrice$ = this.billedProduct$.pipe(map((/**
         * @param {?} billedProduct
         * @return {?}
         */
        function (billedProduct) { return billedProduct.pricingTiers.length === 1; })));
        this.pricingTierData$ = this.billedProduct$.pipe(switchMap((/**
         * @param {?} billedProduct
         * @return {?}
         */
        function (billedProduct) {
            /** @type {?} */
            var pricingTierObservables = billedProduct.pricingTiers.map((/**
             * @param {?} pricingTier
             * @return {?}
             */
            function (pricingTier) {
                return combineLatest(of(pricingTier.isStartingPrice), _this.buildPricingTierString(pricingTier), _this.buildPricingTierForProduct(pricingTier, billedProduct.billingFrequency), _this.buildPricingTierForAddon(pricingTier), _this.buildPriceStringForTier(pricingTier, billedProduct.billingFrequency, pricingTier.isStartingPrice), _this.buildPriceStringForTier(pricingTier)).pipe(map((/**
                 * @param {?} __0
                 * @return {?}
                 */
                function (_a) {
                    var _b = __read(_a, 6), isStartingPrice = _b[0], pricingTierString = _b[1], pricingTierForProduct = _b[2], pricingTierForAddon = _b[3], priceStringForTier = _b[4], priceStringForTierWithoutFreq = _b[5];
                    return {
                        isStartingPrice: isStartingPrice,
                        pricingTierString: pricingTierString,
                        pricingTierForProduct: pricingTierForProduct,
                        pricingTierForAddon: pricingTierForAddon,
                        priceStringForTier: priceStringForTier,
                        priceStringForTierWithoutFreq: priceStringForTierWithoutFreq
                    };
                })));
            }));
            return combineLatest.apply(void 0, __spread(pricingTierObservables));
        })));
        this.priceData$ = this.pricing$.pipe(switchMap((/**
         * @param {?} pricing
         * @return {?}
         */
        function (pricing) {
            /** @type {?} */
            var priceObservables = pricing.prices.map((/**
             * @param {?} price
             * @return {?}
             */
            function (price) {
                return combineLatest(of(price.isStartingPrice), _this.buildPriceStringForPricing(price, pricing.currency, true, false), _this.buildPriceStringForPricing(price, pricing.currency, false, true), _this.buildFrequencyString(price.frequency)).pipe(map((/**
                 * @param {?} __0
                 * @return {?}
                 */
                function (_a) {
                    var _b = __read(_a, 4), isStartingPrice = _b[0], priceStringForPricingWithoutFrequency = _b[1], priceStringForPricingWithFrequency = _b[2], frequencyString = _b[3];
                    return {
                        isStartingPrice: isStartingPrice,
                        priceStringForPricingWithoutFrequency: priceStringForPricingWithoutFrequency,
                        priceStringForPricingWithFrequency: priceStringForPricingWithFrequency,
                        frequencyString: frequencyString
                    };
                })));
            }));
            return combineLatest.apply(void 0, __spread(priceObservables));
        })));
        this.commitmentMessage$ = this.buildCommitmentMessage();
    }
    Object.defineProperty(VaPricingComponent.prototype, "pricing$", {
        get: /**
         * @return {?}
         */
        function () {
            return this.pricing$$.asObservable();
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPricingComponent.prototype, "billedProduct$", {
        get: /**
         * @return {?}
         */
        function () {
            return this.billedProduct$$.asObservable();
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPricingComponent.prototype, "hasVerifiedContract$", {
        get: /**
         * @return {?}
         */
        function () {
            return this.hasVerifiedContract$$.asObservable();
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} changes
     * @return {?}
     */
    VaPricingComponent.prototype.ngOnChanges = /**
     * @param {?} changes
     * @return {?}
     */
    function (changes) {
        if (changes.hasOwnProperty('pricing')) {
            this.pricing$$.next(changes.pricing.currentValue);
        }
        if (changes.hasOwnProperty('billedProduct')) {
            this.billedProduct$$.next(changes.billedProduct.currentValue);
        }
        if (changes.hasOwnProperty('hasVerifiedContract')) {
            this.hasVerifiedContract$$.next(changes.hasVerifiedContract.currentValue);
        }
    };
    /**
     * @param {?} tier
     * @return {?}
     */
    VaPricingComponent.prototype.buildPricingTierString = /**
     * @param {?} tier
     * @return {?}
     */
    function (tier) {
        /** @type {?} */
        var max = String(tier.rangeMax);
        if (tier.rangeMax === -1) {
            max = '∞';
            if (tier.rangeMin === 0 || tier.rangeMin === 1) {
                return of('');
            }
        }
        return this.translateService.stream('FRONTEND.STORE.MIN_TO_MAX', { minRange: String(tier.rangeMin), maxRange: max });
    };
    /**
     * @param {?} tier
     * @param {?=} frequency
     * @return {?}
     */
    VaPricingComponent.prototype.buildPricingTierForProduct = /**
     * @param {?} tier
     * @param {?=} frequency
     * @return {?}
     */
    function (tier, frequency) {
        var _this = this;
        return combineLatest(this.buildPricingTierString(tier), this.buildFrequencyString(frequency)).pipe(switchMap((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), pricingTier = _b[0], formattedFrequency = _b[1];
            if (pricingTier) {
                return _this.translateService.stream('FRONTEND.STORE.PRODUCT_PRICING_WITH_FREQUENCY', {
                    pricingTier: pricingTier,
                    frequency: formattedFrequency
                });
            }
            return of(formattedFrequency);
        })));
    };
    /**
     * @param {?} tier
     * @return {?}
     */
    VaPricingComponent.prototype.buildPricingTierForAddon = /**
     * @param {?} tier
     * @return {?}
     */
    function (tier) {
        return this.buildPricingTierString(tier).pipe(map((/**
         * @param {?} pricingRange
         * @return {?}
         */
        function (pricingRange) { return pricingRange ? pricingRange : ''; })));
    };
    /**
     * @param {?} price
     * @param {?} currency
     * @param {?} excludeFrequency
     * @param {?} canIncludeStartingAtPrefix
     * @return {?}
     */
    VaPricingComponent.prototype.buildPriceStringForPricing = /**
     * @param {?} price
     * @param {?} currency
     * @param {?} excludeFrequency
     * @param {?} canIncludeStartingAtPrefix
     * @return {?}
     */
    function (price, currency, excludeFrequency, canIncludeStartingAtPrefix) {
        return this.displayPriceService.formatDisplayPrice(price.price, currency, (/** @type {?} */ ((excludeFrequency ? '' : price.frequency))), true, true, true, price.isStartingPrice && canIncludeStartingAtPrefix);
    };
    /**
     * @param {?} tier
     * @param {?=} frequency
     * @param {?=} isStartingPrice
     * @return {?}
     */
    VaPricingComponent.prototype.buildPriceStringForTier = /**
     * @param {?} tier
     * @param {?=} frequency
     * @param {?=} isStartingPrice
     * @return {?}
     */
    function (tier, frequency, isStartingPrice) {
        return this.displayPriceService.formatDisplayPrice(tier.price, this.billedProduct.currency, (/** @type {?} */ (frequency)), undefined, undefined, undefined, isStartingPrice);
    };
    /**
     * @param {?=} frequency
     * @return {?}
     */
    VaPricingComponent.prototype.buildFrequencyString = /**
     * @param {?=} frequency
     * @return {?}
     */
    function (frequency) {
        return this.displayPriceService.formatBillingFrequency(frequency);
    };
    /**
     * @return {?}
     */
    VaPricingComponent.prototype.buildCommitmentMessage = /**
     * @return {?}
     */
    function () {
        var _this = this;
        return combineLatest([
            this.translateService.stream('FRONTEND.STORE.PRICING_FREQUENCIES'),
            this.billedProduct$,
            this.pricing$,
            this.isFree$,
            this.shouldContactSales$
        ]).pipe(switchMap((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 5), frequencyTranslations = _b[0], billedProduct = _b[1], pricing = _b[2], isFree = _b[3], shouldContactSales = _b[4];
            /** @type {?} */
            var frequency = billedProduct ? billedProduct.billingFrequency.toString().toLowerCase() :
                pricing && pricing.prices.length > 0 ? pricing.prices[0].frequency.toLowerCase() : '';
            /** @type {?} */
            var frequencyString = '';
            if (frequency === 'yearly') {
                frequencyString = frequencyTranslations.YEAR;
            }
            else if (frequency === 'monthly') {
                frequencyString = frequencyTranslations.MONTH;
            }
            if (!frequencyString || isFree || shouldContactSales) {
                return of('');
            }
            if (billedProduct && billedProduct.commitment) {
                /** @type {?} */
                var initial = billedProduct.commitment.initial;
                /** @type {?} */
                var recurring = billedProduct.commitment.recurring;
                return _this.translateService.stream('FRONTEND.STORE.COMMITMENT_WITH_RENEWAL', {
                    initial: initial,
                    frequencyString: frequencyString,
                    recurring: recurring,
                });
            }
            return of('');
        })));
    };
    VaPricingComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-pricing',
                    template: "<ng-container *ngIf=\"highlightPrice\">\n  <highlight-pricing [pricing]=\"pricing\"\n                     [billedProduct]=\"billedProduct\"\n                     [highlightPrice]=\"highlightPrice\"\n                     [isAddon]=\"isAddon\"\n                     [hasVerifiedContract]=\"hasVerifiedContract\"\n                     [wrapFrequency]=\"wrapFrequency\"\n                     [loaded]=\"loaded\">\n  </highlight-pricing>\n</ng-container>\n<ng-container *ngIf=\"!highlightPrice\">\n  <table-pricing [pricing]=\"pricing\"\n                 [highlightPrice]=\"highlightPrice\"\n                 [billedProduct]=\"billedProduct\"\n                 [hasVerifiedContract]=\"hasVerifiedContract\"\n                 [loaded]=\"loaded\">\n  </table-pricing>\n</ng-container>\n",
                    styles: [""]
                }] }
    ];
    /** @nocollapse */
    VaPricingComponent.ctorParameters = function () { return [
        { type: TranslateService },
        { type: DisplayPriceService }
    ]; };
    VaPricingComponent.propDecorators = {
        pricing: [{ type: Input }],
        billedProduct: [{ type: Input }],
        wrapFrequency: [{ type: Input }],
        isAddon: [{ type: Input }],
        hasVerifiedContract: [{ type: Input }],
        highlightPrice: [{ type: Input }],
        loaded: [{ type: Input }]
    };
    return VaPricingComponent;
}());
if (false) {
    /** @type {?} */
    VaPricingComponent.prototype.pricing;
    /** @type {?} */
    VaPricingComponent.prototype.billedProduct;
    /** @type {?} */
    VaPricingComponent.prototype.wrapFrequency;
    /** @type {?} */
    VaPricingComponent.prototype.isAddon;
    /** @type {?} */
    VaPricingComponent.prototype.hasVerifiedContract;
    /** @type {?} */
    VaPricingComponent.prototype.highlightPrice;
    /** @type {?} */
    VaPricingComponent.prototype.loaded;
    /** @type {?} */
    VaPricingComponent.prototype.pricing$$;
    /** @type {?} */
    VaPricingComponent.prototype.billedProduct$$;
    /** @type {?} */
    VaPricingComponent.prototype.hasVerifiedContract$$;
    /** @type {?} */
    VaPricingComponent.prototype.isFree$;
    /** @type {?} */
    VaPricingComponent.prototype.shouldContactSales$;
    /** @type {?} */
    VaPricingComponent.prototype.isFlatPrice$;
    /** @type {?} */
    VaPricingComponent.prototype.pricingTierData$;
    /** @type {?} */
    VaPricingComponent.prototype.priceData$;
    /** @type {?} */
    VaPricingComponent.prototype.commitmentMessage$;
    /**
     * @type {?}
     * @private
     */
    VaPricingComponent.prototype.translateService;
    /**
     * @type {?}
     * @private
     */
    VaPricingComponent.prototype.displayPriceService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var HighlightPricingComponent = /** @class */ (function (_super) {
    __extends(HighlightPricingComponent, _super);
    function HighlightPricingComponent() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    HighlightPricingComponent.decorators = [
        { type: Component, args: [{
                    selector: 'highlight-pricing',
                    template: "<ng-container *ngIf=\"loaded; else loading\">\n    <div class=\"no-price\" *ngIf=\"shouldContactSales$ | async; else dontContactSales\">\n        {{ 'FRONTEND.STORE.CONTACT_SALES' | translate }}\n    </div>\n    <ng-template #dontContactSales>\n        <div class=\"no-price\" *ngIf=\"isFree$ | async; else notFree\">\n            <b>{{ 'FRONTEND.STORE.FREE' | translate }}</b>\n        </div>\n        <ng-template #notFree>\n            <ng-container *ngIf=\"!isAddon\">\n                <ng-container *ngIf=\"hasVerifiedContract && billedProduct; else usePricing\">\n                    <div *ngFor=\"let tier of pricingTierData$ | async\" class=\"price-box\">\n                        <span>\n                            <span *ngIf=\"tier.isStartingPrice\" class=\"starting-at\">{{ 'FRONTEND.STORE.STARTING_AT' | translate }}</span>\n                            <b class=\"price-number\">{{ tier.priceStringForTierWithoutFreq }}</b>\n                        </span>\n                        <span class=\"tier-billing-freq\" [ngClass]=\"{'va-wrap': wrapFrequency}\">\n                            {{ tier.pricingTierForProduct }}\n                        </span>\n                    </div>\n                </ng-container>\n                <ng-template #usePricing>\n                    <ng-container *ngIf=\"pricing?.prices\">\n                        <div *ngFor=\"let price of priceData$ | async; let i = index\" class=\"price-box\">\n                            <span>\n                              <span *ngIf=\"price.isStartingPrice\" class=\"starting-at\">{{ 'FRONTEND.STORE.STARTING_AT' | translate }}</span>\n                              <b class=\"price-number\">\n                                <ng-container *ngIf=\"i == 1\">+</ng-container>\n                                {{ price.priceStringForPricingWithoutFrequency }}\n                              </b>\n                            </span>\n                            <span *ngIf=\"price.frequencyString\" class=\"billing-freq\" [ngClass]=\"{'va-wrap': wrapFrequency}\">\n                                {{ price.frequencyString }}\n                            </span>\n                        </div>\n                    </ng-container>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"isAddon\">\n                <div *ngIf=\"hasVerifiedContract && billedProduct; else useAddonPricing\">\n                    <div *ngFor=\"let tier of pricingTierData$ | async\" class=\"price-box\">\n                        <span class=\"addon-billing-freq\">\n                            {{ tier.pricingTierForAddon }}\n                        </span>\n                        <span>\n                            <span *ngIf=\"tier.isStartingPrice\" class=\"starting-at\">{{ 'FRONTEND.STORE.STARTING_AT' | translate }}</span>\n                            <b class=\"price-number\">\n                                {{ tier.priceStringForTier }}\n                            </b>\n                        </span>\n                    </div>\n                </div>\n                <ng-template #useAddonPricing>\n                    <div class=\"price-box\">\n                        <span *ngIf=\"pricing?.prices[0].frequency\" class=\"addon-billing-freq\">\n                            {{ (priceData$ | async)[0]?.frequencyString }}\n                        </span>\n                        <span>\n                          <span *ngIf=\"pricing?.prices[0]?.isStartingPrice\" class=\"starting-at\">\n                            {{ 'FRONTEND.STORE.STARTING_AT' | translate }}\n                          </span>\n                          <b class=\"price-number\">\n                            {{ (priceData$ | async)[0]?.priceStringForPricingWithoutFrequency }}\n                          </b>\n                        </span>\n                    </div>\n                </ng-template>\n            </ng-container>\n          <div class=\"commitment\" *ngIf=\"billedProduct && billedProduct.commitment && billedProduct.commitment.initial > 1\">\n            {{ commitmentMessage$ | async }}\n          </div>\n        </ng-template>\n    </ng-template>\n</ng-container>\n<ng-template #loading>\n    <div class=\"stencil-pricing stencil-shimmer\"></div>\n</ng-template>\n",
                    styles: [":host{color:#9e9e9e}.starting-at{margin-right:5px}.price-box{display:-webkit-box;display:flex;-webkit-box-align:baseline;align-items:baseline;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;flex-direction:row-reverse}.no-price{text-align:center}b{color:#212121;font-size:20px}@media screen and (max-width:600px){.no-price,.price-box,b{font-size:16px}}.billing-freq{text-transform:capitalize;-webkit-box-flex:1;flex:1}.tier-billing-freq{-webkit-box-flex:1;flex:1}.addon-billing-freq{padding-left:5px}.va-wrap{display:block}.stencil-pricing{height:1em}.commitment{color:#9e9e9e;font-size:12px;font-style:italic}"]
                }] }
    ];
    return HighlightPricingComponent;
}(VaPricingComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var TablePricingComponent = /** @class */ (function (_super) {
    __extends(TablePricingComponent, _super);
    function TablePricingComponent() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    TablePricingComponent.decorators = [
        { type: Component, args: [{
                    selector: 'table-pricing',
                    template: "<ng-container *ngIf=\"loaded; else loading\">\n    <div *ngIf=\"hasVerifiedContract && billedProduct; else usePricing\">\n        <div class=\"price-container\" *ngIf=\"isFlatPrice$ | async; else notFlatPrice\">\n            <div class=\"price\">\n                {{ (pricingTierData$ | async)[0]?.priceStringForTier }}\n            </div>\n        </div>\n        <ng-template #notFlatPrice>\n            <div class=\"price-container--tiered\" *ngIf=\"!(isFlatPrice$ | async)\">\n                <div class=\"pricing-tier\" *ngFor=\"let tier of pricingTierData$ | async\">\n                    <div class=\"pricing-tier__range\">{{ tier.pricingTierString }}</div>\n                    <div class=\"pricing-tier__price\">\n                        {{ tier.priceStringForTier }}\n                    </div>\n                </div>\n            </div>\n        </ng-template>\n        <div class=\"commitment\" *ngIf=\"billedProduct && billedProduct.commitment && billedProduct.commitment.initial > 1\">\n          {{ commitmentMessage$ | async }}\n        </div>\n    </div>\n    <ng-template #usePricing>\n        <div class=\"gray-font\">\n            <ng-container *ngIf=\"shouldContactSales$ | async; else dontContactSales\">\n                {{ 'FRONTEND.STORE.CONTACT_SALES' | translate }}\n            </ng-container>\n            <ng-template #dontContactSales>\n                <ng-container *ngIf=\"isFree$ | async; else notFree\">\n                    {{ 'FRONTEND.STORE.FREE' | translate }}\n                </ng-container>\n                <ng-template #notFree>\n                  {{ (priceData$ | async)[0].priceStringForPricingWithFrequency }}\n                  <div class=\"commitment\" *ngIf=\"billedProduct && billedProduct.commitment && billedProduct.commitment.initial > 1\">\n                    {{ commitmentMessage$ | async }}\n                  </div>\n                </ng-template>\n            </ng-template>\n        </div>\n    </ng-template>\n</ng-container>\n<ng-template #loading>\n    <div class=\"stencil-pricing stencil-shimmer\"></div>\n</ng-template>\n",
                    styles: [":host{color:#616161}.price-container--tiered{font-size:12px;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;display:-webkit-box;display:flex;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.price-container--tiered .pricing-tier{border-bottom:1px solid #e0e0e0;padding:5px 0;display:-webkit-box;display:flex}.price-container--tiered .pricing-tier:first-child{padding-top:0}.price-container--tiered .pricing-tier:last-child{padding-bottom:0;border-bottom:none}.price-container--tiered .pricing-tier .pricing-tier__range{padding-right:20px;-webkit-box-flex:1;flex:1}.stencil-pricing{height:1em}.commitment{color:#9e9e9e;font-size:12px;font-style:italic}"]
                }] }
    ];
    return TablePricingComponent;
}(VaPricingComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPricingModule = /** @class */ (function () {
    function VaPricingModule() {
    }
    VaPricingModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        CoreSharedModule,
                        TranslateModule
                    ],
                    declarations: [VaPricingComponent, HighlightPricingComponent, TablePricingComponent],
                    exports: [VaPricingComponent]
                },] }
    ];
    return VaPricingModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var StoreCardComponent = /** @class */ (function () {
    function StoreCardComponent(imageTransformationService, translateService) {
        this.imageTransformationService = imageTransformationService;
        this.translateService = translateService;
        this.purchasedClicked = new EventEmitter();
        this.cardClicked = new EventEmitter();
        this.descriptionClicked = new EventEmitter();
        this.bannerClicked = new EventEmitter();
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    /**
     * @return {?}
     */
    StoreCardComponent.prototype.getBannerColorForName = /**
     * @return {?}
     */
    function () {
        // determine an icon color for a product with no icon by using the product name
        /** @type {?} */
        var COLOR_CODES = [
            '#EF5350', '#42A5F5', '#66BB6A', '#FFA726', '#AB47BC', '#FFCA28', '#EC407A', '#26C6DA',
            '#FF7B57'
        ];
        /** @type {?} */
        var nameSum = 0;
        /** @type {?} */
        var defaultColor = '#808080';
        if (!this.item.name) {
            return defaultColor;
        }
        for (var i = 0; i < this.item.name.length; i++) {
            nameSum += this.item.name[i].charCodeAt(0);
        }
        /** @type {?} */
        var index = nameSum % COLOR_CODES.length;
        return COLOR_CODES[index];
    };
    /**
     * @param {?} imageUrl
     * @return {?}
     */
    StoreCardComponent.prototype.getSrcsetHeaderUrls = /**
     * @param {?} imageUrl
     * @return {?}
     */
    function (imageUrl) {
        return this.imageTransformationService.getSrcSetForImage(imageUrl, [680, 1360, 2720]);
    };
    StoreCardComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-store-card',
                    template: "\n<mat-card class=\"hover-card\" *ngIf=\"item\" (click)=\"cardClicked.emit(item)\">\n<div class=\"hover-area\">\n  <div class=\"product-banner\" (click)=\"bannerClicked.emit(item)\"\n  [style.background-color]=\"item.headerImageUrl ? '': getBannerColorForName()\">\n    <img class=\"img-container\" *ngIf=\"item.headerImageUrl\"\n         [src]=\"item.headerImageUrl\" [srcset]=\"getSrcsetHeaderUrls(item.headerImageUrl)\">\n  </div>\n\n  <div class=\"description\" (click)=\"descriptionClicked.emit(item)\">\n    <mat-card-header>\n      <va-icon mat-card-avatar [diameter]=\"40\" [name]=\"item.name\" [iconUrl]=\"item.iconUrl\"></va-icon>\n      <mat-card-title>{{item.name}}</mat-card-title>\n      <mat-card-subtitle>\n        <ng-container *ngIf=\"item.pricing; else formatted\">\n          <va-pricing [pricing]=\"item.pricing\"\n                      [highlightPrice]=\"false\"></va-pricing>\n        </ng-container>\n        <ng-template #formatted>{{item.formattedPrice}}</ng-template>\n      </mat-card-subtitle>\n    </mat-card-header>\n    <mat-card-content> {{ item.tagline }}\n    </mat-card-content>\n  </div>\n\n  <button *ngIf=\"item.purchased !== undefined\"\n    mat-button color=\"primary\" class=\"enabled-indicator\" (click)=\"purchasedClicked.emit(item)\" [disabled]=\"item.purchased\">\n    <i *ngIf=\"!item.purchased\" class=\"material-icons\">add</i>\n    <i *ngIf=\"item.purchased\" class=\"material-icons\" style=\"color: #39B74A\">check</i>\n    <span>{{ (item.purchased ? 'FRONTEND.STORE.ENABLED_UPPER' : 'FRONTEND.STORE.ENABLE_UPPER') | translate }}</span>\n  </button>\n  </div>\n</mat-card>\n    ",
                    styles: [":host{position:relative}::ng-deep .mat-card-header-text{width:100%}mat-card.hover-card{overflow:hidden;padding:0;margin-bottom:0}mat-card.hover-card mat-card-subtitle,mat-card.hover-card mat-card-title{margin:0 80px 0 0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}mat-card.hover-card mat-card-subtitle{font-size:12px;margin-top:4px}.hover-area{position:relative;cursor:pointer}.product-banner{max-height:133px;overflow:hidden;display:-webkit-box;display:flex;width:100%;height:100px;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center}.product-banner img{max-width:100%}@media screen and (min-width:480px){.hover-area{padding-top:55%}.hover-area:hover .description{top:0}.hover-area:hover .enabled-indicator span{width:70px}.product-banner{max-height:none;position:absolute;height:60%;top:0}}.description{box-sizing:border-box;padding:10px 16px 0;overflow:hidden;background:#fff;color:#212121;-webkit-transition:.3s;transition:.3s}.description:after{content:'';display:block;width:100%;height:40%;position:absolute;bottom:0;left:0;background:-webkit-gradient(linear,left top,left bottom,color-stop(40%,rgba(255,255,255,0)),color-stop(70%,#fff));background:linear-gradient(rgba(255,255,255,0) 40%,#fff 70%)}mat-card-header{box-sizing:border-box;padding-bottom:16px;margin:0;height:40%;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}mat-card-content{min-height:40px;max-height:80px;padding:16px;margin:0 -16px;border-top:1px solid #e0e0e0;font-size:12px}.enabled-indicator{position:absolute;right:8px;bottom:8px}.enabled-indicator span{display:inline-block;width:70px;overflow:hidden;-webkit-transition:.3s;transition:.3s}@media screen and (min-width:480px){.description{position:absolute;top:60%;width:100%;height:100%}.description:after{height:70%}mat-card-content{min-height:0;max-height:none}.enabled-indicator span{width:0}}button[mat-button]{padding:0 8px;min-width:0}mat-card-actions{position:relative;padding:8px!important;margin:0!important;text-align:right;border-top:1px solid #e0e0e0;background-color:#fff;color:#212121}.status{font-size:14px}.img-container{height:100%;width:100%}"]
                }] }
    ];
    /** @nocollapse */
    StoreCardComponent.ctorParameters = function () { return [
        { type: ImageTransformationService },
        { type: TranslateService }
    ]; };
    StoreCardComponent.propDecorators = {
        item: [{ type: Input }],
        purchasedClicked: [{ type: Output }],
        cardClicked: [{ type: Output }],
        descriptionClicked: [{ type: Output }],
        bannerClicked: [{ type: Output }]
    };
    return StoreCardComponent;
}());
if (false) {
    /** @type {?} */
    StoreCardComponent.prototype.item;
    /** @type {?} */
    StoreCardComponent.prototype.purchasedClicked;
    /** @type {?} */
    StoreCardComponent.prototype.cardClicked;
    /** @type {?} */
    StoreCardComponent.prototype.descriptionClicked;
    /** @type {?} */
    StoreCardComponent.prototype.bannerClicked;
    /**
     * @type {?}
     * @private
     */
    StoreCardComponent.prototype.imageTransformationService;
    /**
     * @type {?}
     * @private
     */
    StoreCardComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var StoreCardModule = /** @class */ (function () {
    function StoreCardModule() {
    }
    StoreCardModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        VaIconModule,
                        MatCardModule,
                        MatButtonModule,
                        MatIconModule,
                        MatMenuModule,
                        ImageTransformationModule,
                        VaPricingModule,
                        TranslateModule
                    ],
                    declarations: [StoreCardComponent],
                    exports: [StoreCardComponent]
                },] }
    ];
    return StoreCardModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var StoreComponent = /** @class */ (function () {
    function StoreComponent() {
        this.items = [];
        this.searchable = true;
        this.itemClicked = new EventEmitter();
    }
    Object.defineProperty(StoreComponent.prototype, "filteredItems", {
        get: /**
         * @return {?}
         */
        function () {
            var _this = this;
            if (this.filterTerm) {
                return this.items.filter((/**
                 * @param {?} pkg
                 * @return {?}
                 */
                function (pkg) { return pkg.name.toLowerCase().indexOf(_this.filterTerm.toLowerCase()) !== -1; }));
            }
            return this.items;
        },
        enumerable: true,
        configurable: true
    });
    StoreComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-store',
                    template: "\n  <div class=\"toolbar\">\n  <div *ngIf=\"searchable\" class=\"table-controls-row\">\n      <va-search-box (update)=\"filterTerm = $event\"></va-search-box>\n  </div>\n  </div>\n  <div class=\"row row-gutters\">\n      <div *ngFor=\"let item of filteredItems\" class=\"col-flex\">\n          <va-store-card [item]=\"item\" (cardClicked)=\"this.itemClicked.emit(item)\"></va-store-card>\n      </div>\n  </div>\n  ",
                    styles: [".flex-row{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.toolbar{padding:0;background-color:#fff;color:#616161}.toolbar .disabled{cursor:default}.toolbar .disabled mat-icon{cursor:default;color:#9e9e9e}.toolbar va-search-box{margin-right:10px;width:350px}.toolbar .table-controls-row{padding:0 10px 10px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}.toolbar .table-controls-row:first-of-type{padding-top:10px}.top-border{border-top:1px solid #fff}.selected{background-color:#fff}.row{display:-webkit-box;display:flex;flex-wrap:wrap}.row+.row-gutters{margin-top:0}.row-gutters{margin-top:-20px;margin-left:-20px}.row-gutters>.col-flex{padding-top:20px;padding-left:20px}.col-flex{position:relative;max-width:100%;box-sizing:border-box;-webkit-box-flex:0;flex:0 0 auto;width:100%}@media screen and (min-width:480px){.col-flex{width:50%}}@media screen and (min-width:1200px){.col-flex{width:33.333333%}}"]
                }] }
    ];
    StoreComponent.propDecorators = {
        items: [{ type: Input }],
        searchable: [{ type: Input }],
        itemClicked: [{ type: Output }]
    };
    return StoreComponent;
}());
if (false) {
    /** @type {?} */
    StoreComponent.prototype.items;
    /** @type {?} */
    StoreComponent.prototype.searchable;
    /** @type {?} */
    StoreComponent.prototype.itemClicked;
    /** @type {?} */
    StoreComponent.prototype.filterTerm;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DropDownFormSectionComponent = /** @class */ (function () {
    function DropDownFormSectionComponent(translateService) {
        this.translateService = translateService;
        this.startOpen = false;
        this.displayAutoTitle = false;
        this.titleText = '';
        this.displayAutoDescription = true;
        this.descriptionText = '';
        this.editingHint = '';
        this.expandable = true;
        this.autoDescriptionText = '';
        this.iconName = 'help_outline';
        this.subscriptions = [];
        this.uniqueIndex = 1;
        this.autoTitleText = '';
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    /**
     * @return {?}
     */
    DropDownFormSectionComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        /** @type {?} */
        var allFieldsHidden = this.fields.reduce((/**
         * @param {?} p
         * @param {?} c
         * @param {?} i
         * @param {?} a
         * @return {?}
         */
        function (p, c, i, a) { return p && c.hidden; }), true);
        if (allFieldsHidden) {
            this.expandable = false;
        }
        while (this.parentForm.controls.hasOwnProperty(this.titleText + this.uniqueIndex)) {
            this.uniqueIndex += 1;
        }
        this.parentForm.addControl(this.titleText + this.uniqueIndex, this.toFormGroup(this.fields));
        /** @type {?} */
        var form = (/** @type {?} */ (this.parentForm.controls[this.titleText + this.uniqueIndex]));
        for (var key in form.controls) {
            if (form.controls.hasOwnProperty(key)) {
                if (this.prepopulatedData != null && this.prepopulatedData.hasOwnProperty(key)) {
                    form.controls[key].setValue(this.prepopulatedData[key]);
                }
            }
        }
        this.subscriptions.push(combineLatest([
            form.statusChanges,
            this.translateService.stream('FRONTEND.STORE.AUTO_TITLE_TEXT')
        ]).subscribe((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), change = _b[0], autoTitleText = _b[1];
            /** @type {?} */
            var missingFields = false;
            for (var control in form.controls) {
                if (!form.controls[control].value || (form.controls[control].value.constructor === Array && !form.controls[control].value[0])) {
                    _this.iconName = 'help_outline';
                    missingFields = true;
                    if (change === 'INVALID') {
                        _this.autoTitleText = autoTitleText.SOME_FIELDS_INVALID;
                        if (form.controls[control].dirty || form.controls[control].touched) {
                            _this.iconName = 'warning';
                            break;
                        }
                    }
                    else {
                        _this.autoTitleText = autoTitleText.OPTIONAL_FIELDS_UNANSWERED;
                    }
                }
            }
            if (!missingFields) {
                _this.iconName = 'check_circle';
                _this.autoTitleText = autoTitleText.COMPLETE;
            }
        })));
        if (this.displayAutoDescription) {
            this.subscriptions.push(form.valueChanges.subscribe((/**
             * @param {?} changes
             * @return {?}
             */
            function (changes) {
                /** @type {?} */
                var description = '';
                for (var key in changes) {
                    if (changes.hasOwnProperty(key) && changes[key] != null && changes[key].length > 0) {
                        if (changes[key][0].name) {
                            for (var fileKey in changes[key]) {
                                if (changes[key][fileKey] != null) {
                                    description += changes[key][fileKey].name;
                                    description += ', ';
                                }
                            }
                        }
                        else {
                            description += changes[key];
                            description += ', ';
                        }
                    }
                }
                _this.autoDescriptionText = description.substring(0, description.length - 2);
            })));
        }
        form.updateValueAndValidity({ onlySelf: false, emitEvent: true });
    };
    /**
     * @param {?} formFields
     * @return {?}
     */
    DropDownFormSectionComponent.prototype.toFormGroup = /**
     * @param {?} formFields
     * @return {?}
     */
    function (formFields) {
        var _this = this;
        /** @type {?} */
        var group = {};
        formFields.forEach((/**
         * @param {?} field
         * @return {?}
         */
        function (field) {
            /** @type {?} */
            var validations;
            if (!field.required || field.hidden) {
                validations = field.validator;
            }
            else if (field.controlType === 'checkbox') {
                validations = [Validators.requiredTrue, field.validator];
            }
            else {
                validations = [Validators.required, field.validator];
            }
            /** @type {?} */
            var formControl = new FormControl({ value: field.value, disabled: field.disabled }, validations);
            group[field.id] = formControl;
            _this.subscriptions.push(formControl.valueChanges.subscribe((/**
             * @param {?} value
             * @return {?}
             */
            function (value) { return (field.value = value); })));
        }));
        return new FormGroup(group);
    };
    /**
     * @return {?}
     */
    DropDownFormSectionComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.subscriptions.forEach((/**
         * @param {?} subscription
         * @return {?}
         */
        function (subscription) { return subscription.unsubscribe(); }));
    };
    DropDownFormSectionComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-dropdown-form-section',
                    template: "\n    <mat-expansion-panel *ngIf=\"expandable || expandable == undefined\" [expanded]=\"startOpen\">\n      <mat-expansion-panel-header [collapsedHeight]=\"'*'\" [expandedHeight]=\"'*'\">\n        <div class=\"dropdown-form-header\">\n          <mat-icon\n            [ngClass]=\"{invalid: iconName=='warning', valid: iconName=='check_circle', question: iconName=='help_outline'}\">\n            {{ iconName }}\n          </mat-icon>\n          <mat-panel-title *ngIf=\"!displayAutoTitle\">\n            {{ titleText }}\n          </mat-panel-title>\n          <mat-panel-title *ngIf=\"displayAutoTitle\"\n                           [ngClass]=\"{valid: iconName=='check_circle', invalid: iconName=='warning'}\">\n            <div class=\"title\"> {{ titleText }}</div>\n            <div *ngIf=\"titleText && autoTitleText\"> &nbsp;</div>\n            <div><ng-container><i> {{autoTitleText}} </i></ng-container></div>\n          </mat-panel-title>\n          <mat-panel-description *ngIf=\"displayAutoDescription\" [ngClass]=\"{invalid: iconName=='warning'}\">\n            {{ autoDescriptionText }}\n          </mat-panel-description>\n          <mat-panel-description *ngIf=\"!displayAutoDescription\" [ngClass]=\"{invalid: iconName=='warning'}\">\n            <i> {{descriptionText}} </i>\n          </mat-panel-description>\n        </div>\n      </mat-expansion-panel-header>\n      <div class=\"expansion-panel-body\">\n        <va-field *ngFor=\"let field of fields\" [field]=\"field\"\n                  [form]=\"parentForm.controls[titleText + uniqueIndex]\"\n        ></va-field>\n        <p *ngIf=\"editingHint != ''\" class=\"editing-hint\"><i>{{ editingHint }}</i></p>\n      </div>\n    </mat-expansion-panel>\n  ",
                    styles: [":host-context(va-dropdown-form-section){font-size:14px}:host-context(va-dropdown-form-section) .expansion-panel-body{margin-top:-10px;display:block}@media screen and (min-width:600px){:host-context(va-dropdown-form-section) .expansion-panel-body{width:60%}}.mat-expanded,.mat-expansion-panel{-webkit-transition:margin .4s;transition:margin .4s}mat-expansion-panel-header{min-height:48px;padding:12px 24px}.dropdown-form-header{width:90%;display:-webkit-box;display:flex}mat-panel-description{align-self:center;-webkit-box-flex:inherit;flex:inherit;display:initial;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}mat-panel-description.invalid{color:#c62828}mat-icon{margin-right:7px;-ms-grid-row-align:center;align-self:center}mat-icon.valid{color:#4caf50}mat-icon.invalid{color:#c62828}mat-icon.question{color:#9e9e9e}mat-panel-title{align-self:center;-webkit-box-flex:0;flex:none;margin-right:20px;display:-webkit-box;display:flex;max-width:100%}mat-panel-title div{display:-webkit-box;display:flex}mat-panel-title.valid{color:#4caf50}mat-panel-title.invalid{color:#c62828}.editing-hint{color:#9e9e9e}.title{color:#212121}.not-expandable-card{background:#fff;cursor:default;font-size:15px;display:-webkit-box;display:flex;height:48px;-webkit-box-align:center;align-items:center;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}.not-expandable-card .not-expandable-icon{margin-left:24px}.not-expandable-card .not-expandable-header{display:-webkit-box;display:flex}.not-expandable-card .not-expandable-description{margin-left:22px}.not-expandable-card .valid{color:#4caf50}"]
                }] }
    ];
    /** @nocollapse */
    DropDownFormSectionComponent.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    DropDownFormSectionComponent.propDecorators = {
        prepopulatedData: [{ type: Input }],
        startOpen: [{ type: Input }],
        parentForm: [{ type: Input }],
        displayAutoTitle: [{ type: Input }],
        titleText: [{ type: Input }],
        displayAutoDescription: [{ type: Input }],
        descriptionText: [{ type: Input }],
        fields: [{ type: Input }],
        editingHint: [{ type: Input }],
        expandable: [{ type: Input }]
    };
    return DropDownFormSectionComponent;
}());
if (false) {
    /** @type {?} */
    DropDownFormSectionComponent.prototype.prepopulatedData;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.startOpen;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.parentForm;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.displayAutoTitle;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.titleText;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.displayAutoDescription;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.descriptionText;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.fields;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.editingHint;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.expandable;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.autoDescriptionText;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.iconName;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.subscriptions;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.uniqueIndex;
    /** @type {?} */
    DropDownFormSectionComponent.prototype.autoTitleText;
    /**
     * @type {?}
     * @private
     */
    DropDownFormSectionComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var FieldComponent = /** @class */ (function () {
    function FieldComponent() {
    }
    Object.defineProperty(FieldComponent.prototype, "isValid", {
        get: /**
         * @return {?}
         */
        function () {
            return this.form.controls[this.field.id].valid || this.form.controls[this.field.id].pristine;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} field
     * @return {?}
     */
    FieldComponent.prototype.showCheckboxError = /**
     * @param {?} field
     * @return {?}
     */
    function (field) {
        return this.form.controls[field].errors && this.form.controls[field].errors.required && this.form.controls[field].touched;
    };
    FieldComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-field',
                    template: "<ng-container [ngSwitch]=\"field.controlType\" [formGroup]=\"form\">\n  <div *ngIf=\"!field.hidden\" [ngClass]=\"{'for-office-use-only': field.forOfficeUseOnly}\">\n    <span *ngIf=\"field.forOfficeUseOnly\" class=\"office-text\">*For Office Use Only</span>\n\n    <ng-container *ngSwitchCase=\"'dropdown'\">\n      <ng-container *ngIf=\"!field.allowMultiples\">\n        <mat-form-field class=\"form-field-container\">\n            <mat-select matInput [formControlName]=\"field.id\" [id]=\"field.id\" [placeholder]=\"field.getLabel()\">\n                  <mat-option *ngFor=\"let option of field.options\" [value]=\"option.value\">{{ option.label }}</mat-option>\n            </mat-select>\n            <mat-hint *ngIf=\"field.description\"> {{ field.description }} </mat-hint>\n        </mat-form-field>\n      </ng-container>\n      <ng-container *ngIf=\"field.allowMultiples\">\n        <va-input-tags class=\"form-field-container\" [id]=\"field.id\" [formControlName]=\"field.id\"\n          [placeholder]=\"field.getLabel()\"\n          [tooltip]=\"field.description\"\n          [required]=\"field.required\"\n          [options]=\"field.options\"\n          [allowDuplicates]=\"field.allowDuplicates\"\n          [maxFields]=\"field.maxChoices\">\n        </va-input-tags>\n      </ng-container>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'textbox'\">\n        <mat-form-field class=\"form-field-container\">\n            <span matPrefix *ngIf=\"field.prefix\"> {{ field.prefix}} &nbsp;</span>\n            <input matInput [type]=\"field.textboxType\" [id]=\"field.id\" [formControlName]=\"field.id\" [placeholder]=\"field.getLabel()\" [pattern]=\"field.regexValidator || ''\"\n                   [readonly]=\"field.displayOnly\" [ngClass]=\"{'display-only': field.displayOnly}\">\n            <span matSuffix *ngIf=\"field.suffix\"> &nbsp;{{ field.suffix }} </span>\n            <mat-hint *ngIf=\"field.description\"> {{ field.description }} </mat-hint>\n            <mat-error *ngIf=\"form.controls[field.id].hasError('pattern')\"> {{field.regexErrorMessage}} </mat-error>\n        </mat-form-field>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'checkbox'\">\n        <div class=\"form-field-container checkbox\">\n            <mat-checkbox [formControlName]=\"field.id\" [id]=\"field.id\" ngControlDefault></mat-checkbox>\n            <div class=\"checkbox-placeholder\"> {{field.label}}</div>\n            <mat-error *ngIf=\"showCheckboxError(field.id)\" class=\"checkboxError\"> *Required </mat-error>\n        </div>\n        <div class=\"checkbox-description\" *ngIf=\"field.description\">{{ field.description }}</div>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'textarea'\">\n        <mat-form-field class=\"form-field-container\">\n            <textarea matInput [formControlName]=\"field.id\" [placeholder]=\"field.getLabel()\" [id]=\"field.id\"></textarea>\n            <mat-hint *ngIf=\"field.description\"> {{ field.description }} </mat-hint>\n        </mat-form-field>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'file'\">\n        <div class=\"form-field-container\">\n            <file-group-uploader [uploadUrl]=\"field.uploadUrl\" [label]=\"field.getLabel()\" [description]=\"field.description\" [formGroup]=\"form\" [formControlName]=\"field.id\"\n                [numFiles]=\"field.numFiles\" class=\"form-field-container\"></file-group-uploader>\n        </div>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'vbcuser'\">\n        <mat-form-field class=\"form-field-container\">\n            <mat-select matInput [formControlName]=\"field.id\" [id]=\"field.id\" [placeholder]=\"field.getLabel()\">\n                <mat-option *ngFor=\"let option of field.options\" [value]=\"option.value\" [disabled]=\"option.disabled\">{{ option.label }}</mat-option>\n            </mat-select>\n            <mat-hint *ngIf=\"field.description\"> {{ field.description }} </mat-hint>\n        </mat-form-field>\n    </ng-container>\n  </div>\n</ng-container>\n",
                    styles: [".form-field-container{font-size:16px;width:100%;margin:10px 0}.checkbox{display:-webkit-box;display:flex;padding:5px 0;color:rgba(0,0,0,.54);margin-top:24px}.checkbox .checkbox-placeholder{margin-left:10px}.checkbox-description{margin-top:-14px;margin-left:32px;color:rgba(0,0,0,.54);font-size:12px}.for-office-use-only{position:relative}.office-text{font-size:8px;position:absolute;right:5px}.display-only{color:rgba(0,0,0,.38)}.checkboxError{padding-left:16px}"]
                }] }
    ];
    FieldComponent.propDecorators = {
        field: [{ type: Input }],
        form: [{ type: Input }]
    };
    return FieldComponent;
}());
if (false) {
    /** @type {?} */
    FieldComponent.prototype.field;
    /** @type {?} */
    FieldComponent.prototype.form;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var FieldService = /** @class */ (function () {
    function FieldService() {
    }
    /**
     * @param {?} field
     * @return {?}
     */
    FieldService.prototype.createFormControl = /**
     * @param {?} field
     * @return {?}
     */
    function (field) {
        if (field.required) {
            return new FormControl(field.value, Validators.required);
        }
        else {
            return new FormControl(field.value);
        }
    };
    /**
     * @param {?} formFields
     * @param {?} subscriptions
     * @return {?}
     */
    FieldService.prototype.toFormGroup = /**
     * @param {?} formFields
     * @param {?} subscriptions
     * @return {?}
     */
    function (formFields, subscriptions) {
        var _this = this;
        /** @type {?} */
        var group = {};
        formFields.forEach((/**
         * @param {?} field
         * @return {?}
         */
        function (field) {
            /** @type {?} */
            var formControl;
            if (field.controlType === 'checkbox') {
                formControl = new FormControl(field.value);
            }
            else {
                formControl = _this.createFormControl(field);
            }
            group[field.id] = formControl;
            if (subscriptions) {
                subscriptions.push(formControl.valueChanges.subscribe((/**
                 * @param {?} value
                 * @return {?}
                 */
                function (value) { return (field.value = value); })));
            }
        }));
        return new FormGroup(group);
    };
    FieldService.decorators = [
        { type: Injectable }
    ];
    return FieldService;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaHeaderContainerComponent = /** @class */ (function () {
    function VaHeaderContainerComponent(translateService) {
        this.translateService = translateService;
        this.loaded = true;
        this.showEnableAddon = false;
        this.prerequisiteSelected = new EventEmitter();
        this.actionSelected = new EventEmitter();
        this.primaryPricingActionSelected = new EventEmitter();
        this.pricingActionSelected = new EventEmitter();
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    /**
     * @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 this.translateService.stream('FRONTEND.STORE.PRICE_APPLIES_PER_UNIT');
            case BillingModel.Tiered:
                return this.translateService.stream('FRONTEND.STORE.PRICE_APPLIES_TO_ALL_UNITS');
            default:
                return of('');
        }
    };
    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\">{{ 'FRONTEND.STORE.REQUIRES' | translate }}</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          {{ 'FRONTEND.STORE.ENABLED_WITH_PREREQUISITE' | translate: {prerequisite: 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) | async\">({{ 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)=\"primaryPricingActionSelected.emit()\">{{ primaryPricingActionLabel }}</a>\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:-webkit-box;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:-webkit-box;display:flex;width:100%;padding:24px;-webkit-box-flex:1;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:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;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:-webkit-inline-box!important;display:inline-flex!important;color:#1e88e5;cursor:pointer;padding-top:5px}.pricing{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;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{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;margin:8px 0}.pricing .pricing-action-container mat-icon{vertical-align:middle;margin-right:6px}.pricing .pricing-action-container a{cursor:pointer;margin:5px 0}.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}"]
                }] }
    ];
    /** @nocollapse */
    VaHeaderContainerComponent.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    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 }],
        primaryPricingActionLabel: [{ 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 }],
        primaryPricingActionSelected: [{ type: Output }],
        pricingActionSelected: [{ type: Output }]
    };
    return 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.primaryPricingActionLabel;
    /** @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.primaryPricingActionSelected;
    /** @type {?} */
    VaHeaderContainerComponent.prototype.pricingActionSelected;
    /**
     * @type {?}
     * @private
     */
    VaHeaderContainerComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaHeaderContainerModule = /** @class */ (function () {
    function VaHeaderContainerModule() {
    }
    VaHeaderContainerModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        MatIconModule,
                        VaPricingModule,
                        VaIconModule,
                        MatChipsModule,
                        MatButtonModule,
                        MatTooltipModule,
                        TranslateModule
                    ],
                    declarations: [VaHeaderContainerComponent],
                    exports: [VaHeaderContainerComponent]
                },] }
    ];
    return VaHeaderContainerModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var OrderFormSectionData = /** @class */ (function () {
    function OrderFormSectionData() {
    }
    return OrderFormSectionData;
}());
if (false) {
    /** @type {?} */
    OrderFormSectionData.prototype.parentForm;
    /** @type {?} */
    OrderFormSectionData.prototype.titleText;
    /** @type {?} */
    OrderFormSectionData.prototype.subtitleText;
    /** @type {?} */
    OrderFormSectionData.prototype.descriptionText;
    /** @type {?} */
    OrderFormSectionData.prototype.iconUrl;
    /** @type {?} */
    OrderFormSectionData.prototype.primarySection;
    /** @type {?} */
    OrderFormSectionData.prototype.subsections;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var OrderFormSectionComponent = /** @class */ (function () {
    function OrderFormSectionComponent() {
    }
    /**
     * @return {?}
     */
    OrderFormSectionComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        // The first section should always be expanded.
        /** @type {?} */
        var topSection = this.getTopSection();
        if (topSection) {
            topSection.startOpen = true;
        }
    };
    /**
     * @return {?}
     */
    OrderFormSectionComponent.prototype.getTopSection = /**
     * @return {?}
     */
    function () {
        if (!this.data) {
            return null;
        }
        if (this.data.primarySection) {
            return this.data.primarySection;
        }
        if (this.data.subsections && this.data.subsections.length > 0) {
            return this.data.subsections[0];
        }
        return null;
    };
    OrderFormSectionComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-order-form-section',
                    template: "<div>\n  <mat-card class=\"va-order-form-section-header mat-card\">\n    <div class=\"product-overview\">\n      <div class=\"product-id\">\n        <va-icon [iconUrl]=\"data.iconUrl\" [name]=\"data.titleText\" [diameter]=\"45\"></va-icon>\n        <div class=\"product-id-text\">\n          <h1 class=\"product-title\">{{ data.titleText }}</h1>\n          <span *ngIf=\"data.subtitleText\" class=\"tagline\">{{ data.subtitleText }}</span>\n        </div>\n      </div>\n      <div class=\"description\" *ngIf=\"data.descriptionText\">\n        <span>{{ data.descriptionText }}</span>\n      </div>\n    </div>\n  </mat-card>\n  <va-dropdown-form-section class=\"va-primary-form-section\" *ngIf=\"data.primarySection\"\n                            [titleText]=\"data.primarySection.titleText\"\n                            [editingHint]=\"data.primarySection.editingHint\"\n                            [displayAutoDescription]=\"data.primarySection.displayAutoDescription\"\n                            [descriptionText]=\"data.primarySection.descriptionText\"\n                            [displayAutoTitle]=\"data.primarySection.displayAutoTitle\"\n                            [prepopulatedData]=\"data.primarySection.prepopulatedData\"\n                            [parentForm]=\"data.parentForm\"\n                            [fields]=\"data.primarySection.fields\"\n                            [startOpen]=\"data.primarySection.startOpen\"\n                            [expandable]=\"data.primarySection.expandable\">\n  </va-dropdown-form-section>\n  <ng-container *ngIf=\"data.subsections?.length > 0\">\n    <va-dropdown-form-section class=\"va-secondary-form-section\" *ngFor=\"let addon of data.subsections\"\n                              [titleText]=\"addon.titleText\"\n                              [editingHint]=\"addon.editingHint\"\n                              [displayAutoDescription]=\"addon.displayAutoDescription\"\n                              [descriptionText]=\"addon.descriptionText\"\n                              [displayAutoTitle]=\"addon.displayAutoTitle\"\n                              [prepopulatedData]=\"addon.prepopulatedData\"\n                              [parentForm]=\"data.parentForm\"\n                              [fields]=\"addon.fields\"\n                              [startOpen]=\"addon.startOpen\"\n                              [expandable]=\"addon.expandable\">\n    </va-dropdown-form-section>\n  </ng-container>\n  <ng-container *ngIf=\"!data.primarySection && !(data.subsections?.length > 0)\">\n    <mat-card class=\"not-expandable-card\">\n      <ng-content></ng-content>\n    </mat-card>\n  </ng-container>\n</div>\n",
                    styles: [":host{font-size:16px}mat-card.va-order-form-section-header{margin-bottom:0;border-bottom-color:#e0e0e0;border-bottom-width:1px;box-shadow:0 0 1px -2px rgba(0,0,0,.2),0 0 2px 0 rgba(0,0,0,.14),0 0 5px 0 rgba(0,0,0,.12)}.product-title{font-size:16px}va-mat-card{margin-bottom:24px}.product-overview{display:-webkit-box;display:flex;flex-wrap:wrap}.product-overview h1{margin:0;font-weight:700}.product-id{display:-webkit-box;display:flex;width:100%;-webkit-box-flex:1;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 .product-id-text{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center}.product-id span{display:block;overflow:hidden}.product-id .tagline{color:#616161;margin-top:8px;font-size:16px}@media screen and (min-width:600px){.product-id{width:66%;padding-right:16px}}.description{padding-top:16px;width:100%;color:#616161}"]
                }] }
    ];
    /** @nocollapse */
    OrderFormSectionComponent.ctorParameters = function () { return []; };
    OrderFormSectionComponent.propDecorators = {
        data: [{ type: Input }]
    };
    return OrderFormSectionComponent;
}());
if (false) {
    /** @type {?} */
    OrderFormSectionComponent.prototype.data;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DropDownFormSectionData = /** @class */ (function () {
    function DropDownFormSectionData() {
        /* tslint:disable */
        this.expandable = true;
        /* tslint:enable */
    }
    return DropDownFormSectionData;
}());
if (false) {
    /** @type {?} */
    DropDownFormSectionData.prototype.prepopulatedData;
    /** @type {?} */
    DropDownFormSectionData.prototype.startOpen;
    /** @type {?} */
    DropDownFormSectionData.prototype.parentForm;
    /** @type {?} */
    DropDownFormSectionData.prototype.displayAutoTitle;
    /** @type {?} */
    DropDownFormSectionData.prototype.titleText;
    /** @type {?} */
    DropDownFormSectionData.prototype.displayAutoDescription;
    /** @type {?} */
    DropDownFormSectionData.prototype.descriptionText;
    /** @type {?} */
    DropDownFormSectionData.prototype.fields;
    /** @type {?} */
    DropDownFormSectionData.prototype.editingHint;
    /** @type {?} */
    DropDownFormSectionData.prototype.expandable;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function OrderLabelsInterface() { }
if (false) {
    /** @type {?} */
    OrderLabelsInterface.prototype.commonForm;
}
/**
 * @record
 */
function OrderFormInterface() { }
if (false) {
    /** @type {?} */
    OrderFormInterface.prototype.appId;
    /** @type {?|undefined} */
    OrderFormInterface.prototype.addonId;
    /** @type {?|undefined} */
    OrderFormInterface.prototype.commonForm;
    /** @type {?|undefined} */
    OrderFormInterface.prototype.commonFormRequiredFields;
    /** @type {?|undefined} */
    OrderFormInterface.prototype.customFields;
}
/**
 * @record
 */
function IncludedCommonFormFieldsInterface() { }
if (false) {
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.businessName;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.businessAddress;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.businessPhoneNumber;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.businessAccountGroupId;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.businessWebsite;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.salespersonName;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.salespersonPhoneNumber;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.salespersonEmail;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.contactName;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.contactPhoneNumber;
    /** @type {?|undefined} */
    IncludedCommonFormFieldsInterface.prototype.contactEmail;
}
/**
 * @record
 */
function CommonFormSectionInterface() { }
if (false) {
    /** @type {?} */
    CommonFormSectionInterface.prototype.fields;
    /** @type {?|undefined} */
    CommonFormSectionInterface.prototype.sectionName;
    /** @type {?|undefined} */
    CommonFormSectionInterface.prototype.populatedData;
}
/**
 * @record
 */
function AddonKeyInterface() { }
if (false) {
    /** @type {?|undefined} */
    AddonKeyInterface.prototype.addonId;
    /** @type {?|undefined} */
    AddonKeyInterface.prototype.appId;
}
/**
 * @record
 */
function CommonFormFieldInterface() { }
if (false) {
    /** @type {?|undefined} */
    CommonFormFieldInterface.prototype.productIds;
    /** @type {?|undefined} */
    CommonFormFieldInterface.prototype.addonKeys;
}
/**
 * @record
 */
function CommonFieldIdsInterface() { }
if (false) {
    /** @type {?} */
    CommonFieldIdsInterface.prototype.fieldId;
    /** @type {?} */
    CommonFieldIdsInterface.prototype.required;
}
/**
 * @record
 */
function CommonFormData() { }
if (false) {
    /** @type {?|undefined} */
    CommonFormData.prototype.contact_email;
    /** @type {?|undefined} */
    CommonFormData.prototype.contact_name;
    /** @type {?|undefined} */
    CommonFormData.prototype.contact_phone_number;
    /** @type {?|undefined} */
    CommonFormData.prototype.business_account_group_id;
    /** @type {?|undefined} */
    CommonFormData.prototype.business_name;
    /** @type {?|undefined} */
    CommonFormData.prototype.business_address;
    /** @type {?|undefined} */
    CommonFormData.prototype.business_phone_number;
    /** @type {?|undefined} */
    CommonFormData.prototype.business_website;
    /** @type {?|undefined} */
    CommonFormData.prototype.salesperson_name;
    /** @type {?|undefined} */
    CommonFormData.prototype.salesperson_email;
    /** @type {?|undefined} */
    CommonFormData.prototype.salesperson_phone_number;
}
var ProductOrderFormSectionData = /** @class */ (function (_super) {
    __extends(ProductOrderFormSectionData, _super);
    function ProductOrderFormSectionData() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    return ProductOrderFormSectionData;
}(OrderFormSectionData));
if (false) {
    /** @type {?} */
    ProductOrderFormSectionData.prototype.productId;
    /** @type {?} */
    ProductOrderFormSectionData.prototype.subsections;
}
var AddonDropDownFormSectionData = /** @class */ (function (_super) {
    __extends(AddonDropDownFormSectionData, _super);
    function AddonDropDownFormSectionData() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    return AddonDropDownFormSectionData;
}(DropDownFormSectionData));
if (false) {
    /** @type {?} */
    AddonDropDownFormSectionData.prototype.productId;
    /** @type {?} */
    AddonDropDownFormSectionData.prototype.addonId;
}
/**
 * @record
 */
function ProductInfoInterface() { }
if (false) {
    /** @type {?} */
    ProductInfoInterface.prototype.productId;
    /** @type {?|undefined} */
    ProductInfoInterface.prototype.name;
    /** @type {?|undefined} */
    ProductInfoInterface.prototype.tagline;
    /** @type {?|undefined} */
    ProductInfoInterface.prototype.icon;
    /** @type {?|undefined} */
    ProductInfoInterface.prototype.addonInfo;
}
/**
 * @record
 */
function AddonInfoInterface() { }
if (false) {
    /** @type {?} */
    AddonInfoInterface.prototype.addonId;
    /** @type {?|undefined} */
    AddonInfoInterface.prototype.name;
}
/**
 * @record
 */
function CustomFieldsAnswers() { }
if (false) {
    /** @type {?} */
    CustomFieldsAnswers.prototype.productID;
    /** @type {?|undefined} */
    CustomFieldsAnswers.prototype.addonKey;
    /** @type {?} */
    CustomFieldsAnswers.prototype.customFieldsAnswers;
}
/**
 * @record
 */
function CustomFieldsAnswer() { }
if (false) {
    /** @type {?} */
    CustomFieldsAnswer.prototype.fieldId;
    /** @type {?|undefined} */
    CustomFieldsAnswer.prototype.answer;
}
/**
 * @record
 */
function OrderFormOptionsInterface() { }
if (false) {
    /** @type {?|undefined} */
    OrderFormOptionsInterface.prototype.bypassRequiredQuestions;
    /** @type {?|undefined} */
    OrderFormOptionsInterface.prototype.readOnly;
    /** @type {?|undefined} */
    OrderFormOptionsInterface.prototype.showOfficeUseQuestions;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var OrderFormService = /** @class */ (function () {
    function OrderFormService() {
    }
    /**
     * @private
     * @param {?} orderForm
     * @return {?}
     */
    OrderFormService.extractRequiredCommonFieldIds = /**
     * @private
     * @param {?} orderForm
     * @return {?}
     */
    function (orderForm) {
        if (!orderForm || !orderForm.commonFormRequiredFields) {
            return [];
        }
        return Object.keys(orderForm.commonFormRequiredFields).filter((/**
         * @param {?} k
         * @return {?}
         */
        function (k) { return orderForm.commonFormRequiredFields[k]; }));
    };
    /**
     * @private
     * @param {?} orderForms
     * @return {?}
     */
    OrderFormService.buildCommonFieldIds = /**
     * @private
     * @param {?} orderForms
     * @return {?}
     */
    function (orderForms) {
        var _this = this;
        /** @type {?} */
        var commonFieldIdsMap = new Map();
        for (var key in OrderFormService.camelToSnakeCaseMap) {
            if (key) {
                commonFieldIdsMap.set(key, {
                    fieldId: key,
                    required: false,
                });
            }
        }
        orderForms.map((/**
         * @param {?} orderForm
         * @return {?}
         */
        function (orderForm) {
            /** @type {?} */
            var requiredCommonFieldIds = _this.extractRequiredCommonFieldIds(orderForm);
            requiredCommonFieldIds.map((/**
             * @param {?} fieldId
             * @return {?}
             */
            function (fieldId) {
                /** @type {?} */
                var commonFieldId = commonFieldIdsMap.get(fieldId);
                commonFieldId.required = true;
                commonFieldIdsMap.set(fieldId, commonFieldId);
            }));
        }));
        return Array.from(commonFieldIdsMap.values());
    };
    /**
     * @private
     * @param {?} fieldIds
     * @param {?} commonData
     * @param {?} labels
     * @param {?} options
     * @return {?}
     */
    OrderFormService.fillCommonFormSections = /**
     * @private
     * @param {?} fieldIds
     * @param {?} commonData
     * @param {?} labels
     * @param {?} options
     * @return {?}
     */
    function (fieldIds, commonData, labels, options) {
        /** @type {?} */
        var commonFormSections = OrderFormService.buildCommonOrderFormFields(fieldIds, labels, options);
        return commonFormSections.map((/**
         * @param {?} section
         * @return {?}
         */
        function (section) { return (__assign({}, section, { populatedData: commonData })); }));
    };
    /**
     * @private
     * @param {?} fieldIds
     * @param {?} labels
     * @param {?} options
     * @return {?}
     */
    OrderFormService.buildCommonOrderFormFields = /**
     * @private
     * @param {?} fieldIds
     * @param {?} labels
     * @param {?} options
     * @return {?}
     */
    function (fieldIds, labels, options) {
        var e_1, _a;
        /** @type {?} */
        var businessSection = {
            sectionName: labels.commonForm.businessSectionTitle || 'Business',
            fields: []
        };
        /** @type {?} */
        var salespersonSection = {
            sectionName: labels.commonForm.salespersonSectionTitle || 'Salesperson',
            fields: []
        };
        /** @type {?} */
        var contactSection = {
            sectionName: labels.commonForm.contactSectionTitle || 'Contact',
            fields: []
        };
        try {
            for (var fieldIds_1 = __values(fieldIds), fieldIds_1_1 = fieldIds_1.next(); !fieldIds_1_1.done; fieldIds_1_1 = fieldIds_1.next()) {
                var field = fieldIds_1_1.value;
                /** @type {?} */
                var fieldLabel = this.getLabelForFieldId(field.fieldId, labels);
                /** @type {?} */
                var commonFormField = new TextboxField({
                    id: OrderFormService.camelToSnakeCaseMap[field.fieldId],
                    label: fieldLabel,
                    textboxType: 'text'
                });
                commonFormField.displayOnly = commonFormField.id === 'business_account_group_id';
                commonFormField.disabled = options.readOnly;
                if (!options.bypassRequiredQuestions) {
                    commonFormField.required = field.required;
                }
                if (field.fieldId.startsWith('contact')) {
                    contactSection.fields.push(commonFormField);
                }
                if (field.fieldId.startsWith('business')) {
                    businessSection.fields.push(commonFormField);
                }
                if (field.fieldId.startsWith('salesperson')) {
                    if (!options.showOfficeUseQuestions) {
                        commonFormField.hidden = true;
                    }
                    salespersonSection.fields.push(commonFormField);
                }
            }
        }
        catch (e_1_1) { e_1 = { error: e_1_1 }; }
        finally {
            try {
                if (fieldIds_1_1 && !fieldIds_1_1.done && (_a = fieldIds_1.return)) _a.call(fieldIds_1);
            }
            finally { if (e_1) throw e_1.error; }
        }
        return [businessSection, contactSection, salespersonSection].filter((/**
         * @param {?} section
         * @return {?}
         */
        function (section) {
            return section.fields ? section.fields.length > 0 : false;
        }));
    };
    /**
     * @private
     * @param {?} fieldId
     * @param {?} labels
     * @return {?}
     */
    OrderFormService.getLabelForFieldId = /**
     * @private
     * @param {?} fieldId
     * @param {?} labels
     * @return {?}
     */
    function (fieldId, labels) {
        return labels.commonForm[fieldId] || '';
    };
    /**
     * @private
     * @param {?} parentForm
     * @return {?}
     */
    OrderFormService.buildOrderFormSectionData = /**
     * @private
     * @param {?} parentForm
     * @return {?}
     */
    function (parentForm) {
        /** @type {?} */
        var section = new AddonDropDownFormSectionData();
        section.displayAutoTitle = true;
        section.descriptionText = '';
        section.displayAutoDescription = false;
        section.parentForm = parentForm;
        return section;
    };
    /**
     * @private
     * @param {?} customFields
     * @param {?} fileUploadUrl
     * @param {?} users
     * @param {?} answers
     * @param {?} options
     * @return {?}
     */
    OrderFormService.buildCustomOrderFormFields = /**
     * @private
     * @param {?} customFields
     * @param {?} fileUploadUrl
     * @param {?} users
     * @param {?} answers
     * @param {?} options
     * @return {?}
     */
    function (customFields, fileUploadUrl, users, answers, options) {
        /** @type {?} */
        var fieldTypeMap = {
            text: TextboxField,
            textbox: TextboxField,
            dropdown: DropdownField,
            checkbox: CheckboxField,
            file: FileUploadGroupField,
            textarea: TextareaField,
            vbcuser: VBCUserField
        };
        return customFields
            .filter((/**
         * @param {?} field
         * @return {?}
         */
        function (field) {
            return fieldTypeMap[field.type];
        }))
            .map((/**
         * @param {?} field
         * @return {?}
         */
        function (field) {
            /** @type {?} */
            var fieldClass = fieldTypeMap[field.type];
            /** @type {?} */
            var result = ((/**
             * @return {?}
             */
            function () {
                switch (fieldClass) {
                    case VBCUserField:
                        /** @type {?} */
                        var fieldConfig = (/** @type {?} */ ({
                            description: field.description,
                            id: field.id,
                            required: field.required,
                            type: field.type,
                            label: field.label,
                            forOfficeUseOnly: field.forOfficeUseOnly,
                            hidden: field.hidden,
                            users: users // TODO: Get users in this component
                        }));
                        return new VBCUserField(fieldConfig);
                    case FileUploadGroupField:
                        /** @type {?} */
                        var uploadField = (/** @type {?} */ (field));
                        uploadField.uploadUrl = fileUploadUrl;
                        return new FileUploadGroupField(uploadField);
                    default:
                        return new fieldClass(field);
                }
            }))();
            result.id = OrderFormService.encodeCustomFieldId(field.id);
            if (!options.showOfficeUseQuestions) {
                result.hidden = result.forOfficeUseOnly ? true : result.hidden;
            }
            result.required = options.bypassRequiredQuestions ? false : result.required;
            result.disabled = options.readOnly ? options.readOnly : result.disabled;
            if (answers) {
                /** @type {?} */
                var ca = answers.find((/**
                 * @param {?} a
                 * @return {?}
                 */
                function (a) { return a.fieldId === field.id; }));
                if (ca) {
                    try {
                        result.value = JSON.parse(ca.answer);
                    }
                    catch (error) {
                        result.value = ca.answer;
                    }
                }
            }
            return result;
        }));
    };
    // Different products can have order form fields with the same fieldID, which will cause problem.
    // Please refer to https://github.com/vendasta/business-center-client/pull/1002
    // We will prefix the fieldID with uuid, and take it off before we same the order form into session storage
    // Different products can have order form fields with the same fieldID, which will cause problem.
    // Please refer to https://github.com/vendasta/business-center-client/pull/1002
    // We will prefix the fieldID with uuid, and take it off before we same the order form into session storage
    /**
     * @private
     * @param {?} fieldId
     * @return {?}
     */
    OrderFormService.encodeCustomFieldId = 
    // Different products can have order form fields with the same fieldID, which will cause problem.
    // Please refer to https://github.com/vendasta/business-center-client/pull/1002
    // We will prefix the fieldID with uuid, and take it off before we same the order form into session storage
    /**
     * @private
     * @param {?} fieldId
     * @return {?}
     */
    function (fieldId) {
        /** @type {?} */
        var id = uuid();
        return id + "#" + fieldId;
    };
    /**
     * @private
     * @param {?} fieldId
     * @return {?}
     */
    OrderFormService.decodeCustomFieldId = /**
     * @private
     * @param {?} fieldId
     * @return {?}
     */
    function (fieldId) {
        return fieldId.replace(new RegExp('(.*#)'), '');
    };
    /**
     * @private
     * @param {?} fieldType
     * @return {?}
     */
    OrderFormService.mapFieldType = /**
     * @private
     * @param {?} fieldType
     * @return {?}
     */
    function (fieldType) {
        switch (fieldType) {
            case 'textbox':
                return FieldType.TEXT;
            case 'textarea':
                return FieldType.TEXTAREA;
            case 'checkbox':
                return FieldType.CHECKBOX;
            case 'dropdown':
                return FieldType.DROPDOWN;
            case 'file':
                return FieldType.FILE;
            case 'vbcuser':
                return FieldType.VBCUSER;
            default:
                return FieldType.NOT_SPECIFIED;
        }
    };
    /**
     * @private
     * @param {?} fieldBase
     * @return {?}
     */
    OrderFormService.orderFieldToSalesOrderField = /**
     * @private
     * @param {?} fieldBase
     * @return {?}
     */
    function (fieldBase) {
        return new Field({
            fieldId: OrderFormService.decodeCustomFieldId(fieldBase.id),
            fieldType: OrderFormService.mapFieldType(fieldBase.controlType),
            label: fieldBase.label,
            description: fieldBase.description || '',
            prefix: fieldBase.prefix || '',
            suffix: fieldBase.suffix || '',
            regexValidator: fieldBase.regexValidator || '',
            regexErrorMessage: fieldBase.regexErrorMessage || '',
            answer: fieldBase.value ? JSON.stringify(fieldBase.value) : 'null'
        });
    };
    /**
     * @private
     * @param {?} orderFormData
     * @return {?}
     */
    OrderFormService.productOrderFormToCustomFields = /**
     * @private
     * @param {?} orderFormData
     * @return {?}
     */
    function (orderFormData) {
        var _this = this;
        /** @type {?} */
        var primaryCustomField = new CustomField();
        primaryCustomField.productId = orderFormData.productId;
        primaryCustomField.fields = orderFormData.primarySection
            ? orderFormData.primarySection.fields.map((/**
             * @param {?} field
             * @return {?}
             */
            function (field) { return _this.orderFieldToSalesOrderField(field); }))
            : [];
        /** @type {?} */
        var secondaryCustomFields = orderFormData.subsections.map((/**
         * @param {?} subsection
         * @return {?}
         */
        function (subsection) {
            /** @type {?} */
            var customField = new CustomField();
            if (subsection.addonId) {
                customField.addonKey = new AddonKey({
                    appId: subsection.productId,
                    addonId: subsection.addonId
                });
            }
            else {
                customField.productId = orderFormData.productId;
            }
            customField.fields = subsection.fields.map((/**
             * @param {?} field
             * @return {?}
             */
            function (field) { return _this.orderFieldToSalesOrderField(field); }));
            return customField;
        }));
        return [].concat(primaryCustomField, secondaryCustomFields);
    };
    /**
     * @param {?} orderForms
     * @param {?} commonData
     * @param {?} labels
     * @param {?} options
     * @return {?}
     */
    OrderFormService.getCommonFormSections = /**
     * @param {?} orderForms
     * @param {?} commonData
     * @param {?} labels
     * @param {?} options
     * @return {?}
     */
    function (orderForms, commonData, labels, options) {
        /** @type {?} */
        var fieldIds = OrderFormService.buildCommonFieldIds(orderForms);
        return OrderFormService.fillCommonFormSections(fieldIds, commonData, labels, options);
    };
    /**
     * @param {?} orderForms
     * @param {?} products
     * @param {?} parentForm
     * @param {?} fileUploadUrl
     * @param {?} users
     * @param {?} answers
     * @param {?} options
     * @return {?}
     */
    OrderFormService.getCustomFormSections = /**
     * @param {?} orderForms
     * @param {?} products
     * @param {?} parentForm
     * @param {?} fileUploadUrl
     * @param {?} users
     * @param {?} answers
     * @param {?} options
     * @return {?}
     */
    function (orderForms, products, parentForm, fileUploadUrl, users, answers, options) {
        /** @type {?} */
        var formSections = products.map((/**
         * @param {?} product
         * @return {?}
         */
        function (product) {
            /** @type {?} */
            var subsections = [];
            (product.addonInfo || []).map((/**
             * @param {?} addon
             * @return {?}
             */
            function (addon) {
                /** @type {?} */
                var addonOrderForms = orderForms.filter((/**
                 * @param {?} o
                 * @return {?}
                 */
                function (o) { return o.addonId === addon.addonId; }));
                /** @type {?} */
                var addonAnswers = (answers || []).filter((/**
                 * @param {?} a
                 * @return {?}
                 */
                function (a) { return a.addonKey &&
                    a.addonKey.appId === product.productId && a.addonKey.addonId === addon.addonId && a.productID === product.productId; }));
                addonOrderForms.map((/**
                 * @param {?} addonOrderForm
                 * @param {?} index
                 * @return {?}
                 */
                function (addonOrderForm, index) {
                    if (addonOrderForm && addonOrderForm.customFields && addonOrderForm.customFields.length > 0) {
                        /** @type {?} */
                        var addonSection = OrderFormService.buildOrderFormSectionData(parentForm);
                        /** @type {?} */
                        var addonAnswersForThisSpecificFormIndex = (addonAnswers.length > index) ? addonAnswers[index].customFieldsAnswers : [];
                        /** @type {?} */
                        var formFields = OrderFormService.buildCustomOrderFormFields(addonOrderForm.customFields, fileUploadUrl, users, addonAnswersForThisSpecificFormIndex, options);
                        addonSection.expandable = true;
                        addonSection.titleText = addon.name;
                        addonSection.fields = formFields;
                        addonSection.productId = product.productId;
                        addonSection.addonId = addon.addonId;
                        subsections.push(addonSection);
                    }
                }));
            }));
            /** @type {?} */
            var foundOrderForms = orderForms.reduce((/**
             * @param {?} orderFormsFound
             * @param {?} o
             * @return {?}
             */
            function (orderFormsFound, o) {
                if (o.appId === product.productId && !o.addonId) {
                    orderFormsFound.push(o);
                }
                return orderFormsFound;
            }), []);
            var _a = __read(foundOrderForms), primaryOrder = _a[0], otherOrdersForSameProduct = _a.slice(1);
            /** @type {?} */
            var productHasOrderForm = primaryOrder && primaryOrder.customFields && primaryOrder.customFields.length > 0;
            if (subsections.length > 0 || productHasOrderForm) {
                /** @type {?} */
                var sectionData = new ProductOrderFormSectionData();
                sectionData.productId = product.productId;
                sectionData.parentForm = parentForm;
                sectionData.titleText = product.name;
                sectionData.subtitleText = product.tagline;
                sectionData.descriptionText = ''; // TODO: build the description string to show which common data this form uses
                sectionData.iconUrl = product.icon;
                if (productHasOrderForm) {
                    /** @type {?} */
                    var section_1 = OrderFormService.buildOrderFormSectionData(parentForm);
                    section_1.titleText = product.name;
                    /** @type {?} */
                    var productAnswers = [];
                    if (answers) {
                        productAnswers = answers.filter((/**
                         * @param {?} a
                         * @return {?}
                         */
                        function (a) { return !a.addonKey && a.productID === product.productId; }));
                    }
                    var _b = __read(productAnswers), firstProductAnswers = _b[0], otherProductAnswers_1 = _b.slice(1);
                    section_1.fields = OrderFormService.buildCustomOrderFormFields(primaryOrder.customFields, fileUploadUrl, users, firstProductAnswers ? firstProductAnswers.customFieldsAnswers : [], options);
                    sectionData.primarySection = section_1;
                    otherOrdersForSameProduct.forEach((/**
                     * @param {?} _
                     * @param {?} index
                     * @return {?}
                     */
                    function (_, index) {
                        /**
                         * Clone the same section to avoid child component from modifying all as if these are all the top section.
                         * All sections need to be re-created or else they will have the same id and send repeated data as well.
                         * @type {?}
                         */
                        var dupeSection = __assign({}, section_1);
                        /** @type {?} */
                        var answersForSpecificForm = (otherProductAnswers_1.length > index) ? otherProductAnswers_1[index].customFieldsAnswers : [];
                        dupeSection.fields = OrderFormService.buildCustomOrderFormFields(primaryOrder.customFields, fileUploadUrl, users, answersForSpecificForm, options);
                        subsections.unshift(dupeSection);
                    }));
                }
                sectionData.subsections = subsections;
                return sectionData;
            }
            return null;
        })).filter((/**
         * @param {?} s
         * @return {?}
         */
        function (s) { return !!s; }));
        return formSections;
    };
    /**
     * @param {?} extraFields
     * @param {?} parentForm
     * @param {?} fileUploadUrl
     * @param {?} users
     * @param {?} answers
     * @param {?} options
     * @return {?}
     */
    OrderFormService.getExtraFieldsSection = /**
     * @param {?} extraFields
     * @param {?} parentForm
     * @param {?} fileUploadUrl
     * @param {?} users
     * @param {?} answers
     * @param {?} options
     * @return {?}
     */
    function (extraFields, parentForm, fileUploadUrl, users, answers, options) {
        if (!extraFields || extraFields.length < 1) {
            return null;
        }
        /** @type {?} */
        var section = OrderFormService.buildOrderFormSectionData(parentForm);
        section.fields = OrderFormService.buildCustomOrderFormFields(extraFields, fileUploadUrl, users, answers, options);
        return section;
    };
    /**
     * @param {?} customFormSections
     * @return {?}
     */
    OrderFormService.getCustomFieldsData = /**
     * @param {?} customFormSections
     * @return {?}
     */
    function (customFormSections) {
        /** @type {?} */
        var customFormData = customFormSections.reduce((/**
         * @param {?} acc
         * @param {?} orderFormData
         * @return {?}
         */
        function (acc, orderFormData) {
            acc = acc.concat(OrderFormService.productOrderFormToCustomFields(orderFormData));
            return acc;
        }), []);
        return customFormData;
    };
    /**
     * @param {?} commonFormSections
     * @return {?}
     */
    OrderFormService.getCommonFieldsData = /**
     * @param {?} commonFormSections
     * @return {?}
     */
    function (commonFormSections) {
        /** @type {?} */
        var commonFields = [];
        if (commonFormSections) {
            commonFields = commonFormSections.reduce((/**
             * @param {?} acc
             * @param {?} group
             * @return {?}
             */
            function (acc, group) {
                /** @type {?} */
                var fields = group.fields.map((/**
                 * @param {?} singleField
                 * @return {?}
                 */
                function (singleField) {
                    /** @type {?} */
                    var field = OrderFormService.orderFieldToSalesOrderField(singleField);
                    if (field.fieldId) {
                        return new CommonField({
                            field: field,
                            productIds: singleField.productIds,
                            addonKeys: singleField.addonKeys
                        });
                    }
                }));
                return acc.concat(fields);
            }), []);
        }
        return commonFields;
    };
    /**
     * @param {?} extraFieldsSection
     * @return {?}
     */
    OrderFormService.getExtraFieldsData = /**
     * @param {?} extraFieldsSection
     * @return {?}
     */
    function (extraFieldsSection) {
        /** @type {?} */
        var extraFieldsData = [];
        if (!!extraFieldsSection) {
            extraFieldsData = extraFieldsSection.fields.map((/**
             * @param {?} field
             * @return {?}
             */
            function (field) { return OrderFormService.orderFieldToSalesOrderField(field); }));
        }
        return extraFieldsData;
    };
    OrderFormService.camelToSnakeCaseMap = {
        'contactName': 'contact_name',
        'contactEmail': 'contact_email',
        'contactPhoneNumber': 'contact_phone_number',
        'businessAccountGroupId': 'business_account_group_id',
        'businessName': 'business_name',
        'businessAddress': 'business_address',
        'businessPhoneNumber': 'business_phone_number',
        'businessWebsite': 'business_website',
        'salespersonName': 'salesperson_name',
        'salespersonEmail': 'salesperson_email',
        'salespersonPhoneNumber': 'salesperson_phone_number'
    };
    OrderFormService.decorators = [
        { type: Injectable }
    ];
    /** @nocollapse */
    OrderFormService.ctorParameters = function () { return []; };
    return OrderFormService;
}());
if (false) {
    /** @type {?} */
    OrderFormService.camelToSnakeCaseMap;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var OrderFormComponent = /** @class */ (function () {
    function OrderFormComponent(translateService) {
        this.translateService = translateService;
        this.dropdownOpen$$ = new BehaviorSubject(false);
        this.dropdownOpen$ = this.dropdownOpen$$.asObservable();
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    /**
     * @return {?}
     */
    OrderFormComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var options = new OrderFormOptions(this.orderFormOptions || {});
        this.commonFormSections = OrderFormService.getCommonFormSections(this.orderForms, this.commonData, this.labels, options);
        this.customFormSections = OrderFormService.getCustomFormSections(this.orderForms, this.productInfo, this.parentForm, this.fileUploadUrl, this.users, this.answers, options);
        // TODO: Handle MyCorporation OrderForm (handled in a separate component right now)
        this.extraFieldsSection = OrderFormService.getExtraFieldsSection(this.extraFields, this.parentForm, this.fileUploadUrl, this.users, this.extraFieldsAnswers, options);
    };
    /**
     * returns the data from common form fields in a format that is usable by sales orders
     */
    /**
     * returns the data from common form fields in a format that is usable by sales orders
     * @return {?}
     */
    OrderFormComponent.prototype.getCommonFormData = /**
     * returns the data from common form fields in a format that is usable by sales orders
     * @return {?}
     */
    function () {
        return OrderFormService.getCommonFieldsData(this.commonFormSections);
    };
    /**
     * returns the data from custom forms in a format that is usable by sales orders
     */
    /**
     * returns the data from custom forms in a format that is usable by sales orders
     * @return {?}
     */
    OrderFormComponent.prototype.getCustomFormData = /**
     * returns the data from custom forms in a format that is usable by sales orders
     * @return {?}
     */
    function () {
        return OrderFormService.getCustomFieldsData(this.customFormSections);
    };
    /**
     * returns the data from extra fields in a format that is usable by sales orders
     */
    /**
     * returns the data from extra fields in a format that is usable by sales orders
     * @return {?}
     */
    OrderFormComponent.prototype.getExtraFieldsData = /**
     * returns the data from extra fields in a format that is usable by sales orders
     * @return {?}
     */
    function () {
        return OrderFormService.getExtraFieldsData(this.extraFieldsSection);
    };
    /**
     * changes the read only state of the sales order form
     */
    /**
     * changes the read only state of the sales order form
     * @param {?} readOnly
     * @return {?}
     */
    OrderFormComponent.prototype.changeReadOnly = /**
     * changes the read only state of the sales order form
     * @param {?} readOnly
     * @return {?}
     */
    function (readOnly) {
        this.orderFormOptions.readOnly = readOnly;
        readOnly ? this.parentForm.disable() : this.parentForm.enable();
    };
    /**
     * @return {?}
     */
    OrderFormComponent.prototype.openDropdown = /**
     * @return {?}
     */
    function () {
        this.dropdownOpen$$.next(true);
    };
    OrderFormComponent.decorators = [
        { type: Component, args: [{
                    template: "<form [formGroup]=\"parentForm\">\n    <!-- Common Fields -->\n    <div *ngIf=\"commonFormSections?.length > 0\" class=\"common-form-container\">\n        <mat-card class=\"common-form-header\">\n            <mat-card-title class=\"common-form-header-title\">{{ labels.commonForm.headerTitle }}</mat-card-title>\n            <div class=\"common-form-header-text\">{{ labels.commonForm.headerText }}</div>\n        </mat-card>\n        <va-dropdown-form-section\n            *ngFor=\"let formSection of commonFormSections\"\n            [parentForm]=\"parentForm\"\n            [prepopulatedData]=\"formSection.populatedData\"\n            [fields]=\"formSection.fields\"\n            [titleText]=\"formSection.sectionName\"\n            [startOpen]=\"dropdownOpen$ | async\"\n            editingHint=\"{{ labels.commonForm.editingHint }}\"\n        >\n        </va-dropdown-form-section>\n      <ng-container *ngIf=\"extraFieldsSection\">\n        <va-dropdown-form-section\n          [parentForm]=\"parentForm\"\n          [prepopulatedData]=\"extraFieldsSection.prepopulatedData\"\n          [fields]=\"extraFieldsSection.fields\"\n          [displayAutoDescription]=false\n          [startOpen]=\"true\"\n          [titleText]=\"'FRONTEND.STORE.ADMINISTRATIVE_QUESTIONS' | translate\"\n        >\n        </va-dropdown-form-section>\n      </ng-container>\n    </div>\n\n    <!--Custom Fields-->\n    <div *ngIf=\"customFormSections?.length > 0\" class=\"custom-form-container\">\n        <va-order-form-section *ngFor=\"let sectionData of customFormSections\" [data]=\"sectionData\"></va-order-form-section>\n    </div>\n</form>\n",
                    providers: [],
                    selector: 'va-order-form',
                    styles: [".common-form-container{margin-bottom:16px}mat-card.common-form-header{margin-bottom:0;border-bottom-color:#fafafa;border-bottom-width:1px;box-shadow:0 0 1px -2px rgba(0,0,0,.2),0 0 2px 0 rgba(0,0,0,.14),0 0 5px 0 rgba(0,0,0,.12)}.common-form-header-text{font-size:15px;color:#9e9e9e}.common-form-header-title{margin-bottom:0;padding-bottom:15px}va-order-form-section{display:block;margin-bottom:16px}"]
                }] }
    ];
    /** @nocollapse */
    OrderFormComponent.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    OrderFormComponent.propDecorators = {
        commonData: [{ type: Input }],
        answers: [{ type: Input }],
        parentForm: [{ type: Input }],
        fileUploadUrl: [{ type: Input }],
        orderForms: [{ type: Input }],
        productInfo: [{ type: Input }],
        labels: [{ type: Input }],
        users: [{ type: Input }],
        extraFields: [{ type: Input }],
        extraFieldsAnswers: [{ type: Input }],
        orderFormOptions: [{ type: Input }]
    };
    return OrderFormComponent;
}());
if (false) {
    /** @type {?} */
    OrderFormComponent.prototype.commonData;
    /** @type {?} */
    OrderFormComponent.prototype.answers;
    /** @type {?} */
    OrderFormComponent.prototype.parentForm;
    /** @type {?} */
    OrderFormComponent.prototype.fileUploadUrl;
    /** @type {?} */
    OrderFormComponent.prototype.orderForms;
    /** @type {?} */
    OrderFormComponent.prototype.productInfo;
    /** @type {?} */
    OrderFormComponent.prototype.labels;
    /** @type {?} */
    OrderFormComponent.prototype.users;
    /** @type {?} */
    OrderFormComponent.prototype.extraFields;
    /** @type {?} */
    OrderFormComponent.prototype.extraFieldsAnswers;
    /** @type {?} */
    OrderFormComponent.prototype.orderFormOptions;
    /** @type {?} */
    OrderFormComponent.prototype.commonFormSections;
    /** @type {?} */
    OrderFormComponent.prototype.customFormSections;
    /** @type {?} */
    OrderFormComponent.prototype.extraFieldsSection;
    /** @type {?} */
    OrderFormComponent.prototype.dropdownOpen$$;
    /** @type {?} */
    OrderFormComponent.prototype.dropdownOpen$;
    /**
     * @type {?}
     * @private
     */
    OrderFormComponent.prototype.translateService;
}
var OrderFormOptions = /** @class */ (function () {
    function OrderFormOptions(i) {
        this.bypassRequiredQuestions = !!i.bypassRequiredQuestions;
        this.readOnly = !!i.readOnly;
        this.showOfficeUseQuestions = !!i.showOfficeUseQuestions;
    }
    return OrderFormOptions;
}());
if (false) {
    /** @type {?} */
    OrderFormOptions.prototype.bypassRequiredQuestions;
    /** @type {?} */
    OrderFormOptions.prototype.readOnly;
    /** @type {?} */
    OrderFormOptions.prototype.showOfficeUseQuestions;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
var FILES = 'file';
/** @type {?} */
var DROP_DOWN = 'dropdown';
/** @type {?} */
var CHECK_BOX = 'checkbox';
/** @type {?} */
var TEXT_AREA = 'textarea';
/** @type {?} */
var TEXT_BOX = 'textbox';
/** @type {?} */
var BUSINESS_USER = 'vbcuser';
/**
 * @record
 */
function FieldBaseOptions() { }
if (false) {
    /** @type {?} */
    FieldBaseOptions.prototype.id;
    /** @type {?} */
    FieldBaseOptions.prototype.label;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.required;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.description;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.type;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.prefix;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.suffix;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.regexValidator;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.regexErrorMessage;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.disabled;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.forOfficeUseOnly;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.hidden;
    /** @type {?|undefined} */
    FieldBaseOptions.prototype.displayOnly;
}
/**
 * @abstract
 * @template T
 */
var  /**
 * @abstract
 * @template T
 */
FieldBase = /** @class */ (function () {
    function FieldBase(options) {
        this.id = options.id;
        this.label = options.label;
        this.required = !!options.required;
        this.description = options.description || null;
        options.type = options.type === 'text' ? 'textbox' : options.type;
        this.controlType = (/** @type {?} */ (options.type));
        this.prefix = options.prefix;
        this.suffix = options.suffix;
        this.regexValidator = options.regexValidator;
        this.regexErrorMessage = options.regexErrorMessage;
        this.disabled = options.disabled || false;
        this.validator = this.validatorBuilder();
        this.forOfficeUseOnly = !!options.forOfficeUseOnly;
        this.hidden = options.hidden;
        this.displayOnly = options.displayOnly;
    }
    /**
     * @return {?}
     */
    FieldBase.prototype.getLabel = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var fieldLabel = this.label;
        if (this.required) {
            fieldLabel += ' *';
        }
        return fieldLabel;
    };
    /**
     * @protected
     * @return {?}
     */
    FieldBase.prototype.validatorBuilder = /**
     * @protected
     * @return {?}
     */
    function () {
        return (/**
         * @param {?} control
         * @return {?}
         */
        function (control) {
            return null;
        });
    };
    return FieldBase;
}());
if (false) {
    /** @type {?} */
    FieldBase.prototype.value;
    /** @type {?} */
    FieldBase.prototype.id;
    /** @type {?} */
    FieldBase.prototype.label;
    /** @type {?} */
    FieldBase.prototype.required;
    /** @type {?} */
    FieldBase.prototype.order;
    /** @type {?} */
    FieldBase.prototype.description;
    /** @type {?} */
    FieldBase.prototype.controlType;
    /** @type {?} */
    FieldBase.prototype.prefix;
    /** @type {?} */
    FieldBase.prototype.suffix;
    /** @type {?} */
    FieldBase.prototype.regexValidator;
    /** @type {?} */
    FieldBase.prototype.regexErrorMessage;
    /** @type {?} */
    FieldBase.prototype.disabled;
    /** @type {?} */
    FieldBase.prototype.validator;
    /** @type {?} */
    FieldBase.prototype.forOfficeUseOnly;
    /** @type {?} */
    FieldBase.prototype.hidden;
    /** @type {?} */
    FieldBase.prototype.displayOnly;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var FieldBuilderComponent = /** @class */ (function () {
    function FieldBuilderComponent() {
        this.removeField = new EventEmitter(null);
    }
    /**
     * @param {?} option
     * @param {?} required
     * @return {?}
     */
    FieldBuilderComponent.createDropDownOption = /**
     * @param {?} option
     * @param {?} required
     * @return {?}
     */
    function (option, required) {
        return new FormGroup({
            label: new FormControl(option.label || option.value, required ? [Validators.required] : []),
            value: new FormControl(option.value),
            useValue: new FormControl(!!option.value)
        });
    };
    /**
     * @param {?} options
     * @return {?}
     */
    FieldBuilderComponent.createDropDownOptions = /**
     * @param {?} options
     * @return {?}
     */
    function (options) {
        if (options === null || options === undefined) {
            options = [];
        }
        /** @type {?} */
        var orderFormFieldsGroupArray = options.map((/**
         * @param {?} option
         * @return {?}
         */
        function (option) { return FieldBuilderComponent.createDropDownOption(option, false); }));
        return new FormArray(orderFormFieldsGroupArray);
    };
    /**
     * @param {?} orderFormField
     * @return {?}
     */
    FieldBuilderComponent.createOrderFormFieldGroup = /**
     * @param {?} orderFormField
     * @return {?}
     */
    function (orderFormField) {
        /** @type {?} */
        var orderFormFieldGroup = new FormGroup({
            descriptionControl: new FormControl(orderFormField.description, []),
            labelControl: new FormControl(orderFormField.label, [Validators.required]),
            idControl: new FormControl(orderFormField.id, [Validators.required]),
            requiredControl: new FormControl(orderFormField.required || false, []),
            uploadUrlControl: new FormControl(orderFormField.uploadUrl, []),
            prefixControl: new FormControl(orderFormField.prefix, []),
            suffixControl: new FormControl(orderFormField.suffix, []),
            regexValidatorControl: new FormControl(orderFormField.regexValidator, regexValidator()),
            regexErrorMessageControl: new FormControl(orderFormField.regexErrorMessage, []),
            typeControl: new FormControl(getFieldInterface(orderFormField.type), [Validators.required]),
            allowMultiples: new FormControl(orderFormField.allowMultiples || false, []),
            allowDuplicates: new FormControl(orderFormField.allowDuplicates || false, []),
            maxChoices: new FormControl(orderFormField.maxChoices ? orderFormField.maxChoices : 1, [Validators.min(1), numberValidator()]),
            forOfficeUseOnly: new FormControl(orderFormField.forOfficeUseOnly || false, [])
        });
        if (orderFormField.optionsWithLabels) {
            /** @type {?} */
            var optionsArray = FieldBuilderComponent.createDropDownOptions(orderFormField.optionsWithLabels);
            orderFormFieldGroup.addControl('optionsFormArray', optionsArray);
        }
        else if (orderFormField.options) {
            /** @type {?} */
            var optionsArray = FieldBuilderComponent.createDropDownOptions(orderFormField.options.map((/**
             * @param {?} option
             * @return {?}
             */
            function (option) { return ({ label: option }); })));
            orderFormFieldGroup.addControl('optionsFormArray', optionsArray);
        }
        else {
            orderFormFieldGroup.addControl('optionsFormArray', new FormArray([]));
        }
        return orderFormFieldGroup;
    };
    /**
     * @return {?}
     */
    FieldBuilderComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        if (!this.supportedFieldTypes || this.supportedFieldTypes.length < 1) {
            this.supportedFieldTypes = FORM_FIELDS;
        }
        this.initForm();
    };
    /**
     * @return {?}
     */
    FieldBuilderComponent.prototype.initForm = /**
     * @return {?}
     */
    function () {
        // Check to see if form has been initiated
        if (!this.orderFormFieldGroup.get('labelControl')) {
            this.orderFormFieldGroup =
                FieldBuilderComponent.createOrderFormFieldGroup({});
        }
    };
    /**
     * @return {?}
     */
    FieldBuilderComponent.prototype.getOptionsArray = /**
     * @return {?}
     */
    function () {
        return (/** @type {?} */ (this.orderFormFieldGroup.get('optionsFormArray')));
    };
    /**
     * @return {?}
     */
    FieldBuilderComponent.prototype.getCurrentFieldInterface = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var formFieldTypeInterface = ((/** @type {?} */ (this.orderFormFieldGroup.get('typeControl').value)));
        return formFieldTypeInterface ? formFieldTypeInterface.id : null;
    };
    /**
     * @param {?} index
     * @return {?}
     */
    FieldBuilderComponent.prototype.removeOption = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        /** @type {?} */
        var formArray = this.getOptionsArray();
        formArray.removeAt(index);
    };
    /**
     * @return {?}
     */
    FieldBuilderComponent.prototype.addOption = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var fieldArray = this.getOptionsArray();
        fieldArray.push(FieldBuilderComponent.createDropDownOption({ label: '' }, true));
    };
    /**
     * @return {?}
     */
    FieldBuilderComponent.prototype.getFormValues = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var obj = {};
        obj.label = this.orderFormFieldGroup.get('labelControl').value;
        obj.id = this.orderFormFieldGroup.get('idControl').value;
        /** @type {?} */
        var formFieldType = ((/** @type {?} */ (this.orderFormFieldGroup.get('typeControl').value)));
        obj.type = formFieldType ? formFieldType.id : null;
        // Options will be nested under their own form control in the larger Orderformfield array
        /** @type {?} */
        var optionsArray = ((/** @type {?} */ (this.orderFormFieldGroup.get('optionsFormArray'))));
        if (optionsArray && optionsArray.value) {
            obj.options = optionsArray.value.map((/**
             * @param {?} option
             * @return {?}
             */
            function (option) { return option.value || option.label; }));
            obj.optionsWithLabels = optionsArray.value.map((/**
             * @param {?} option
             * @return {?}
             */
            function (option) { return ({ label: option.label, value: option.value }); }));
        }
        obj.description = this.orderFormFieldGroup.get('descriptionControl').value;
        obj.required = this.orderFormFieldGroup.get('requiredControl').value || false;
        obj.uploadUrl = this.orderFormFieldGroup.get('uploadUrlControl').value;
        obj.prefix = this.orderFormFieldGroup.get('prefixControl').value;
        obj.suffix = this.orderFormFieldGroup.get('suffixControl').value;
        obj.regexValidator = this.orderFormFieldGroup.get('regexValidatorControl').value;
        obj.regexErrorMessage = this.orderFormFieldGroup.get('regexErrorMessageControl').value;
        obj.allowMultiples = this.orderFormFieldGroup.get('allowMultiples').value || false;
        obj.allowDuplicates = this.orderFormFieldGroup.get('allowDuplicates').value || false;
        obj.maxChoices = this.orderFormFieldGroup.get('maxChoices').value || 1;
        obj.forOfficeUseOnly = this.orderFormFieldGroup.get('forOfficeUseOnly').value || false;
        return obj;
    };
    FieldBuilderComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-field-builder',
                    template: "<div class=\"color-primary grab-mask order-form-field-form-container\" [formGroup]=\"orderFormFieldGroup\">\n    <mat-form-field class=\"order-form-mat-form-field\">\n      <mat-select matInput formControlName=\"typeControl\" placeholder=\"Type\" required novalidate>\n        <mat-option *ngFor=\"let field of supportedFieldTypes\" [value]=\"field\">\n          {{ field.name }}\n        </mat-option>\n      </mat-select>\n      <mat-error *ngIf=\"'typeControl.invalid'\">Form Field type is Required</mat-error>\n    </mat-form-field>\n    <span class=\"options\">\n      <mat-checkbox color=\"primary\" [formControlName]=\"'requiredControl'\"> Required</mat-checkbox>\n      <mat-checkbox color=\"primary\" [formControlName]=\"'forOfficeUseOnly'\" class=\"underlined\" matTooltip=\"This question will not be shown to end users\"> For Office Use Only</mat-checkbox>\n    </span>\n  <!-- Options if drop down type is selected -->\n  <ng-container *ngIf=\"getCurrentFieldInterface() && getCurrentFieldInterface() === 'dropdown'\">\n    <div formArrayName=\"optionsFormArray\" *ngFor=\"let option of getOptionsArray().controls; let i = index;\">\n      <div class=\"removable-form-field dropdown-option\">\n          <mat-form-field class=\"dropdown-option-label\">\n            <input  matInput [formControl]=\"option.get('label')\" placeholder=\"Option\">\n          </mat-form-field>\n          <mat-form-field class=\"dropdown-option-value\" *ngIf=\"option.get('useValue').value\">\n            <input matInput [formControl]=\"option.get('value')\" placeholder=\"Value\">\n          </mat-form-field>\n          <a class=\"dropdown-option-value\" (click)=\"option.get('useValue').setValue(true)\" *ngIf=\"!option.get('useValue').value\">+ Assign Value</a>\n        <button mat-icon-button type=\"button\" color=\"primary\" (click)=\"removeOption(i)\">\n            <mat-icon aria-label=\"Clear Button\">clear</mat-icon>\n        </button>\n      </div>\n    </div>\n    <div class=\"order-form-mat-form-field\">\n      <a (click)=\"addOption()\">+ Option</a>\n    </div>\n    <div class=\"dropdown-config\">\n      <mat-checkbox color=\"primary\" [formControlName]=\"'allowMultiples'\"> Allow Multiples</mat-checkbox>\n      <ng-container *ngIf=\"orderFormFieldGroup.controls.allowMultiples.value\">\n        <mat-checkbox class=\"required-checkbox\" color=\"primary\" [formControlName]=\"'allowDuplicates'\"> Allow Duplicates</mat-checkbox>\n      <div>\n        <mat-form-field class=\"order-form-mat-form-field\">\n          <input matInput formControlName=\"maxChoices\" placeholder=\"Maximum Number of Choices\" required type=\"number\">\n          <mat-hint>Must be greater than 0</mat-hint>\n          <mat-error *ngIf=\"'maxChoices.invalid'\">Max Choices must be a number larger than 0</mat-error>\n        </mat-form-field>\n      </div>\n      </ng-container>\n    </div>\n  </ng-container>\n  <div>\n    <mat-form-field class=\"order-form-mat-form-field\">\n      <input matInput formControlName=\"labelControl\" placeholder=\"Label\" required novalidate>\n      <mat-hint>Keep it short. Recommended: Max 140 characters</mat-hint>\n      <mat-error *ngIf=\"'idControl.invalid'\">Label is Required</mat-error>\n    </mat-form-field>\n  </div>\n  <!-- Prefix/suffix if textbox type is selected -->\n  <ng-container *ngIf=\"getCurrentFieldInterface() && getCurrentFieldInterface() === 'textbox'\">\n    <ng-container *ngIf=\"showSuffixes\">\n      <mat-form-field>\n        <input matInput formControlName=\"prefixControl\" placeholder=\"Prefix\">\n      </mat-form-field>\n      <mat-form-field>\n        <input matInput formControlName=\"suffixControl\" placeholder=\"Suffix\">\n      </mat-form-field>\n      <div class=\"show-hide-text-button\"><a (click)=\"showSuffixes = !showSuffixes\">Hide Prefix/Suffix</a></div>\n    </ng-container>\n    <div *ngIf=\"!showSuffixes\" class=\"show-hide-text-button\">\n      <a (click)=\"showSuffixes = !showSuffixes\">+ Prefix/Suffix</a>\n      <div class=\"hidden-note\">- Values will apply even though currently hidden </div>\n    </div>\n  </ng-container>\n\n  <div>\n    <mat-form-field class=\"order-form-mat-form-field\">\n        <input matInput formControlName=\"idControl\" placeholder=\"ID\" required>\n        <mat-error *ngIf=\"'idControl.invalid'\">Id is Required</mat-error>\n        <mat-hint>ID must be unique</mat-hint>\n    </mat-form-field>\n  </div>\n\n\n  <!-- Upload url if file type is selected -->\n  <ng-container *ngIf=\"getCurrentFieldInterface() && getCurrentFieldInterface() === 'file'\">\n    <mat-form-field>\n      <input matInput formControlName=\"uploadUrlControl\" placeholder=\"Upload URL\">\n    </mat-form-field>\n  </ng-container>\n\n\n  <!-- Prefix/suffix if textbox type is selected -->\n  <ng-container *ngIf=\"getCurrentFieldInterface() && getCurrentFieldInterface() === 'textbox'\">\n\n    <!-- RegexValidator/RegexErrorMessage if textbox type is selected -->\n    <ng-container *ngIf=\"showValidators\">\n      <mat-form-field>\n        <input matInput formControlName=\"regexValidatorControl\" placeholder=\"Regex Validator\">\n        <mat-error *ngIf=\"'regexValidatorControl.invalid'\"> Must be a valid regular expression </mat-error>\n      </mat-form-field>\n      <mat-form-field>\n        <input matInput formControlName=\"regexErrorMessageControl\" placeholder=\"Regex Error Message\">\n        <mat-hint> Error displayed to the user when the regular expression is not matched </mat-hint>\n      </mat-form-field>\n      <div class=\"show-hide-text-button\">\n        <a (click)=\"showValidators = !showValidators\">Hide Validation</a>\n      </div>\n    </ng-container>\n    <div *ngIf=\"!showValidators\" class=\"show-hide-text-button\">\n      <a (click)=\"showValidators = !showValidators\">+ Validation</a>\n      <div class=\"hidden-note\"> - Values will apply even though currently hidden </div>\n    </div>\n  </ng-container>\n\n  <!-- Optional description -->\n  <div class=\"removable-form-field\">\n    <mat-form-field>\n      <input matInput formControlName=\"descriptionControl\" placeholder=\"Hint text\">\n      <mat-hint>A short sentence to show below the field if you absolutely need extra instruction</mat-hint>\n    </mat-form-field>\n  </div>\n\n  <div class=\"delete-field-section\">\n    <button mat-icon-button type=\"button\" color=\"primary\" (click)=\"removeField.emit()\">\n      Delete field\n      <!-- <mat-icon aria-label=\"Clear Button\">clear</mat-icon> -->\n    </button>\n  </div>\n</div>\n",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    styles: [".show-hide-text-button{margin-bottom:2em;display:-webkit-box;display:flex}.show-hide-text-button .hidden-note{font-size:10px;margin-left:7px;color:#9e9e9e;-ms-grid-row-align:center;align-self:center}.options{padding-left:15px;width:15%;display:inline-block}.dropdown-option,mat-form-field{width:85%}.delete-field-section{text-align:right}.mat-icon-button{width:auto;color:rgba(0,0,0,.54)!important}.mat-icon-button:hover{color:#c62828!important}.dropdown-config{margin-top:17px}.dropdown-config mat-checkbox{margin-right:16px}.dropdown-option{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.dropdown-option-label{-webkit-box-flex:1;flex:1 1 auto;margin-right:16px}.dropdown-option-value{-webkit-box-flex:0;flex:0 1 33%}.underlined{border-bottom:1px dotted}"]
                }] }
    ];
    FieldBuilderComponent.propDecorators = {
        orderFormFieldGroup: [{ type: Input }],
        supportedFieldTypes: [{ type: Input }],
        removeField: [{ type: Output }]
    };
    return FieldBuilderComponent;
}());
if (false) {
    /** @type {?} */
    FieldBuilderComponent.prototype.orderFormFieldGroup;
    /** @type {?} */
    FieldBuilderComponent.prototype.supportedFieldTypes;
    /** @type {?} */
    FieldBuilderComponent.prototype.removeField;
    /** @type {?} */
    FieldBuilderComponent.prototype.showValidators;
    /** @type {?} */
    FieldBuilderComponent.prototype.showSuffixes;
}
// Validation to ensure supplied regex is valid
/**
 * @return {?}
 */
function regexValidator() {
    return (/**
     * @param {?} control
     * @return {?}
     */
    function (control) {
        try {
            /** @type {?} */
            var _ = new RegExp(control.value || '');
        }
        catch (e) {
            return { 'regex': true };
        }
        return null;
    });
}
/**
 * @return {?}
 */
function numberValidator() {
    return (/**
     * @param {?} control
     * @return {?}
     */
    function (control) {
        /** @type {?} */
        var isNumber = /^\d+$/;
        if (isNumber.test(control.value)) {
            return null;
        }
        return { 'number': true };
    });
}
/**
 * @record
 */
function FormFieldInterface() { }
if (false) {
    /** @type {?} */
    FormFieldInterface.prototype.id;
    /** @type {?} */
    FormFieldInterface.prototype.name;
}
/** @type {?} */
var FORM_FIELDS = [
    { id: FILES, name: 'Files' }, { id: DROP_DOWN, name: 'Drop Down' },
    { id: CHECK_BOX, name: 'Check Box' }, { id: TEXT_AREA, name: 'Text Area' },
    { id: TEXT_BOX, name: 'Text Box' }, { id: BUSINESS_USER, name: 'End User' }
];
/**
 * @param {?} formFieldId
 * @return {?}
 */
function getFieldInterface(formFieldId) {
    return getFormFieldInterfaceFromId(((/** @type {?} */ (formFieldId))));
}
/**
 * @param {?} id
 * @return {?}
 */
function getFormFieldInterfaceFromId(id) {
    return FORM_FIELDS.find((/**
     * @param {?} obj
     * @return {?}
     */
    function (obj) { return obj.id === id; }));
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var OrderItemListService = /** @class */ (function () {
    function OrderItemListService() {
    }
    /**
     * @param {?} items
     * @return {?}
     */
    OrderItemListService.getPriceSummary = /**
     * @param {?} items
     * @return {?}
     */
    function (items) {
        if (!items) {
            return { items: [], includesUndefinedPricing: false };
        }
        /** @type {?} */
        var includesUndefinedPricing = false;
        /** @type {?} */
        var summaryItems = items.reduce((/**
         * @param {?} currentArray
         * @param {?} item
         * @return {?}
         */
        function (currentArray, item) {
            if (item.pricing.prices.length <= 0) {
                includesUndefinedPricing = true;
                return currentArray;
            }
            item.pricing.prices.map((/**
             * @param {?} price
             * @return {?}
             */
            function (price) {
                if (!price || price.price < 0) {
                    includesUndefinedPricing = true;
                    return;
                }
                /** @type {?} */
                var freq = price.billingFrequency;
                /** @type {?} */
                var cur = item.pricing.currency;
                /** @type {?} */
                var existingCurIndex = currentArray.findIndex((/**
                 * @param {?} summaryItem
                 * @return {?}
                 */
                function (summaryItem) { return summaryItem.currency === cur; }));
                /** @type {?} */
                var pricing = {
                    currency: cur,
                    prices: []
                };
                if (existingCurIndex > -1) {
                    pricing = currentArray[existingCurIndex];
                }
                /** @type {?} */
                var existingFreqIndex = pricing.prices.findIndex((/**
                 * @param {?} summaryItem
                 * @return {?}
                 */
                function (summaryItem) { return summaryItem.billingFrequency === freq; }));
                /** @type {?} */
                var quantifiedPrice = price.price !== null ? price.price * item.quantity : null;
                /** @type {?} */
                var quantifiedDiscount = (price.discountAmount || 0) * item.quantity;
                if (existingFreqIndex > -1) {
                    pricing.prices[existingFreqIndex] = {
                        price: pricing.prices[existingFreqIndex].price + quantifiedPrice,
                        billingFrequency: freq,
                        discountAmount: pricing.prices[existingFreqIndex].discountAmount + quantifiedDiscount
                    };
                }
                else {
                    pricing.prices.push({
                        price: quantifiedPrice,
                        billingFrequency: freq,
                        discountAmount: quantifiedDiscount
                    });
                }
                if (existingCurIndex > -1) {
                    currentArray[existingCurIndex] = pricing;
                }
                else {
                    currentArray.push(pricing);
                }
            }));
            return currentArray;
        }), []);
        return { items: summaryItems, includesUndefinedPricing: includesUndefinedPricing };
    };
    return OrderItemListService;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var OrderItemListComponent = /** @class */ (function () {
    function OrderItemListComponent(translateService) {
        this.translateService = translateService;
        this.includesUndefinedPricing = false;
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    Object.defineProperty(OrderItemListComponent.prototype, "orderItems", {
        set: /**
         * @param {?} items
         * @return {?}
         */
        function (items) {
            this.items = items || [];
            /** @type {?} */
            var summary = OrderItemListService.getPriceSummary(items);
            this.summaryItems = summary.items;
            this.includesUndefinedPricing = summary.includesUndefinedPricing;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} price
     * @return {?}
     */
    OrderItemListComponent.prototype.calculateTotalPrice = /**
     * @param {?} price
     * @return {?}
     */
    function (price) {
        if (price.price === null) {
            return null;
        }
        /** @type {?} */
        var totalPrice = price.price - price.discountAmount;
        if (!this.taxOptions) {
            return totalPrice;
        }
        /** @type {?} */
        var taxTotal = this.taxOptions.reduce((/**
         * @param {?} all
         * @param {?} tax
         * @return {?}
         */
        function (all, tax) { return all + (tax.percentage * totalPrice); }), 0);
        return totalPrice + taxTotal;
    };
    /**
     * @param {?} tax
     * @return {?}
     */
    OrderItemListComponent.prototype.buildTaxLabel = /**
     * @param {?} tax
     * @return {?}
     */
    function (tax) {
        /** @type {?} */
        var taxPercentage = Number(tax.percentage * 100).toFixed(2);
        return tax.label + " (" + taxPercentage + "%)";
    };
    /**
     * @return {?}
     */
    OrderItemListComponent.prototype.isFree = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var summaryTotal = this.summaryItems.reduce((/**
         * @param {?} all
         * @param {?} item
         * @return {?}
         */
        function (all, item) {
            /** @type {?} */
            var totalPrices = item.prices.reduce((/**
             * @param {?} acc
             * @param {?} price
             * @return {?}
             */
            function (acc, price) { return acc + price.price; }), 0);
            return all + totalPrices;
        }), 0);
        return summaryTotal === 0;
    };
    OrderItemListComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-order-item-list',
                    template: "<div class=\"va-order-item-list\">\n  <mat-list class=\"product-list\" *ngIf=\"items; else loading\">\n    <ng-container *ngFor=\"let item of items\">\n      <mat-list-item>\n        <div class=\"list-item\">\n          <div class=\"left-section\">\n            <div class=\"icon-and-name\">\n              <div class=\"icon-container\">\n                <va-icon [diameter]=\"32\" [iconUrl]=\"item.icon\" [name]=\"item.name\"></va-icon>\n              </div>\n              <div>\n                <div>\n                  {{ item.name }}\n                  <va-badge color=\"blue-solid\" *ngIf=\"item.editionName\">\n                    <span> {{ item.editionName }} </span>\n                  </va-badge>\n                  <span *ngIf=\"item.quantity > 1\"> ({{ item.quantity }})</span>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"right-section\" *ngIf=\"!hidePricing && item.pricing\">\n            <ng-container *ngIf=\"item.pricing.prices?.length > 0\">\n              <ng-container *ngFor=\"let price of item.pricing.prices\">\n                <div matLine>\n                  <strong *ngIf=\"!price.discountAmount\">{{ price.price | price: item.pricing.currency }}</strong>\n                  <ng-container *ngIf=\"price.price && price.discountAmount > 0\">\n                    <span matTooltipPosition=\"left\" class=\"item-price-before-discount\"\n                      [matTooltip]=\"price.discountAmount | price: item.pricing.currency\">\n                      {{ price.price | price: item.pricing.currency }}\n                    </span>\n                    <strong>{{ price.price - price.discountAmount | price: item.pricing.currency }}</strong>\n                  </ng-container>\n                </div>\n                <div matLine class=\"tertiary-font-color\" *ngIf=\"price.price > 0\">\n                  {{ price.billingFrequency | formatBillingFrequency }}\n                </div>\n              </ng-container>\n            </ng-container>\n            <ng-container *ngIf=\"item.pricing.prices?.length <= 0\">\n              <mat-list-item class=\"summary-list-item\">\n                <div matLine>\n                  <strong>{{ null | price: 'CAD' }}</strong>\n                </div>\n              </mat-list-item>\n            </ng-container>\n          </div>\n        </div>\n      </mat-list-item>\n      <mat-divider></mat-divider>\n    </ng-container>\n  </mat-list>\n\n  <div *ngIf=\"!hidePricing\">\n    <div *ngIf=\"items; else loading\">\n      <div class=\"total-header\">\n        {{ 'FRONTEND.STORE.TOTAL' | translate }}\n      </div>\n      <mat-list class=\"summary-list\">\n        <ng-container *ngIf=\"includesUndefinedPricing; else totalIsDefined\">\n          <mat-list-item class=\"summary-list-item\">\n            <div matLine>\n              <strong>{{ null | price: 'CAD' }}</strong>\n            </div>\n          </mat-list-item>\n        </ng-container>\n\n        <ng-template #totalIsDefined>\n          <ng-container *ngIf=\"isFree(); else totalNotFree\">\n            <div class=\"summary-item-group\">\n              <mat-list-item class=\"summary-list-item\">\n                <div matLine>\n                  <strong>{{ 0 | price: 'USD' }}</strong>\n                </div>\n              </mat-list-item>\n            </div>\n          </ng-container>\n\n          <ng-template #totalNotFree>\n            <ng-container *ngFor=\"let item of summaryItems\">\n              <div class=\"summary-item-group\" *ngFor=\"let price of item.prices\">\n                <ng-container *ngIf=\"price.price > 0\">\n                  <div class=\"tax-calculation\">\n                    <mat-list-item class=\"summary-list-item tax-item\">\n                      <div matLine *ngIf=\"taxOptions\">\n                        <strong>{{ price.price - price.discountAmount | price: item.currency }}</strong>\n                      </div>\n                    </mat-list-item>\n                    <ng-container *ngFor=\"let tax of taxOptions\">\n                      <mat-list-item class=\"summary-list-item tax-item\">\n                        <div matLine class=\"tax-label\">\n                          <span>\n                            {{ buildTaxLabel(tax) }}\n                          </span>\n                          <strong>\n                            +{{ (price.price - price.discountAmount) * tax.percentage | price: item.currency }}\n                          </strong>\n                        </div>\n                      </mat-list-item>\n                    </ng-container>\n                  </div>\n\n                  <mat-list-item class=\"summary-list-item\" [ngClass]=\"{ 'result-item': (price.price > 0 && taxOptions) }\">\n                    <div matLine>\n                      <strong>{{ calculateTotalPrice(price) | price: item.currency }}</strong>\n                    </div>\n                  </mat-list-item>\n\n                  <mat-list-item class=\"summary-list-item\">\n                    <div matLine class=\"tertiary-font-color\">\n                      {{ price.billingFrequency | formatBillingFrequency }}\n                    </div>\n                  </mat-list-item>\n                </ng-container>\n              </div>\n            </ng-container>\n\n          </ng-template>\n        </ng-template>\n      </mat-list>\n    </div>\n  </div>\n\n  <ng-template #loading>\n    <div class=\"stencil-shimmer\"></div>\n  </ng-template>\n\n</div>\n",
                    styles: ["::ng-deep .va-order-item-list .mat-list-item{height:auto!important}::ng-deep .va-order-item-list .mat-list .mat-list-item-content{padding:10px 0!important}::ng-deep .va-order-item-list .mat-list .summary-list-item .mat-list-item-content{padding:0!important}.product-list{padding:0;position:relative}.product-list .list-item{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:justify;justify-content:space-between;width:100%}.product-list .list-item .left-section .icon-and-name{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.product-list .list-item .left-section .icon-and-name .icon-container{margin-right:16px}.product-list .list-item .right-section{margin-left:1em;text-align:right;align-self:flex-start}.total-header{background-color:#616161;color:#fff;line-height:2;height:2em;font-weight:700;padding-right:14px;text-align:right}.summary-list{padding:8px 0;background-color:#f5f5f5}.summary-list .summary-list-item{padding-right:14px;text-align:right}.summary-list .summary-item-group{padding:10px 0}.summary-list .summary-list-item.tax-item{color:#9e9e9e;font-size:14px}.summary-list .summary-list-item.result-item{text-decoration:overline;padding-top:5px}.summary-list .tax-label{font-size:12px}.tertiary-font-color{color:#212121;font-size:14px!important}.stencil-shimmer{width:100%;min-height:20px;margin-bottom:4px}.item-price-before-discount{font-size:14px;margin-right:8px;color:#9e9e9e;text-decoration:line-through;border-bottom:1px dotted #9e9e9e}"]
                }] }
    ];
    /** @nocollapse */
    OrderItemListComponent.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    OrderItemListComponent.propDecorators = {
        taxOptions: [{ type: Input }],
        hidePricing: [{ type: Input }],
        orderItems: [{ type: Input }]
    };
    return OrderItemListComponent;
}());
if (false) {
    /** @type {?} */
    OrderItemListComponent.prototype.items;
    /** @type {?} */
    OrderItemListComponent.prototype.summaryItems;
    /** @type {?} */
    OrderItemListComponent.prototype.includesUndefinedPricing;
    /** @type {?} */
    OrderItemListComponent.prototype.taxOptions;
    /** @type {?} */
    OrderItemListComponent.prototype.hidePricing;
    /**
     * @type {?}
     * @private
     */
    OrderItemListComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var PricePipe = /** @class */ (function () {
    function PricePipe() {
    }
    /**
     * @param {?} value
     * @param {?} currency
     * @param {?=} billingFrequency
     * @param {?=} isCents
     * @param {?=} translateZero
     * @param {?=} displaySymbol
     * @return {?}
     */
    PricePipe.prototype.transform = /**
     * @param {?} value
     * @param {?} currency
     * @param {?=} billingFrequency
     * @param {?=} isCents
     * @param {?=} translateZero
     * @param {?=} displaySymbol
     * @return {?}
     */
    function (value, currency, billingFrequency, isCents, translateZero, displaySymbol) {
        if (isCents === void 0) { isCents = true; }
        if (translateZero === void 0) { translateZero = true; }
        if (displaySymbol === void 0) { displaySymbol = true; }
        return formatDisplayPrice(value, currency, billingFrequency, isCents, translateZero, displaySymbol);
    };
    PricePipe.decorators = [
        { type: Pipe, args: [{ name: 'price' },] }
    ];
    return PricePipe;
}());
var FormatBillingFrequencyPipe = /** @class */ (function () {
    function FormatBillingFrequencyPipe() {
    }
    /**
     * @param {?} value
     * @return {?}
     */
    FormatBillingFrequencyPipe.prototype.transform = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        return formatBillingFrequency(value);
    };
    FormatBillingFrequencyPipe.decorators = [
        { type: Pipe, args: [{ name: 'formatBillingFrequency' },] }
    ];
    return FormatBillingFrequencyPipe;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaOrderFormModule = /** @class */ (function () {
    function VaOrderFormModule() {
    }
    VaOrderFormModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        FormsModule,
                        MatButtonModule,
                        MatCheckboxModule,
                        MatExpansionModule,
                        MatIconModule,
                        MatInputModule,
                        MatOptionModule,
                        MatProgressSpinnerModule,
                        MatSelectModule,
                        MatCardModule,
                        MatTooltipModule,
                        ReactiveFormsModule,
                        VaFormsModule,
                        VaHeaderContainerModule,
                        VaIconModule,
                        VaFormsModule,
                        VaBadgeModule,
                        MatListModule,
                        TranslateModule,
                    ],
                    declarations: [
                        DropDownFormSectionComponent,
                        FieldComponent,
                        OrderFormSectionComponent,
                        OrderFormComponent,
                        FieldBuilderComponent,
                        OrderItemListComponent,
                        PricePipe,
                        FormatBillingFrequencyPipe,
                    ],
                    exports: [
                        DropDownFormSectionComponent,
                        FieldComponent,
                        OrderFormSectionComponent,
                        OrderFormComponent,
                        FieldBuilderComponent,
                        OrderItemListComponent,
                    ],
                    providers: [
                        FieldService,
                        OrderFormService,
                        OrderItemListService,
                    ]
                },] }
    ];
    return VaOrderFormModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var StoreService = /** @class */ (function () {
    function StoreService() {
    }
    /**
     * @param {?} formGroup
     * @return {?}
     */
    StoreService.prototype.markFormsAsTouched = /**
     * @param {?} formGroup
     * @return {?}
     */
    function (formGroup) {
        for (var key in formGroup.controls) {
            if (formGroup.controls[key] instanceof FormGroup) {
                this.markFormsAsTouched((/** @type {?} */ (formGroup.controls[key])));
            }
            else {
                ((/** @type {?} */ (formGroup.controls[key]))).markAsTouched();
                ((/** @type {?} */ (formGroup.controls[key]))).updateValueAndValidity();
            }
        }
    };
    StoreService.decorators = [
        { type: Injectable }
    ];
    return StoreService;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var File = /** @class */ (function () {
    function File(url) {
        this.url = url;
        this.url = url;
    }
    Object.defineProperty(File.prototype, "name", {
        get: /**
         * @return {?}
         */
        function () {
            return this.url ? this.url.substring(this.url.lastIndexOf('/') + 1, this.url.lastIndexOf('.')) : null;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(File.prototype, "icon", {
        get: /**
         * @return {?}
         */
        function () {
            /** @type {?} */
            var ext = this.url ? this.url.substring(this.url.lastIndexOf('.') + 1) : null;
            switch (ext) {
                case 'pdf':
                    return 'icon-pdf';
                case 'ppt':
                    return 'icon-ppt';
                default:
                    return 'icon-docs';
            }
        },
        enumerable: true,
        configurable: true
    });
    return File;
}());
if (false) {
    /** @type {?} */
    File.prototype.url;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function Pricing() { }
if (false) {
    /** @type {?} */
    Pricing.prototype.currency;
    /** @type {?} */
    Pricing.prototype.prices;
}
/**
 * @record
 */
function Price() { }
if (false) {
    /** @type {?} */
    Price.prototype.price;
    /** @type {?} */
    Price.prototype.frequency;
    /** @type {?|undefined} */
    Price.prototype.isStartingPrice;
}
/** @type {?} */
var CONTACT_SALES = -1;

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var Sellable = /** @class */ (function () {
    function Sellable() {
    }
    Object.defineProperty(Sellable.prototype, "isFree", {
        get: /**
         * @return {?}
         */
        function () {
            return this.pricing && this.pricing.prices ? this.pricing.prices.some((/**
             * @param {?} p
             * @return {?}
             */
            function (p) { return p.price === 0 || p.price === undefined; })) : false;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Sellable.prototype, "shouldContactSales", {
        get: /**
         * @return {?}
         */
        function () {
            return this.pricing && this.pricing.prices ?
                this.pricing.prices.some((/**
                 * @param {?} p
                 * @return {?}
                 */
                function (p) { return p.price === null || p.price === CONTACT_SALES; })) ||
                    this.pricing.prices.length === 0 : true;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} inputString
     * @return {?}
     */
    Sellable.getCapitalizeFirstLetter = /**
     * @param {?} inputString
     * @return {?}
     */
    function (inputString) {
        return inputString ? inputString.charAt(0).toUpperCase() + inputString.slice(1) : null;
    };
    Object.defineProperty(Sellable.prototype, "formattedPricingList", {
        get: /**
         * @return {?}
         */
        function () {
            if (this.pricing && this.pricing.prices && this.pricing.prices.length) {
                /** @type {?} */
                var hasCurrencyAndIsNotUSD = this.pricing.currency && this.pricing.currency !== 'USD';
                /** @type {?} */
                var currencyStr_1 = hasCurrencyAndIsNotUSD ? this.pricing.currency : '';
                /** @type {?} */
                var currencySymbol_1 = Sellable.getCurrencySymbol(this.pricing.currency);
                return this.pricing.prices.map((/**
                 * @param {?} price
                 * @return {?}
                 */
                function (price) {
                    /** @type {?} */
                    var frequencyStr = price.frequency ? '/ ' + Sellable.getCapitalizeFirstLetter(price.frequency) : '';
                    /** @type {?} */
                    var roundedPrice = ((price.price || 0) / 100.0).toFixed(2);
                    /** @type {?} */
                    var startingAtPrefix = price.isStartingPrice ? 'Starting at ' : '';
                    /** @type {?} */
                    var priceStr = "" + startingAtPrefix + currencySymbol_1 + roundedPrice + " " + currencyStr_1 + " " + frequencyStr;
                    return (priceStr.trim().replace(/\s+/g, ' '));
                }));
            }
            else {
                return ['Contact Sales'];
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Sellable.prototype, "priceStrings", {
        get: /**
         * @return {?}
         */
        function () {
            if (this.shouldContactSales) {
                return ['Contact Sales'];
            }
            if (this.isFree) {
                return ['Free'];
            }
            return this.formattedPricingList;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Sellable.prototype, "formattedWholesalePrice", {
        get: /**
         * @return {?}
         */
        function () {
            return this.priceStrings.join(' + ');
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} currency
     * @return {?}
     */
    Sellable.getCurrencySymbol = /**
     * @param {?} currency
     * @return {?}
     */
    function (currency) {
        /** @type {?} */
        var currencySymbol = '$';
        switch (currency) {
            case 'EUR':
                currencySymbol = '\u20AC';
                break;
            case 'GBP':
                currencySymbol = '\u00A3';
                break;
            case 'CHF':
                currencySymbol = 'Fr';
                break;
            case 'CNY':
                currencySymbol = '\u00A5';
                break;
            case 'JPY':
                currencySymbol = '\u00A5';
                break;
            case 'CZK':
                currencySymbol = 'K\u010d';
                break;
            case 'INR':
                currencySymbol = '\u20B9';
                break;
            case 'KHR':
                currencySymbol = '\u17DB';
                break;
            case 'KRW':
                currencySymbol = '\u20A9';
                break;
            case 'NOK':
                currencySymbol = 'kr';
                break;
            case 'SEK':
                currencySymbol = 'kr';
                break;
            case 'RUB':
                currencySymbol = '\u20BD';
                break;
            case 'TRY':
                currencySymbol = '\u20BA';
                break;
            case 'ZAR':
                currencySymbol = 'R';
                break;
            default:
                currencySymbol = '$';
                break;
        }
        return currencySymbol;
    };
    return Sellable;
}());
if (false) {
    /** @type {?} */
    Sellable.prototype.pricing;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
// @dynamic
var  
// @dynamic
CaseTransform = /** @class */ (function () {
    function CaseTransform() {
    }
    /**
     * @param {?} value
     * @return {?}
     */
    CaseTransform.snakeToCamelCase = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        return value ? value.replace(new RegExp(/_/g), ' ').replace(/\b\w/g, (/**
         * @param {?} l
         * @return {?}
         */
        function (l) { return l.toUpperCase(); }))
            .replace(/\b\w/, (/**
         * @param {?} l
         * @return {?}
         */
        function (l) { return l.toLowerCase(); })).replace(/\s/g, '') : value;
    };
    /**
     * @param {?} value
     * @return {?}
     */
    CaseTransform.lowerToTitleCase = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        // Code taken from https://github.com/gouch/to-title-case to support the proper spec.
        /** @type {?} */
        var smallWords = /^(a|an|and|as|at|but|by|en|for|if|in|nor|of|on|or|per|the|to|vs?\.?|via)$/i;
        return value ? value.replace(/[A-Za-z0-9\u00C0-\u00FF]+[^\s-]*/g, (/**
         * @param {?} match
         * @param {?} index
         * @param {?} title
         * @return {?}
         */
        function (match, index, title) {
            if (index > 0 && index + match.length !== title.length &&
                match.search(smallWords) > -1 && title.charAt(index - 2) !== ':' &&
                (title.charAt(index + match.length) !== '-' || title.charAt(index - 1) === '-') &&
                title.charAt(index - 1).search(/[^\s-]/) < 0) {
                return match.toLowerCase();
            }
            if (match.substr(1).search(/[A-Z]|\../) > -1) {
                return match;
            }
            return match.charAt(0).toUpperCase() + match.substr(1);
        })) : value;
    };
    ;
    return CaseTransform;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
var COLOR_CODES = [
    '#EF5350', '#42A5F5', '#66BB6A', '#FFA726', '#AB47BC', '#FFCA28', '#EC407A', '#26C6DA',
    '#FF7B57'
];
/** @type {?} */
var DEFAULT_COLOR = '#808080';
var Product = /** @class */ (function (_super) {
    __extends(Product, _super);
    function Product(data) {
        var _this = _super.call(this) || this;
        _this.addons = [];
        data = data || {};
        _this.pricing = data.pricing;
        _this.productId = data.productId;
        _this.editionId = data.editionId;
        _this.editionName = data.editionName;
        _this.name = data.name;
        _this.description = data.description;
        _this.tagline = data.tagline;
        _this.iconUrl = data.iconUrl;
        _this.entryUrl = data.entryUrl;
        _this.screenshotUrls = data.screenshotUrls;
        _this.pdfUploadUrls = data.pdfUploadUrls;
        _this.lmiCategories = data.lmiCategories;
        _this.keySellingPoints = data.keySellingPoints;
        _this.faqs = data.faqs;
        _this.wholesalePrice = data.wholesalePrice;
        _this.currency = data.currency;
        _this.billingFrequency = data.billingFrequency;
        _this.isArchived = data.isArchived;
        _this.addons = data.addons;
        _this.restrictions = data.restrictions;
        _this.billingId = data.billingId;
        if (data.hasOwnProperty('pdfUploadUrls')) {
            _this.files = _this.pdfUploadUrls ? _this.pdfUploadUrls.map((/**
             * @param {?} url
             * @return {?}
             */
            function (url) { return new File(url); })) : null;
        }
        return _this;
    }
    /**
     * @param {?} data
     * @return {?}
     */
    Product.fromApi = /**
     * @param {?} data
     * @return {?}
     */
    function (data) {
        /** @type {?} */
        var newProduct = {};
        data = data || {};
        for (var key in data) {
            if (data.hasOwnProperty(key)) {
                /** @type {?} */
                var newKey = CaseTransform.snakeToCamelCase(key);
                newProduct[newKey] = data[key];
            }
        }
        return new Product(newProduct);
    };
    Object.defineProperty(Product.prototype, "iconStyle", {
        get: /**
         * @return {?}
         */
        function () {
            return this.iconUrl ? "url(\"" + this.iconUrl + "\") no-repeat center / 100% 100%" : null;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Product.prototype, "iconColor", {
        get: /**
         * @return {?}
         */
        function () {
            // determine an icon color for a product with no icon by using the product name
            if (!this.name) {
                return DEFAULT_COLOR;
            }
            /** @type {?} */
            var nameSum = 0;
            for (var i = 0; i < this.name.length; i++) {
                nameSum += this.name[i].charCodeAt(0);
            }
            /** @type {?} */
            var index = nameSum % COLOR_CODES.length;
            return COLOR_CODES[index];
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    Product.prototype.getLmiCategoryNames = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var lmiCategories = this.lmiCategories || [];
        return lmiCategories.map((/**
         * @param {?} lmiCategory
         * @return {?}
         */
        function (lmiCategory) { return CaseTransform.lowerToTitleCase(lmiCategory.toLowerCase().replace(/_/g, ' ')); }));
    };
    return Product;
}(Sellable));
if (false) {
    /** @type {?} */
    Product.prototype.productId;
    /** @type {?} */
    Product.prototype.editionId;
    /** @type {?} */
    Product.prototype.editionName;
    /** @type {?} */
    Product.prototype.name;
    /** @type {?} */
    Product.prototype.description;
    /** @type {?} */
    Product.prototype.tagline;
    /** @type {?} */
    Product.prototype.iconUrl;
    /** @type {?} */
    Product.prototype.entryUrl;
    /** @type {?} */
    Product.prototype.screenshotUrls;
    /** @type {?} */
    Product.prototype.pdfUploadUrls;
    /** @type {?} */
    Product.prototype.lmiCategories;
    /** @type {?} */
    Product.prototype.keySellingPoints;
    /** @type {?} */
    Product.prototype.faqs;
    /** @type {?} */
    Product.prototype.wholesalePrice;
    /** @type {?} */
    Product.prototype.currency;
    /** @type {?} */
    Product.prototype.billingFrequency;
    /** @type {?} */
    Product.prototype.billingId;
    /** @type {?} */
    Product.prototype.isArchived;
    /** @type {?} */
    Product.prototype.addons;
    /** @type {?} */
    Product.prototype.files;
    /** @type {?} */
    Product.prototype.restrictions;
    /** @type {?} */
    Product.prototype.trialConfiguration;
}
var ProductWithParent = /** @class */ (function (_super) {
    __extends(ProductWithParent, _super);
    function ProductWithParent(data) {
        var _this = _super.call(this, data) || this;
        _this.parentId = data.parentId;
        _this.parentName = data.parentName;
        _this.parentIconUrl = data.parentIconUrl;
        _this.multipleActivations = data.multipleActivations || false;
        return _this;
    }
    /**
     * @param {?} data
     * @return {?}
     */
    ProductWithParent.fromApi = /**
     * @param {?} data
     * @return {?}
     */
    function (data) {
        /** @type {?} */
        var newProduct = {};
        data = data || {};
        for (var key in data) {
            if (data.hasOwnProperty(key)) {
                /** @type {?} */
                var newKey = CaseTransform.snakeToCamelCase(key);
                newProduct[newKey] = data[key];
            }
        }
        return new ProductWithParent(newProduct);
    };
    return ProductWithParent;
}(Product));
if (false) {
    /** @type {?} */
    ProductWithParent.prototype.parentId;
    /** @type {?} */
    ProductWithParent.prototype.parentName;
    /** @type {?} */
    ProductWithParent.prototype.parentIconUrl;
    /** @type {?} */
    ProductWithParent.prototype.multipleActivations;
}
/**
 * @record
 */
function TrialConfigurationInterface() { }
if (false) {
    /** @type {?} */
    TrialConfigurationInterface.prototype.trialEnabled;
    /** @type {?} */
    TrialConfigurationInterface.prototype.trialDuration;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var AddonDetailsComponent = /** @class */ (function () {
    function AddonDetailsComponent() {
        this.hasVerifiedContract = false;
        this.loaded = true;
        this.showPricing = true;
        this.showEnableAddon = false;
        this.actionEnabled = false;
        this.prerequisiteSelected = new EventEmitter();
        this.actionSelected = new EventEmitter();
    }
    /**
     * @return {?}
     */
    AddonDetailsComponent.prototype.onPrerequisiteSelected = /**
     * @return {?}
     */
    function () {
        this.prerequisiteSelected.emit();
    };
    /**
     * @return {?}
     */
    AddonDetailsComponent.prototype.onActionSelected = /**
     * @return {?}
     */
    function () {
        this.actionSelected.emit();
    };
    /**
     * @param {?} product
     * @param {?} addon
     * @return {?}
     */
    AddonDetailsComponent.prototype.getPricing = /**
     * @param {?} product
     * @param {?} addon
     * @return {?}
     */
    function (product, addon) {
        return {
            currency: product.currency,
            prices: [
                {
                    price: addon.price,
                    frequency: addon.billingFrequency ? addon.billingFrequency : 'Monthly'
                }
            ]
        };
    };
    Object.defineProperty(AddonDetailsComponent.prototype, "pricingLabel", {
        get: /**
         * @return {?}
         */
        function () {
            return this.reseller ? 'Wholesale Pricing' : 'Pricing';
        },
        enumerable: true,
        configurable: true
    });
    AddonDetailsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'addon-details',
                    template: "<div class=\"addon-page\">\n  <va-header-container [iconUrl]=\"addon.icon\"\n                       [title]=\"addon.title\"\n                       [tagline]=\"addon.tagline\"\n                       [chipLabels]=\"product.getLmiCategoryNames()\"\n                       [pricing]=\"getPricing(product, addon)\"\n                       [pricingLabel]=\"pricingLabel\"\n                       [prerequisiteLabel]=\"product.name\"\n                       [billedProduct]=\"billedProduct\"\n                       [hasVerifiedContract]=\"hasVerifiedContract\"\n                       [loaded]=\"loaded\"\n                       [showPricing]=\"showPricing\"\n                       [actionLabel]=\"'Enable Add-on'\"\n                       [showEnableAddon]=\"showEnableAddon\"\n                       (actionSelected)=\"onActionSelected()\"\n                       (prerequisiteSelected)=\"onPrerequisiteSelected()\">\n  </va-header-container>\n\n  <div class=\"addon-details addon-content\">\n    <ng-container *ngIf=\"reseller\">\n      <div class=\"left-column\">\n        <div *ngIf=\"addon.resellerMarketing?.description || addon.resellerMarketing?.keySellingPoints\">\n          <va-selling-info [description]=\"addon.resellerMarketing?.description\"\n                           [keySellingPoints]=\"addon.resellerMarketing?.keySellingPoints\"></va-selling-info>\n        </div>\n        <section *ngIf=\"addon.resellerMarketing?.faqs?.length > 0 && addon.resellerMarketing?.faqs[0].question\">\n          <h2 class=\"va-addon-title\">FAQs</h2>\n          <va-faqs [faqs]=\"addon.resellerMarketing?.faqs\"></va-faqs>\n        </section>\n      </div>\n      <div class=\"right-column\">\n        <section *ngIf=\"addon.restrictions?.country?.whitelist\">\n          <supported-countries [countryCodes]=\"addon.restrictions.country.whitelist\"></supported-countries>\n        </section>\n        <section *ngIf=\"addon.screenshots?.length > 0\">\n          <h2 class=\"va-addon-title\">Gallery</h2>\n          <va-image-gallery [imageUrls]=\"addon.screenshots\"></va-image-gallery>\n        </section>\n        <section *ngIf=\"addon.resellerMarketing?.files?.length > 0\">\n        <h2 class=\"va-addon-title\">Files</h2>\n        <va-files [files]=\"addon.resellerMarketingFiles\"></va-files>\n        </section>\n      </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"!reseller\">\n      <div class=\"left-column\">\n        <div *ngIf=\"addon.endUserMarketing?.description || addon.endUserMarketing?.keySellingPoints\">\n          <va-selling-info [description]=\"addon.endUserMarketing?.description\"\n                           [keySellingPoints]=\"addon.endUserMarketing?.keySellingPoints\"></va-selling-info>\n        </div>\n        <section *ngIf=\"addon.endUserMarketing?.faqs?.length > 0 && addon.endUserMarketing?.faqs[0].question\">\n          <h2 class=\"va-addon-title\">FAQs</h2>\n          <va-faqs [faqs]=\"addon.endUserMarketing?.faqs\"></va-faqs>\n        </section>\n      </div>\n\n      <div class=\"right-column\">\n        <section *ngIf=\"addon.restrictions?.country?.whitelist?.length > 0\">\n          <supported-countries [countryCodes]=\"addon.restrictions.country.whitelist\"></supported-countries>\n        </section>\n        <section *ngIf=\"addon.screenshots?.length > 0\">\n          <h2 class=\"va-addon-title\">Gallery</h2>\n          <va-image-gallery [imageUrls]=\"addon.screenshots\"></va-image-gallery>\n        </section>\n        <section *ngIf=\"addon.endUserMarketing?.files?.length > 0\">\n        <h2 class=\"va-addon-title\">Files</h2>\n        <va-files [files]=\"addon.endUserMarketingFiles\"></va-files>\n        </section>\n      </div>\n    </ng-container>\n  </div>\n\n</div>\n",
                    styles: [":host{display:block;font-size:14px;line-height:1.4}:host *{box-sizing:border-box}.va-addon-title{font-size:32px;font-weight:300;margin-top:0;color:#212121}@media screen and (min-width:600px){.va-addon-title{font-size:32px}}img{max-width:100%}va-icon{display:inline-block}.addon-page{position:relative;margin:0 auto 20px;background:#fff;box-shadow:0 3px 10px rgba(33,33,33,.3);overflow:hidden;font-size:16px;color:#212121}.addon-page .item-amount{color:#999;font-size:14px;text-align:right;margin:0 24px 8px}section{padding:24px}.left-column{width:66%}@media screen and (max-width:600px){.left-column{width:100%}}.right-column{width:34%}.addon-content{display:-webkit-box;display:flex}@media screen and (max-width:600px){.right-column{width:100%}.addon-content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}}"]
                }] }
    ];
    AddonDetailsComponent.propDecorators = {
        product: [{ type: Input }],
        addon: [{ type: Input }],
        reseller: [{ type: Input }],
        billedProduct: [{ type: Input }],
        hasVerifiedContract: [{ type: Input }],
        loaded: [{ type: Input }],
        showPricing: [{ type: Input }],
        showEnableAddon: [{ type: Input }],
        actionEnabled: [{ type: Input }],
        prerequisiteSelected: [{ type: Output }],
        actionSelected: [{ type: Output }]
    };
    return AddonDetailsComponent;
}());
if (false) {
    /** @type {?} */
    AddonDetailsComponent.prototype.product;
    /** @type {?} */
    AddonDetailsComponent.prototype.addon;
    /** @type {?} */
    AddonDetailsComponent.prototype.reseller;
    /** @type {?} */
    AddonDetailsComponent.prototype.billedProduct;
    /** @type {?} */
    AddonDetailsComponent.prototype.hasVerifiedContract;
    /** @type {?} */
    AddonDetailsComponent.prototype.loaded;
    /** @type {?} */
    AddonDetailsComponent.prototype.showPricing;
    /** @type {?} */
    AddonDetailsComponent.prototype.showEnableAddon;
    /** @type {?} */
    AddonDetailsComponent.prototype.actionEnabled;
    /** @type {?} */
    AddonDetailsComponent.prototype.prerequisiteSelected;
    /** @type {?} */
    AddonDetailsComponent.prototype.actionSelected;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaFilesComponent = /** @class */ (function () {
    function VaFilesComponent() {
    }
    VaFilesComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-files',
                    template: "\n    <div class=\"va-files file-list-container\" *ngFor=\"let file of files\">\n      <mat-icon class=\"file-icon\">insert_drive_file</mat-icon>\n      <a [href]=\"file.url\" target=\"_blank\">{{ file.name }}</a>\n    </div>",
                    styles: [".va-files{display:-webkit-inline-box;display:inline-flex;margin-bottom:16px}.va-files a{color:#212121;font-size:16px;font-weight:700;-ms-grid-row-align:center;align-self:center;padding-left:8px;text-decoration:none}.va-files .file-icon{vertical-align:middle}.va-files .file-list-container{display:-webkit-box;display:flex}"]
                }] }
    ];
    VaFilesComponent.propDecorators = {
        files: [{ type: Input }]
    };
    return VaFilesComponent;
}());
if (false) {
    /** @type {?} */
    VaFilesComponent.prototype.files;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaFilesModule = /** @class */ (function () {
    function VaFilesModule() {
    }
    VaFilesModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        MatIconModule
                    ],
                    declarations: [VaFilesComponent],
                    exports: [VaFilesComponent]
                },] }
    ];
    return VaFilesModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaFaqsComponent = /** @class */ (function () {
    function VaFaqsComponent() {
        this.openFaqs = [];
    }
    /**
     * @param {?} index
     * @return {?}
     */
    VaFaqsComponent.prototype.toggleFaq = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        if (this.openFaqs.indexOf(index) >= 0) {
            this.openFaqs.splice(this.openFaqs.indexOf(index), 1); // Remove
        }
        else {
            this.openFaqs.push(index); // Insert
        }
    };
    /**
     * @param {?} index
     * @return {?}
     */
    VaFaqsComponent.prototype.isFaqOpen = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        return this.openFaqs.indexOf(index) >= 0;
    };
    /**
     * @param {?} index
     * @return {?}
     */
    VaFaqsComponent.prototype.faqIcon = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        return this.isFaqOpen(index) ? 'keyboard_arrow_up' : 'keyboard_arrow_down';
    };
    VaFaqsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-faqs',
                    template: "\n    <div class=\"va-faq\" *ngFor=\"let faq of faqs; let i = index;\">\n      <div class=\"question\" (click)=\"toggleFaq(i)\">\n        <span>{{ faq.question }}</span>\n        <mat-icon>{{ faqIcon(i) }}</mat-icon>\n      </div>\n      <span class=\"answer\" [ngClass]=\"{'show': isFaqOpen(i) }\" [innerHtml]=\"faq.answer | vaSanitize\"></span>\n    </div>",
                    styles: [".va-faq{font-size:16px;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:start;justify-content:flex-start;padding:12px 0;border-bottom:1px solid #e0e0e0}.va-faq:first-of-type{border-top:1px solid #e0e0e0}.va-faq .question{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between;-webkit-box-align:center;align-items:center;color:#212121;cursor:pointer}.va-faq .answer{color:#616161;height:0;overflow:hidden}.va-faq .show{padding-top:12px;height:inherit}"]
                }] }
    ];
    VaFaqsComponent.propDecorators = {
        faqs: [{ type: Input }]
    };
    return VaFaqsComponent;
}());
if (false) {
    /** @type {?} */
    VaFaqsComponent.prototype.faqs;
    /** @type {?} */
    VaFaqsComponent.prototype.openFaqs;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaFaqsModule = /** @class */ (function () {
    function VaFaqsModule() {
    }
    VaFaqsModule.decorators = [
        { type: NgModule, args: [{
                    imports: [CommonModule, MatIconModule, VaSafeHtmlModule],
                    declarations: [VaFaqsComponent],
                    exports: [VaFaqsComponent]
                },] }
    ];
    return VaFaqsModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaSellingInfoComponent = /** @class */ (function () {
    function VaSellingInfoComponent() {
    }
    Object.defineProperty(VaSellingInfoComponent.prototype, "filterDescription", {
        get: /**
         * @return {?}
         */
        function () {
            /** @type {?} */
            var desc = this.description.replace(/max-width:\d*[^\"]/i, 'max-width:100%');
            if ((desc.indexOf('"max-width:100%"') === -1) && (desc.indexOf('<iframe ') !== -1)) {
                /** @type {?} */
                var index = desc.indexOf('<iframe ') + 7;
                return desc.substr(0, index) + ' style="max-width:100%"' + desc.substr(index);
            }
            return String(desc);
        },
        enumerable: true,
        configurable: true
    });
    VaSellingInfoComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-selling-info',
                    template: "\n      <section *ngIf=\"description\" class=\"resize\" [innerHtml]=\"filterDescription | vaSafeHtml\"></section>\n      <section *ngIf=\"keySellingPoints && keySellingPoints.length > 0\" class=\"key-selling-points\">\n        <div *ngFor=\"let ksp of keySellingPoints\" class=\"key-selling-point\">\n          <mat-icon>check_circle</mat-icon>\n          {{ ksp }}\n        </div>\n      </section>\n    ",
                    styles: ["section{padding:24px}section ::ng-deep>:first-child{margin-top:0;padding-top:0}#description *{max-width:100%!important}.key-selling-point{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;padding-bottom:24px;font-size:16px}@media screen and (max-width:600px){.resize{font-size:16px}.key-selling-point{-webkit-box-align:start;align-items:flex-start}}.key-selling-point:last-of-type{padding-bottom:0}.key-selling-point mat-icon{color:#4caf50;font-size:32px;width:32px;height:32px;margin-right:20px}"]
                }] }
    ];
    VaSellingInfoComponent.propDecorators = {
        description: [{ type: Input }],
        keySellingPoints: [{ type: Input }]
    };
    return VaSellingInfoComponent;
}());
if (false) {
    /** @type {?} */
    VaSellingInfoComponent.prototype.description;
    /** @type {?} */
    VaSellingInfoComponent.prototype.keySellingPoints;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaSellingInfoModule = /** @class */ (function () {
    function VaSellingInfoModule() {
    }
    VaSellingInfoModule.decorators = [
        { type: NgModule, args: [{
                    imports: [CommonModule, MatIconModule, VaSafeHtmlModule],
                    declarations: [VaSellingInfoComponent],
                    exports: [VaSellingInfoComponent]
                },] }
    ];
    return VaSellingInfoModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var SupportedCountriesComponent = /** @class */ (function () {
    function SupportedCountriesComponent() {
    }
    SupportedCountriesComponent.decorators = [
        { type: Component, args: [{
                    selector: 'supported-countries',
                    template: "\n    <span class=\"supported-text\"> Supported Countries: </span>\n    <div class=\"flags\">\n        <span *ngFor=\"let countryCode of countryCodes\" matTooltip=\"{{countryCode}}\" matTooltipPosition=\"below\"\n              class=\"flag-icon flag-icon-{{countryCode.toLowerCase()}}\">\n        </span>\n    </div>\n    ",
                    styles: [".flag-icon{margin-right:10px}.supported-text{margin-right:3px}.flags{display:inline-block}"]
                }] }
    ];
    SupportedCountriesComponent.propDecorators = {
        countryCodes: [{ type: Input }]
    };
    return SupportedCountriesComponent;
}());
if (false) {
    /** @type {?} */
    SupportedCountriesComponent.prototype.countryCodes;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var RestrictionsModule = /** @class */ (function () {
    function RestrictionsModule() {
    }
    RestrictionsModule.decorators = [
        { type: NgModule, args: [{
                    imports: [CommonModule, MatTooltipModule],
                    declarations: [SupportedCountriesComponent],
                    exports: [SupportedCountriesComponent]
                },] }
    ];
    return RestrictionsModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var AddonModule = /** @class */ (function () {
    function AddonModule() {
    }
    AddonModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        VaListModule,
                        VaImageGalleryModule,
                        VaIconModule,
                        VaPricingModule,
                        VaFilesModule,
                        VaFaqsModule,
                        VaSellingInfoModule,
                        VaHeaderContainerModule,
                        VaSafeHtmlModule,
                        MatProgressSpinnerModule$1,
                        VaBreadcrumbsModule,
                        RestrictionsModule
                    ],
                    exports: [AddonDetailsComponent],
                    declarations: [AddonDetailsComponent],
                    providers: [],
                    entryComponents: []
                },] }
    ];
    return AddonModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DetailsStencilComponent = /** @class */ (function () {
    function DetailsStencilComponent() {
    }
    DetailsStencilComponent.decorators = [
        { type: Component, args: [{
                    selector: 'details-stencil',
                    template: "\n    <div class=\"details\">\n\n      <mat-card class=\"details-header\">\n        <div class=\"details-column-0\">\n          <div class=\"details-column-0-1\">\n            <div class=\"details-icon stencil-shimmer\"></div>\n          </div>\n          <div class=\"details-column-0-2\">\n            <div class=\"details-title stencil-shimmer\"></div>\n            <div class=\"details-title stencil-shimmer\"></div>\n          </div>\n        </div>\n        <div class=\"details-column-1\">\n          <div class=\"details-column-1-0 stencil-shimmer\"></div>\n          <div class=\"details-column-1-1 stencil-shimmer\"></div>\n        </div>\n      </mat-card>\n\n      <mat-card>\n        <div class=\"details-box-large stencil-shimmer\"></div>\n      </mat-card>\n\n      <mat-card class=\"details-body\">\n        <div class=\"details-body-column-0\" >\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n          <div class=\"details-icon-small stencil-shimmer\"></div>\n        </div>\n        <div class=\"details-body-column-1\">\n          <div class=\"details-line stencil-shimmer\"></div>\n          <div class=\"details-line stencil-shimmer\"></div>\n          <div class=\"details-line stencil-shimmer\"></div>\n          <div class=\"details-line stencil-shimmer\"></div>\n          <div class=\"details-line stencil-shimmer\"></div>\n          <div class=\"details-line stencil-shimmer\"></div>\n          <div class=\"details-line stencil-shimmer\"></div>\n        </div>\n        <div class=\"details-body-column-2\">\n          <div class=\"details-box stencil-shimmer\"></div>\n          <div class=\"details-box stencil-shimmer\"></div>\n          <div class=\"details-box stencil-shimmer\"></div>\n          <div class=\"details-box stencil-shimmer\"></div>\n          <div class=\"details-box stencil-shimmer\"></div>\n        </div>\n      </mat-card>\n\n    </div>\n  ",
                    styles: [".details{position:relative;margin:0 auto 20px;background:#fff;box-shadow:0 3px 10px rgba(33,33,33,.3);overflow:hidden;font-size:16px}.details-header{display:-webkit-box;display:flex;height:180px}.details-column-0{display:-webkit-box;display:flex;width:66%}@media screen and (max-width:600px){.details-column-0{width:100%}}.details-column-0-1{display:-webkit-box;display:flex;width:25%;min-width:120px}@media screen and (max-width:600px){.details-column-0-1{width:50%}}.details-icon{height:120px;width:120px;border-radius:50%}.details-title{margin:20px 0 20px 20px;height:32px;width:250px}@media screen and (max-width:600px){.details-title{width:120px}}.details-column-1{width:34%;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}@media screen and (max-width:1100px){.details-column-1{width:0}}.details-column-1-0{height:32px;margin:10px 0}.details-column-1-1{height:70px}@media screen and (max-width:600px){.details-column-1-0{width:0;margin:0}.details-column-1-1{height:0}}.details-box-large{display:-webkit-box;display:flex;width:650px;height:150px}@media screen and (max-width:1100px){.details-box-large{width:100%}}.details-body{display:-webkit-box;display:flex;height:500px;width:100%}.details-body-column-0{width:10%;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}@media screen and (max-width:600px){.details-body-column-0{width:0%}}.details-body-column-1{width:56%;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}@media screen and (max-width:600px){.details-body-column-1{width:100%}}.details-icon-small{margin-bottom:24px;display:-webkit-box;display:flex;height:32px;width:32px;border-radius:50%}.details-line{margin-bottom:24px;height:32px;width:400px}@media screen and (max-width:600px){.details-line{width:100%;margin-right:10px}}.details-body-column-2{width:34%;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}@media screen and (max-width:1100px){.details-body-column-2{width:0}}.details-box{height:70px;margin-bottom:10px}@media screen and (max-width:600px){.details-box{width:0;margin:0}}"]
                }] }
    ];
    return DetailsStencilComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var CardStencilComponent = /** @class */ (function () {
    function CardStencilComponent() {
    }
    CardStencilComponent.decorators = [
        { type: Component, args: [{
                    selector: 'card-stencil',
                    template: "\n    <div class=\"card-stencil-container\">\n      <mat-card class=\"card-stencil\">\n        <div class=\"card-stencil-header stencil-shimmer\"></div>\n        <div class=\"card-stencil-footer\">\n          <div class=\"card-stencil-circle stencil-shimmer\"></div>\n          <div>\n            <div class=\"card-stencil-line-large stencil-shimmer\"></div>\n            <div class=\"card-stencil-line-medium stencil-shimmer\"></div>\n          </div>\n        </div>\n      </mat-card>\n    </div>\n  ",
                    styles: [".card-stencil-container{position:relative;width:100%;padding-bottom:100%;margin-bottom:-45%}.card-stencil{position:absolute;width:100%;height:55%;padding:0;margin-bottom:0}.card-stencil-header{display:-webkit-box;display:flex;height:60%}.card-stencil-footer{display:-webkit-box;display:flex;height:40%;-webkit-box-align:center;align-items:center}.card-stencil-circle{margin:0 16px;height:60px;width:60px;border-radius:50%}@media screen and (max-width:650px){.card-stencil-circle{width:45px;height:45px}}.card-stencil-line-large{height:20px;width:200px;margin-bottom:10px}@media screen and (max-width:650px){.card-stencil-line-large{width:100px;height:10px}}.card-stencil-line-medium{height:20px;width:160px}@media screen and (max-width:650px){.card-stencil-line-medium{width:80px;height:10px}}"]
                }] }
    ];
    return CardStencilComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var CardListStencilComponent = /** @class */ (function () {
    function CardListStencilComponent() {
        this.numCards = 3;
        this.cards = [];
    }
    /**
     * @return {?}
     */
    CardListStencilComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        for (var n = 0; n < this.numCards; n++) {
            this.cards.push(n);
        }
    };
    CardListStencilComponent.decorators = [
        { type: Component, args: [{
                    selector: 'card-stencil-list',
                    template: "\n    <div class=\"row row-gutters\">\n      <div *ngFor=\"let _ of cards\" class=\"col-flex\">\n        <card-stencil></card-stencil>\n      </div>\n    </div>\n  ",
                    styles: ["\n    .row {\n      display: flex;\n      flex-wrap: wrap;\n    }\n\n    .row + .row-gutters {\n      margin-top: 0;\n    }\n\n    .row-gutters {\n      margin-top: -20px;\n      margin-left: -20px;\n    }\n\n    .row-gutters > .col-flex {\n      padding-top: 20px;\n      padding-left: 20px;\n    }\n\n    .col-flex {\n      position: relative;\n      max-width: 100%;\n      box-sizing: border-box;\n      flex: 0 0 auto;\n      width: 100%;\n    }\n\n    @media screen and (min-width: 480px) {\n      .col-flex {\n        width: 50%;\n      }\n    }\n\n    @media screen and (min-width: 1200px) {\n\n      .col-flex {\n        width: 33.333333%;\n      }\n    }\n\n  "]
                }] }
    ];
    CardListStencilComponent.propDecorators = {
        numCards: [{ type: Input }]
    };
    return CardListStencilComponent;
}());
if (false) {
    /** @type {?} */
    CardListStencilComponent.prototype.numCards;
    /** @type {?} */
    CardListStencilComponent.prototype.cards;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var SearchBarStencilComponent = /** @class */ (function () {
    function SearchBarStencilComponent() {
    }
    SearchBarStencilComponent.decorators = [
        { type: Component, args: [{
                    selector: 'search-bar-stencil',
                    template: "\n    <div class=\"search-bar-stencil-container\">\n      <div class=\"search-bar-stencil-line stencil-shimmer\">\n        <div class=\"search-bar-stencil-icon\"></div>\n      </div>\n    </div>\n  ",
                    styles: ["\n    .search-bar-stencil-container {\n      height: 52px;\n      display: flex;\n      align-content: center;\n      background-color: white;\n      border-radius: 2px;\n    }\n    .search-bar-stencil-line {\n      height: 30px;\n      width: 350px;\n      margin: auto 10px;\n      display: flex;\n      justify-content: flex-end;\n    }\n    .search-bar-stencil-icon {\n      background-color: white;\n      width: 20px;\n      height: 20px;\n      margin: auto 5px;\n    }\n  "]
                }] }
    ];
    return SearchBarStencilComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ListStencilComponent = /** @class */ (function () {
    function ListStencilComponent() {
        this.showHeader = true;
        this.numRows = 3;
        this.rowHeight = '51px'; // defaults to height of partner center business tab height (95px for marketplace)
        // defaults to height of partner center business tab height (95px for marketplace)
        this.sidePadding = '17px'; // defaults to padding on partner center business padding (38px for marketplace)
        // defaults to padding on partner center business padding (38px for marketplace)
        this.rows = []; // this is to turn the number of rows into an arbitrary list so we can loop through them
    }
    /**
     * @return {?}
     */
    ListStencilComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        for (var n = 0; n < this.numRows; n++) {
            this.rows.push(n);
        }
        // if you think this is gross i agree
        // if you think this is gross and actually have a solution hit me up otherwise just enjoy the magic.
        // determine the height of each row for the table
        this.listItemRowStyles = {
            'height': "" + this.rowHeight,
            'padding': "0 " + this.sidePadding
        };
    };
    ListStencilComponent.decorators = [
        { type: Component, args: [{
                    selector: 'list-stencil',
                    template: "\n    <mat-card class=\"list-container\">\n      <div *ngIf=\"showHeader\" class=\"list-header stencil-shimmer\" style=\"\"></div>\n      <div *ngFor=\"let _ of rows\">\n        <div class=\"list-item-row\" [ngStyle]=\"listItemRowStyles\">\n          <div class=\"stencil-shimmer\" style=\"margin: 0; padding: 0; width: 100%; height: 80%;\"></div>\n        </div>\n      </div>\n    </mat-card>\n  ",
                    styles: ["\n    .list-container { padding: 0; }\n    .list-header { height: 40px; }\n    .list-item-row { height: 50px; display: flex; justify-content: space-between; align-items: center; }\n  "]
                }] }
    ];
    ListStencilComponent.propDecorators = {
        showHeader: [{ type: Input }],
        numRows: [{ type: Input }],
        rowHeight: [{ type: Input }],
        sidePadding: [{ type: Input }]
    };
    return ListStencilComponent;
}());
if (false) {
    /** @type {?} */
    ListStencilComponent.prototype.showHeader;
    /** @type {?} */
    ListStencilComponent.prototype.numRows;
    /** @type {?} */
    ListStencilComponent.prototype.rowHeight;
    /** @type {?} */
    ListStencilComponent.prototype.sidePadding;
    /** @type {?} */
    ListStencilComponent.prototype.rows;
    /** @type {?} */
    ListStencilComponent.prototype.listItemRowStyles;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var StencilsModule = /** @class */ (function () {
    function StencilsModule() {
    }
    StencilsModule.decorators = [
        { type: NgModule, args: [{
                    imports: [CommonModule, MatCardModule, MatIconModule, MatInputModule, MatSelectModule, MatExpansionModule, MatCheckboxModule],
                    declarations: [DetailsStencilComponent, CardStencilComponent, CardListStencilComponent, SearchBarStencilComponent, ListStencilComponent],
                    exports: [DetailsStencilComponent, CardStencilComponent, CardListStencilComponent, SearchBarStencilComponent, ListStencilComponent]
                },] }
    ];
    return StencilsModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaAddonListComponent = /** @class */ (function () {
    function VaAddonListComponent(billingService, cdr) {
        this.billingService = billingService;
        this.cdr = cdr;
        this.showPricing = true;
        this._hasVerifiedContract = null;
        this._canAccessContractPricing = null;
        this.addonSelected = new EventEmitter();
        this.billedProductsMap = new Map();
        this.billedProductLoaded = new Map();
        this.subscriptions = [];
    }
    Object.defineProperty(VaAddonListComponent.prototype, "addons", {
        set: /**
         * @param {?} addons
         * @return {?}
         */
        function (addons) {
            this._addons = addons;
            this.populateBilledProduct();
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaAddonListComponent.prototype, "hasVerifiedContract", {
        set: /**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            this._hasVerifiedContract = value;
            this.populateBilledProduct();
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaAddonListComponent.prototype, "canAccessContractPricing", {
        set: /**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            this._canAccessContractPricing = value;
            this.populateBilledProduct();
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    VaAddonListComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        this.populateBilledProduct();
    };
    /**
     * @return {?}
     */
    VaAddonListComponent.prototype.populateBilledProduct = /**
     * @return {?}
     */
    function () {
        var _this = this;
        if (this.displayContractPricing()) {
            /** @type {?} */
            var billingIDs = this._addons.map((/**
             * @param {?} a
             * @return {?}
             */
            function (a) {
                _this.billedProductsMap.set(a.addonId, null);
                _this.billedProductLoaded.set(a.addonId, false);
                return a.billingId;
            }));
            this.subscriptions.push(this.billingService.getMultiProductPricing(this.partnerID, billingIDs).subscribe((/**
             * @param {?} pricing
             * @return {?}
             */
            function (pricing) {
                _this._addons.forEach((/**
                 * @param {?} addon
                 * @return {?}
                 */
                function (addon) {
                    /** @type {?} */
                    var addonPricing = pricing[addon.billingId];
                    if (!addonPricing) {
                        return;
                    }
                    /** @type {?} */
                    var billedProduct = buildBilledProductFromProductPricingAndAddon(addon, addonPricing);
                    _this.billedProductsMap.set(addon.addonId, billedProduct);
                    _this.billedProductLoaded.set(addon.addonId, true);
                }));
                _this.cdr.detectChanges();
            })));
        }
    };
    /**
     * @param {?} addonId
     * @return {?}
     */
    VaAddonListComponent.prototype.onClick = /**
     * @param {?} addonId
     * @return {?}
     */
    function (addonId) {
        this.addonSelected.emit(addonId);
    };
    /**
     * @param {?} object
     * @return {?}
     */
    VaAddonListComponent.prototype.instanceOfPricing = /**
     * @param {?} object
     * @return {?}
     */
    function (object) {
        if (typeof object === 'number') {
            return false;
        }
        return object.currency !== undefined && object.prices !== undefined;
    };
    /**
     * @param {?} addon
     * @return {?}
     */
    VaAddonListComponent.prototype.getDisplayPricing = /**
     * @param {?} addon
     * @return {?}
     */
    function (addon) {
        /** @type {?} */
        var price = addon.price;
        if (price && this.instanceOfPricing(price)) {
            return price;
        }
        return {
            currency: addon.currency,
            prices: [
                {
                    price: addon.price,
                    frequency: addon.billingFrequency ? addon.billingFrequency : 'Monthly'
                }
            ]
        };
    };
    /**
     * @return {?}
     */
    VaAddonListComponent.prototype.noData = /**
     * @return {?}
     */
    function () {
        return isNullOrUndefined(this._hasVerifiedContract) || isNullOrUndefined(this._canAccessContractPricing);
    };
    /**
     * @return {?}
     */
    VaAddonListComponent.prototype.displayContractPricing = /**
     * @return {?}
     */
    function () {
        return this._canAccessContractPricing && this._hasVerifiedContract;
    };
    /**
     * @param {?} addon
     * @return {?}
     */
    VaAddonListComponent.prototype.isBilledProductLoaded = /**
     * @param {?} addon
     * @return {?}
     */
    function (addon) {
        if (this.noData()) {
            return false;
        }
        if (this.displayContractPricing()) {
            /** @type {?} */
            var value = this.billedProductLoaded.get(addon.addonId);
            return value ? value : false;
        }
        return true;
    };
    /**
     * @return {?}
     */
    VaAddonListComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.subscriptions.forEach((/**
         * @param {?} subscription
         * @return {?}
         */
        function (subscription) { return subscription.unsubscribe(); }));
    };
    VaAddonListComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-addon-list',
                    template: "<mat-list *ngIf=\"_addons\" class=\"addon-list\">\n    <mat-divider></mat-divider>\n    <ng-container *ngFor=\"let addon of _addons\">\n        <mat-list-item (click)=\"onClick(addon.addonId)\">\n            <div class=\"addon-icon-title\">\n                <img *ngIf=\"addon.icon;else noIcon\" class=\"addon-icon\" [src]=\"addon.icon\" mat-list-avatar/>\n                <ng-template #noIcon>\n                    <mat-icon class=\"addon-default-icon\" mat-list-icon>add_circle</mat-icon>\n                </ng-template>\n                <div class=\"addon-title-tagline\">\n                    <p class=\"addon-title\" matLine>{{ addon.title }} </p>\n                    <p class=\"addon-tagline\" matLine>{{ addon.tagline }}</p>\n                </div>\n            </div>\n            <div *ngIf=\"showPricing\" class=\"price-section\">\n                <va-pricing\n                    [pricing]=\"getDisplayPricing(addon)\"\n                    [highlightPrice]=\"false\"\n                    [hasVerifiedContract]=\"_hasVerifiedContract\"\n                    [billedProduct]=\"billedProductsMap.get(addon.addonId)\"\n                    [loaded]=\"isBilledProductLoaded(addon)\">\n                </va-pricing>\n            </div>\n        </mat-list-item>\n        <mat-divider></mat-divider>\n    </ng-container>\n</mat-list>\n",
                    styles: [":host{display:block}h2+:host{margin:-8px 0}:host ::ng-deep .mat-list-item.mat-2-line{height:auto!important}:host ::ng-deep .mat-list .mat-list-item .mat-list-item-content{padding:8px;-webkit-box-align:start;align-items:flex-start;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}@media screen and (min-width:800px){:host ::ng-deep .mat-list .mat-list-item .mat-list-item-content{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}}.addon-list{position:relative}.addon-default-icon{margin:0 5px;color:#4caf50}.addon-icon{width:32px;height:32px}.addon-icon-title{-webkit-box-flex:1;flex-grow:1;display:-webkit-box;display:flex;width:100%}@media screen and (min-width:800px){.addon-icon-title{width:auto}}.addon-title-tagline{padding:0 16px 10px 8px;-webkit-box-flex:1;flex-grow:1}.addon-title-tagline .addon-title{color:#212121;font-size:16px;line-height:1.2;margin:6px 0;white-space:normal}.addon-title-tagline .addon-tagline{color:#616161;font-size:14px;margin:0;white-space:normal}.price-section{min-width:10em;margin-top:6px;flex-shrink:0}mat-list-item:hover{background-color:#fafafa!important;cursor:pointer!important}"]
                }] }
    ];
    /** @nocollapse */
    VaAddonListComponent.ctorParameters = function () { return [
        { type: BillingService },
        { type: ChangeDetectorRef }
    ]; };
    VaAddonListComponent.propDecorators = {
        addons: [{ type: Input, args: ['addons',] }],
        showPricing: [{ type: Input }],
        partnerID: [{ type: Input }],
        hasVerifiedContract: [{ type: Input, args: ['hasVerifiedContract',] }],
        canAccessContractPricing: [{ type: Input, args: ['canAccessContractPricing',] }],
        addonSelected: [{ type: Output }]
    };
    return VaAddonListComponent;
}());
if (false) {
    /** @type {?} */
    VaAddonListComponent.prototype._addons;
    /** @type {?} */
    VaAddonListComponent.prototype.showPricing;
    /** @type {?} */
    VaAddonListComponent.prototype.partnerID;
    /** @type {?} */
    VaAddonListComponent.prototype._hasVerifiedContract;
    /** @type {?} */
    VaAddonListComponent.prototype._canAccessContractPricing;
    /** @type {?} */
    VaAddonListComponent.prototype.addonSelected;
    /** @type {?} */
    VaAddonListComponent.prototype.billedProductsMap;
    /**
     * @type {?}
     * @private
     */
    VaAddonListComponent.prototype.billedProductLoaded;
    /**
     * @type {?}
     * @private
     */
    VaAddonListComponent.prototype.subscriptions;
    /**
     * @type {?}
     * @private
     */
    VaAddonListComponent.prototype.billingService;
    /**
     * @type {?}
     * @private
     */
    VaAddonListComponent.prototype.cdr;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaAddonListModule = /** @class */ (function () {
    function VaAddonListModule() {
    }
    VaAddonListModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        BillingModule,
                        CommonModule,
                        MatIconModule,
                        MatListModule$1,
                        MatDividerModule,
                        VaPricingModule
                    ],
                    declarations: [VaAddonListComponent],
                    exports: [VaAddonListComponent]
                },] }
    ];
    return VaAddonListModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function HeimdallServiceTokenInterface() { }
if (false) {
    /**
     * @param {?} category
     * @param {?} action
     * @param {?} label
     * @param {?=} value
     * @param {?=} dimensions
     * @return {?}
     */
    HeimdallServiceTokenInterface.prototype.track = function (category, action, label, value, dimensions) { };
}
/** @type {?} */
var HeimdallServiceToken = new InjectionToken('HeimdallService');
var HeimdallClient = /** @class */ (function () {
    function HeimdallClient(userEvents) {
        this.userEvents = userEvents;
    }
    /**
     * @param {?} category
     * @param {?} action
     * @param {?} label
     * @param {?=} value
     * @param {?=} dimensions
     * @return {?}
     */
    HeimdallClient.prototype.track = /**
     * @param {?} category
     * @param {?} action
     * @param {?} label
     * @param {?=} value
     * @param {?=} dimensions
     * @return {?}
     */
    function (category, action, label, value, dimensions) {
        this.userEvents.track(category, action, label, value, dimensions);
    };
    HeimdallClient.decorators = [
        { type: Injectable }
    ];
    /** @nocollapse */
    HeimdallClient.ctorParameters = function () { return [
        { type: undefined, decorators: [{ type: Inject, args: [HeimdallServiceToken,] }] }
    ]; };
    return HeimdallClient;
}());
if (false) {
    /**
     * @type {?}
     * @private
     */
    HeimdallClient.prototype.userEvents;
}
var HeimdallClientModule = /** @class */ (function () {
    function HeimdallClientModule() {
    }
    HeimdallClientModule.decorators = [
        { type: NgModule, args: [{
                    providers: [HeimdallClient]
                },] }
    ];
    return HeimdallClientModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
var STOREFRONT_FILTER_NAME = 'Store Filters';
/**
 * @record
 */
function StorefrontCategory() { }
if (false) {
    /** @type {?} */
    StorefrontCategory.prototype.id;
    /** @type {?} */
    StorefrontCategory.prototype.name;
    /** @type {?} */
    StorefrontCategory.prototype.packageIds;
}
var StorefrontComponent = /** @class */ (function () {
    function StorefrontComponent(userEvents, filterService, translateService) {
        this.userEvents = userEvents;
        this.filterService = filterService;
        this.translateService = translateService;
        this.useCustomCase = false;
        this.categorySelected = new EventEmitter();
        this.packageIdSelected = new EventEmitter();
        this.getDataForCategory = new EventEmitter();
        this.categories$$ = new BehaviorSubject([]);
        this.packagesMap$$ = new BehaviorSubject(new Map());
        this.searchTerm$$ = new BehaviorSubject('');
        this.selectedCateoryId$$ = new BehaviorSubject('');
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    Object.defineProperty(StorefrontComponent.prototype, "categories", {
        set: /**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            this.categories$$.next(value || []);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(StorefrontComponent.prototype, "categoryIdToStoreItemListMap", {
        set: /**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            this.packagesMap$$.next(value || new Map());
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    StorefrontComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        /** @type {?} */
        var lmiCategoryCheckboxList = LMI_CATEGORIES.map((/**
         * @param {?} category
         * @return {?}
         */
        function (category) {
            return new CheckboxFilterField({
                name: category.name,
                id: category.categoryId,
                value: false,
                condition: (/**
                 * @param {?} item
                 * @return {?}
                 */
                function (item) {
                    /** @type {?} */
                    var lmiCategories = [];
                    if (item.lmiCategories) {
                        lmiCategories = item.lmiCategories.map((/**
                         * @param {?} cat
                         * @return {?}
                         */
                        function (cat) {
                            return Categories[cat].toLowerCase();
                        }));
                    }
                    return lmiCategories.indexOf(category.categoryId) > -1;
                })
            });
        }));
        /** @type {?} */
        var lmiCategoryFilterSection = new FilterSection({
            title: 'LMI Category',
            type: 'or',
            fields: lmiCategoryCheckboxList
        });
        this.lmiCategoryFilter = new Filters(STOREFRONT_FILTER_NAME, [
            lmiCategoryFilterSection
        ]);
        this.filters$ = this.categories$$.pipe(map((/**
         * @param {?} categories
         * @return {?}
         */
        function (categories) {
            /** @type {?} */
            var tabbedFilterField = new TabbedFilterField({
                name: '',
                value: null,
                id: 'categorytab',
                options: categories
            });
            /** @type {?} */
            var filters = new Filters(STOREFRONT_FILTER_NAME, [
                new FilterSection({
                    title: 'Categories',
                    type: 'or',
                    fields: [tabbedFilterField]
                }),
                lmiCategoryFilterSection
            ]);
            return filters;
        })));
        this.filterService.setFilters(this.lmiCategoryFilter);
        this.searchTermSubscription = this.searchTerm$$.asObservable().pipe(debounceTime(300), distinctUntilChanged()).subscribe((/**
         * @param {?} searchTerm
         * @return {?}
         */
        function (searchTerm) { return _this.userEvents.track('store', 'search-input', '', 1, { 'searchTerm': searchTerm }); }));
        /** @type {?} */
        var selectedLMIFilters$ = this.filterService.filters.fieldValuesObservable.pipe(startWith([]), map((/**
         * @return {?}
         */
        function () {
            return _this.lmiCategoryFilter.fields.filter((/**
             * @param {?} item
             * @return {?}
             */
            function (item) { return item.value; }));
        })));
        this.showLMIFilter$ = selectedLMIFilters$.pipe(filter((/**
         * @param {?} selectedLMIFilters
         * @return {?}
         */
        function (selectedLMIFilters) { return !!selectedLMIFilters; })), take(1), map((/**
         * @param {?} selectedLMIFilters
         * @return {?}
         */
        function (selectedLMIFilters) { return selectedLMIFilters.length > 0; })));
        this.filteredItems$ = combineLatest(this.packagesMap$$, this.searchTerm$$, this.selectedCateoryId$$, selectedLMIFilters$).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 4), packages = _b[0], searchTerm = _b[1], selectedCategoryId = _b[2], selectedLMIFilters = _b[3];
            /** @type {?} */
            var storeItems = [];
            if (packages.size) {
                storeItems = (selectedCategoryId ? packages.get(selectedCategoryId) : packages.get(Array.from(packages.keys())[0]));
            }
            storeItems = storeItems ? _this.lmiCategoryFilter.applyFilters(storeItems) : [];
            return searchTerm ? storeItems.filter((/**
             * @param {?} item
             * @return {?}
             */
            function (item) { return item.name.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1; })) : storeItems;
        })));
    };
    /**
     * @return {?}
     */
    StorefrontComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.searchTermSubscription.unsubscribe();
    };
    /**
     * @param {?} term
     * @return {?}
     */
    StorefrontComponent.prototype.onSearchTermChanged = /**
     * @param {?} term
     * @return {?}
     */
    function (term) {
        this.searchTerm$$.next(term);
    };
    /**
     * @param {?} filterField
     * @return {?}
     */
    StorefrontComponent.prototype.onFieldValueChanged = /**
     * @param {?} filterField
     * @return {?}
     */
    function (filterField) {
        if (!(filterField instanceof TabbedFilterField)) {
            return;
        }
        this.selectedCateoryId$$.next(filterField.value.id);
        this.categorySelected.emit((/** @type {?} */ (filterField.value)));
        /** @type {?} */
        var currentStoreItemsForSelectCategory = this.packagesMap$$.getValue().get(filterField.value.id);
        if (!(currentStoreItemsForSelectCategory && currentStoreItemsForSelectCategory.length)) {
            this.getDataForCategory.emit((/** @type {?} */ (filterField.value)));
        }
    };
    /**
     * @param {?} item
     * @return {?}
     */
    StorefrontComponent.prototype.storeItemClicked = /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        this.packageIdSelected.emit(item.id);
    };
    StorefrontComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-storefront',
                    template: "<va-filter-container\n  [filters]=\"filters$ | async\"\n  (searchTermChanged)=\"onSearchTermChanged($event)\"\n  (fieldValueChanged)=\"onFieldValueChanged($event)\"\n  [theme]=\"'plain'\"\n  [filterIsOpen]=\"showLMIFilter$ | async\"\n  [useCustomCase]=\"useCustomCase\"\n  >\n    <va-store\n      [items]=\"filteredItems$ | async\"\n      [searchable]=\"false\"\n      (itemClicked)=\"storeItemClicked($event)\"\n      content>\n    </va-store>\n</va-filter-container>\n",
                    styles: [".public-store-container{padding:20px}va-store{margin-top:20px;display:block}@media only screen and (device-width:375px) and (-webkit-device-pixel-ratio:2){::ng-deep va-filter-tabbed{width:280px}::ng-deep .filter-container .toolbar.toolbar{background:0 0}}@media only screen and (device-width:414px) and (-webkit-device-pixel-ratio:3){::ng-deep va-filter-tabbed{width:280px}::ng-deep .filter-container .toolbar.toolbar{background:0 0}}"]
                }] }
    ];
    /** @nocollapse */
    StorefrontComponent.ctorParameters = function () { return [
        { type: undefined, decorators: [{ type: Inject, args: [HeimdallServiceToken,] }] },
        { type: FilterService },
        { type: TranslateService }
    ]; };
    StorefrontComponent.propDecorators = {
        categories: [{ type: Input }],
        categoryIdToStoreItemListMap: [{ type: Input }],
        useCustomCase: [{ type: Input }],
        categorySelected: [{ type: Output }],
        packageIdSelected: [{ type: Output }],
        getDataForCategory: [{ type: Output }]
    };
    return StorefrontComponent;
}());
if (false) {
    /** @type {?} */
    StorefrontComponent.prototype.useCustomCase;
    /** @type {?} */
    StorefrontComponent.prototype.categorySelected;
    /** @type {?} */
    StorefrontComponent.prototype.packageIdSelected;
    /** @type {?} */
    StorefrontComponent.prototype.getDataForCategory;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.categories$$;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.packagesMap$$;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.searchTerm$$;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.selectedCateoryId$$;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.lmiCategoryFilter;
    /** @type {?} */
    StorefrontComponent.prototype.filters$;
    /** @type {?} */
    StorefrontComponent.prototype.filteredItems$;
    /** @type {?} */
    StorefrontComponent.prototype.searchTermSubscription;
    /** @type {?} */
    StorefrontComponent.prototype.showLMIFilter$;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.userEvents;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.filterService;
    /**
     * @type {?}
     * @private
     */
    StorefrontComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var StoreModule = /** @class */ (function () {
    function StoreModule() {
    }
    StoreModule.decorators = [
        { type: NgModule, args: [{
                    imports: [CommonModule, UIKitModule, MatCardModule, MatIconModule, MatInputModule, FormsModule, ReactiveFormsModule,
                        MatSelectModule, MatExpansionModule, MatCheckboxModule, StoreCardModule, VaOrderFormModule, AddonModule, StencilsModule,
                        VaPricingModule, VaAddonListModule, HeimdallClientModule],
                    declarations: [StoreComponent, StorefrontComponent],
                    providers: [StoreService, FilterService],
                    exports: [StoreComponent, StoreCardModule, VaOrderFormModule, StencilsModule, StorefrontComponent]
                },] }
    ];
    return StoreModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function LmiCategory() { }
if (false) {
    /** @type {?} */
    LmiCategory.prototype.name;
    /** @type {?} */
    LmiCategory.prototype.categoryId;
}
/** @type {?} */
var LMI_CATEGORIES = [
    { name: 'Listings', categoryId: 'listings' },
    { name: 'Social', categoryId: 'social' },
    { name: 'Reputation', categoryId: 'reputation' },
    { name: 'SEO', categoryId: 'seo' },
    { name: 'Website', categoryId: 'website' },
    { name: 'Advertising', categoryId: 'advertising' },
    { name: 'Content & Experience', categoryId: 'content_and_experience' }
];
/** @type {?} */
var LMI_CATEGORY_MAP = LMI_CATEGORIES.reduce((/**
 * @param {?} previous
 * @param {?} current
 * @return {?}
 */
function (previous, current) {
    previous[current.categoryId] = current;
    return previous;
}), {});
/** @type {?} */
var LMI_CATEGORIES_BY_NAME = LMI_CATEGORIES.reduce((/**
 * @param {?} previous
 * @param {?} current
 * @return {?}
 */
function (previous, current) {
    previous[current.name] = current;
    return previous;
}), {});

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaSalespersonDetailsComponent = /** @class */ (function () {
    function VaSalespersonDetailsComponent() {
        this.showGetItNow = true;
        this.getItNow = new EventEmitter();
    }
    /**
     * @return {?}
     */
    VaSalespersonDetailsComponent.prototype.onGetItNowSelected = /**
     * @return {?}
     */
    function () {
        this.getItNow.emit(this.salesperson);
    };
    Object.defineProperty(VaSalespersonDetailsComponent.prototype, "iconUrl", {
        get: /**
         * @return {?}
         */
        function () {
            return this.salesperson && this.salesperson.photoUrlSecure ?
                this.salesperson.photoUrlSecure :
                'https://vbc-frontend.storage-download.googleapis.com/salesperson-details/default_sales_person.jpg';
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaSalespersonDetailsComponent.prototype, "name", {
        get: /**
         * @return {?}
         */
        function () {
            return this.salesperson && this.salesperson.formattedName ?
                this.salesperson.formattedName : '';
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaSalespersonDetailsComponent.prototype, "title", {
        get: /**
         * @return {?}
         */
        function () {
            return this.salesperson && this.salesperson.jobTitle ?
                this.salesperson.jobTitle : '';
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaSalespersonDetailsComponent.prototype, "email", {
        get: /**
         * @return {?}
         */
        function () {
            return this.salesperson && this.salesperson.email ?
                this.salesperson.email : '';
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaSalespersonDetailsComponent.prototype, "cityAndState", {
        get: /**
         * @return {?}
         */
        function () {
            return this.salesperson && this.salesperson.city && this.salesperson.state ?
                this.salesperson.city + ', ' + this.salesperson.state : '';
        },
        enumerable: true,
        configurable: true
    });
    VaSalespersonDetailsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-salesperson-details',
                    template: "<div class=\"container\">\n      <div class=\"salesperson-contact-info\">\n\n        <div class=\"salesperson-image\" *ngIf=\"salesperson\">\n          <va-icon [iconUrl]=\"iconUrl\" [diameter]=\"60\"></va-icon>\n        </div>\n\n        <div>\n          <div class=\"salesperson-name\">{{ name }}</div>\n          <div>{{ title }}</div>\n          <div>{{ cityAndState }}</div>\n          <div><a href=\"mailto:{{ email }}\">{{ email }}</a></div>\n        </div>\n\n        <div *ngIf=\"!salesperson\" class=\"generic-contact\">\n          Contact {{ brandName ? \"your \" + brandName : \"a\" }} representative today!\n        </div>\n\n         <div class=\"pricing\">\n          <va-pricing [pricing]=\"packagePricing\" wrapFrequency=\"true\"></va-pricing>\n          <div class=\"cta get-it-now-bottom-button\">\n            <button mat-button *ngIf=\"salesperson && showGetItNow\" (click)=\"onGetItNowSelected()\" class=\"now-button\">\n              Get it Now\n            </button>\n          </div>\n        </div>\n      </div>\n</div>\n",
                    styles: ["a{color:#1e88e5;text-decoration:none}.container{width:100%;margin:0 auto;background-color:#fff;box-shadow:1px 1px 1px 0 rgba(0,0,0,.2)}.salesperson-image{margin-right:20px}.salesperson-contact-info{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;padding:24px;font-size:14px;color:#9e9e9e}@media screen and (max-width:600px){.salesperson-contact-info{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;display:inline-block}}.salesperson-name{font-size:20px;font-weight:700;color:#212121}.generic-contact{margin-left:20px}.pricing{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-flex:1;flex-grow:1;-webkit-box-pack:end;justify-content:flex-end}.pricing ::ng-deep .price-box{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.pricing ::ng-deep .price-number{margin-right:4px}@media screen and (min-width:600px){.pricing{padding-left:16px}}.pricing va-pricing{margin-right:20px}.now-button{font-size:14px;color:#fff;background-color:#4caf50}"]
                }] }
    ];
    VaSalespersonDetailsComponent.propDecorators = {
        salesperson: [{ type: Input }],
        packagePricing: [{ type: Input }],
        brandName: [{ type: Input }],
        showGetItNow: [{ type: Input }],
        getItNow: [{ type: Output }]
    };
    return VaSalespersonDetailsComponent;
}());
if (false) {
    /** @type {?} */
    VaSalespersonDetailsComponent.prototype.salesperson;
    /** @type {?} */
    VaSalespersonDetailsComponent.prototype.packagePricing;
    /** @type {?} */
    VaSalespersonDetailsComponent.prototype.brandName;
    /** @type {?} */
    VaSalespersonDetailsComponent.prototype.showGetItNow;
    /** @type {?} */
    VaSalespersonDetailsComponent.prototype.getItNow;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaSalespersonDetailsModule = /** @class */ (function () {
    function VaSalespersonDetailsModule() {
    }
    VaSalespersonDetailsModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        MatButtonModule,
                        MatIconModule,
                        VaIconModule,
                        VaPricingModule,
                    ],
                    declarations: [
                        VaSalespersonDetailsComponent
                    ],
                    exports: [
                        VaSalespersonDetailsComponent
                    ],
                    entryComponents: [
                        VaSalespersonDetailsComponent
                    ]
                },] }
    ];
    return VaSalespersonDetailsModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var Package = /** @class */ (function (_super) {
    __extends(Package, _super);
    function Package() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    // the order the product / addons in the package
    /**
     * @param {?} data
     * @return {?}
     */
    Package.fromApi = 
    // the order the product / addons in the package
    /**
     * @param {?} data
     * @return {?}
     */
    function (data) {
        /** @type {?} */
        var newPackage = new Package();
        if (!data.pricing && data.selling_price) {
            data.pricing = {
                currency: data.currency,
                prices: [{
                        price: data.selling_price * 100,
                        frequency: data.billingFrequency,
                        isStartingPrice: false,
                    }]
            };
        }
        Object.assign(newPackage, data);
        if (!newPackage.name) {
            newPackage.name = 'Untitled';
        }
        if (data.created) {
            newPackage.createdDate = new Date(data.created);
        }
        if (data.updated) {
            newPackage.updatedDate = new Date(data.updated);
        }
        return newPackage;
    };
    Object.defineProperty(Package.prototype, "isPackageFree", {
        get: /**
         * @return {?}
         */
        function () {
            return this.isFree;
        },
        enumerable: true,
        configurable: true
    });
    return Package;
}(Sellable));
if (false) {
    /** @type {?} */
    Package.prototype.solution_id;
    /** @type {?} */
    Package.prototype.partner_id;
    /** @type {?} */
    Package.prototype.market_id;
    /** @type {?} */
    Package.prototype.name;
    /** @type {?} */
    Package.prototype.icon;
    /** @type {?} */
    Package.prototype.status;
    /** @type {?} */
    Package.prototype.tagline;
    /** @type {?} */
    Package.prototype.header_image_url;
    /** @type {?} */
    Package.prototype.content;
    /** @type {?} */
    Package.prototype.products;
    /** @type {?} */
    Package.prototype.addon_keys;
    /** @type {?} */
    Package.prototype.hide_product_icons_and_names;
    /** @type {?} */
    Package.prototype.hide_product_details;
    /** @type {?} */
    Package.prototype.createdDate;
    /** @type {?} */
    Package.prototype.updatedDate;
    /** @type {?} */
    Package.prototype.productOrder;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @param {?} combined
 * @param {?} order
 * @return {?}
 */
function orderProductsAndAddons(combined, order) {
    if (!order || order.length === 0) {
        return combined || [];
    }
    if (!combined || combined.length === 0) {
        return [];
    }
    /** @type {?} */
    var itemMap = (combined || []).reduce((/**
     * @param {?} m
     * @param {?} curr
     * @return {?}
     */
    function (m, curr) {
        m.set(getUniqueProductAddonId(curr), curr);
        return m;
    }), new Map());
    /** @type {?} */
    var combinedIdList = combined.map(getUniqueProductAddonId);
    /** @type {?} */
    var finalOrderedIds = combineProductOrderWithContainedProducts(order, combinedIdList);
    /** @type {?} */
    var orderedList = (/** @type {?} */ (finalOrderedIds.reduce((/**
     * @param {?} items
     * @param {?} id
     * @return {?}
     */
    function (items, id) {
        items.push(itemMap.get(id));
        return items;
    }), [])));
    return orderedList.filter(filterUniqueAndDefined);
}
/**
 * @param {?} elem
 * @param {?} pos
 * @param {?} arr
 * @return {?}
 */
function filterUniqueAndDefined(elem, pos, arr) {
    return elem && arr.indexOf(elem) === pos;
}
/**
 * @param {?} productOrder
 * @param {?} itemIds
 * @return {?}
 */
function combineProductOrderWithContainedProducts(productOrder, itemIds) {
    if (itemIds == null || itemIds.length === 0) {
        return [];
    }
    if (!productOrder || productOrder.length === 0) {
        return itemIds.filter(filterUniqueAndDefined);
    }
    return productOrder
        .filter((/**
     * @param {?} elem
     * @return {?}
     */
    function (elem) { return itemIds.indexOf(elem) >= 0; }))
        .concat(itemIds)
        .filter(filterUniqueAndDefined);
}
/**
 * @param {?} thing
 * @return {?}
 */
function getUniqueProductAddonId(thing) {
    return thing['addonId'] || thing['productId'];
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPackageDetailsComponent = /** @class */ (function () {
    function VaPackageDetailsComponent() {
        this.showActionButton = true;
        this.showPricing = true;
        this.actionLabel = 'Get It Now';
        this.getItNow = new EventEmitter();
        this.standAloneProducts$$ = new BehaviorSubject([]);
        this.products$ = new BehaviorSubject([]);
        this.addons$ = new BehaviorSubject([]);
        this.pkg$ = new ReplaySubject(1);
        this.itemSelectedEvent$ = new ReplaySubject(1);
        this.combinedItemsList$ = combineLatest(this.products$, this.addons$, (/**
         * @param {?} products
         * @param {?} addons
         * @return {?}
         */
        function (products, addons) {
            return (/** @type {?} */ ([].concat(products || []).concat(addons || [])));
        }));
        this.orderedItemsList$ = combineLatest(this.combinedItemsList$, this.pkg$, (/**
         * @param {?} combined
         * @param {?} pkg
         * @return {?}
         */
        function (combined, pkg) {
            return orderProductsAndAddons(combined, pkg ? pkg.productOrder || [] : []);
        }));
        /** @type {?} */
        var nonEmptyCombinedItemsList = this.combinedItemsList$.pipe(skipWhile((/**
         * @param {?} items
         * @return {?}
         */
        function (items) { return !items || items.length === 0; })), shareReplay(1));
        // Need to map to an index because that's how product selection works.
        /** @type {?} */
        var initialSelectedItem$ = nonEmptyCombinedItemsList.pipe(map((/**
         * @param {?} _
         * @return {?}
         */
        function (_) { return 0; })), take(1));
        /** @type {?} */
        var mergedSelection = merge(initialSelectedItem$, this.itemSelectedEvent$);
        this.selectedItem$ = combineLatest(mergedSelection, this.orderedItemsList$).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), index = _b[0], items = _b[1];
            return items[index];
        })));
        this.lmiCategories$ = this.products$.pipe(skipWhile((/**
         * @param {?} products
         * @return {?}
         */
        function (products) { return !products || products.length === 0; })), map((/**
         * @param {?} products
         * @return {?}
         */
        function (products) {
            return VaPackageDetailsComponent.getLmiCategories(products);
        })));
        this.productNameForSingleAddon$ = nonEmptyCombinedItemsList.pipe(map((/**
         * @param {?} items
         * @return {?}
         */
        function (items) {
            return VaPackageDetailsComponent.getProductNameForSingleAddon(items);
        })));
        this.displayTagName$ = combineLatest(this.pkg$, this.combinedItemsList$).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), pkg = _b[0], items = _b[1];
            return VaPackageDetailsComponent.getDisplayTagline(pkg, items);
        })));
    }
    Object.defineProperty(VaPackageDetailsComponent.prototype, "standAloneProducts", {
        set: /**
         * @param {?} standAloneProducts
         * @return {?}
         */
        function (standAloneProducts) {
            this.standAloneProducts$$.next(standAloneProducts);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDetailsComponent.prototype, "products", {
        set: /**
         * @param {?} products
         * @return {?}
         */
        function (products) {
            this.products$.next(products);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDetailsComponent.prototype, "addons", {
        set: /**
         * @param {?} addons
         * @return {?}
         */
        function (addons) {
            this.addons$.next(addons);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDetailsComponent.prototype, "pkg", {
        set: /**
         * @param {?} pkg
         * @return {?}
         */
        function (pkg) {
            this.pkg$.next(pkg);
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} products
     * @return {?}
     */
    VaPackageDetailsComponent.getLmiCategories = /**
     * @param {?} products
     * @return {?}
     */
    function (products) {
        /** @type {?} */
        var lmiCategories = [];
        if (products) {
            products.forEach((/**
             * @param {?} product
             * @return {?}
             */
            function (product) {
                lmiCategories = lmiCategories.concat(product.getLmiCategoryNames());
            }));
        }
        return new Set(lmiCategories);
    };
    /**
     * @param {?} pkg
     * @param {?} items
     * @return {?}
     */
    VaPackageDetailsComponent.getDisplayTagline = /**
     * @param {?} pkg
     * @param {?} items
     * @return {?}
     */
    function (pkg, items) {
        if (pkg && pkg.tagline) {
            return pkg.tagline;
        }
        else if (items && items.length === 1) {
            // Single product / addon package.
            return items[0].tagline || '';
        }
        return '';
    };
    /**
     * @param {?} items
     * @return {?}
     */
    VaPackageDetailsComponent.getProductNameForSingleAddon = /**
     * @param {?} items
     * @return {?}
     */
    function (items) {
        if (items && items.length === 1 && items[0] instanceof Addon) {
            /** @type {?} */
            var addon = (/** @type {?} */ (items[0]));
            return addon.productName;
        }
    };
    /**
     * @param {?} i
     * @return {?}
     */
    VaPackageDetailsComponent.prototype.selectItem = /**
     * @param {?} i
     * @return {?}
     */
    function (i) {
        this.itemSelectedEvent$.next(i);
    };
    /**
     * @return {?}
     */
    VaPackageDetailsComponent.prototype.emitGetItNow = /**
     * @return {?}
     */
    function () {
        this.getItNow.emit();
    };
    VaPackageDetailsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-package-details',
                    template: "<div *ngIf=\"pkg$ | async as pkg\" class=\"page\">\n  <va-header-container [iconUrl]=\"pkg.icon\"\n                       [title]=\"pkg.name\"\n                       [tagline]=\"displayTagName$ | async\"\n                       [prerequisite]=\"productNameForSingleAddon$ | async\"\n                       [chipLabels]=\"lmiCategories$ | async\"\n                       [pricing]=\"pkg.pricing\"\n                       [pricingLabel]=\"'Pricing'\"\n                       [showAction]=\"showActionButton\"\n                       [showPricing]=\"showPricing\"\n                       [actionLabel]=\"actionLabel\"\n                       [actionEnabled]=true\n                       (actionSelected)=\"emitGetItNow()\"\n  ></va-header-container>\n  <ng-container *ngIf=\"pkg?.content\">\n    <va-selling-info [description]=\"pkg.content\"></va-selling-info>\n  </ng-container>\n\n  <va-products-nav [items]=\"orderedItemsList$ | async\"\n                   [hideItemsNav]=\"pkg?.hide_product_icons_and_names\"\n                   (itemSelected)=\"selectItem($event)\"></va-products-nav>\n\n  <ng-container *ngIf=\"selectedItem$ | async as selectedItem\">\n    <div *ngIf=\"!pkg?.hide_product_details\" class=\"package-content\">\n      <div class=\"left-column\">\n        <section\n          *ngIf=\"(selectedItem.endUserMarketing?.description || selectedItem.endUserMarketing?.keySellingPoints) ||\n             (selectedItem.description || selectedItem.keySellingPoints)\">\n          <va-selling-info [description]=\"selectedItem.endUserMarketing?.description || selectedItem.description\"\n                           [keySellingPoints]=\"selectedItem.endUserMarketing?.keySellingPoints || selectedItem.keySellingPoints\"></va-selling-info>\n        </section>\n\n        <section *ngIf=\"(selectedItem.endUserMarketing?.faqs?.length > 0\n          && selectedItem.endUserMarketing?.faqs[0].question) || selectedItem.faqs?.length > 0\">\n          <h2 class=\"va-component-title\">FAQs</h2>\n          <va-faqs [faqs]=\"selectedItem.endUserMarketing?.faqs || selectedItem.faqs\"></va-faqs>\n        </section>\n      </div>\n\n      <div class=\"right-column\">\n        <section *ngIf=\"selectedItem.screenshotUrls?.length > 0 || selectedItem.screenshots?.length > 0\">\n          <h2 class=\"va-component-title\">Gallery</h2>\n          <va-image-gallery [imageUrls]=\"selectedItem.screenshotUrls || selectedItem.screenshots\"></va-image-gallery>\n        </section>\n\n        <section *ngIf=\"selectedItem.endUserMarketing?.files?.length > 0 || selectedItem.files?.length > 0\">\n          <h2 class=\"va-component-title\">Files</h2>\n          <va-files [files]=\"selectedItem.endUserMarketingFiles || selectedItem.files\"></va-files>\n        </section>\n      </div>\n    </div>\n  </ng-container>\n</div>\n",
                    styles: [":host{display:block;font-size:14px;line-height:1.4}:host *{box-sizing:border-box}.va-component-title{font-size:24px;font-weight:300;margin-top:0}@media screen and (min-width:600px){.va-component-title{font-size:32px}}img{max-width:100%}va-icon{display:inline-block}.page{position:relative;margin:0 auto 20px;background:#fff;color:#212121;box-shadow:0 3px 10px rgba(33,33,33,.3);overflow:hidden;font-size:16px}.page .item-amount{color:#9e9e9e;font-size:14px;text-align:right;margin:0 24px 8px}section{padding:24px}.left-column{width:66%}@media screen and (max-width:600px){.left-column{width:100%}}.right-column{width:34%}.package-content{display:-webkit-box;display:flex}@media screen and (max-width:600px){.right-column{width:100%}.package-content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}}"]
                }] }
    ];
    /** @nocollapse */
    VaPackageDetailsComponent.ctorParameters = function () { return []; };
    VaPackageDetailsComponent.propDecorators = {
        showActionButton: [{ type: Input }],
        showPricing: [{ type: Input }],
        actionLabel: [{ type: Input }],
        getItNow: [{ type: Output }],
        standAloneProducts: [{ type: Input }],
        products: [{ type: Input }],
        addons: [{ type: Input }],
        pkg: [{ type: Input }]
    };
    return VaPackageDetailsComponent;
}());
if (false) {
    /** @type {?} */
    VaPackageDetailsComponent.prototype.showActionButton;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.showPricing;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.actionLabel;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.getItNow;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.standAloneProducts$$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.products$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.addons$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.pkg$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.itemSelectedEvent$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.selectedItem$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.combinedItemsList$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.orderedItemsList$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.lmiCategories$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.productNameForSingleAddon$;
    /** @type {?} */
    VaPackageDetailsComponent.prototype.displayTagName$;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaProductsNavComponent = /** @class */ (function () {
    function VaProductsNavComponent(translateService) {
        this.translateService = translateService;
        this.itemSelected = new EventEmitter();
        this.selectedIndex = 0;
        this.pageMarker = 0;
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    /**
     * @param {?} index
     * @return {?}
     */
    VaProductsNavComponent.prototype.onItemSelected = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        this.selectedIndex = index;
        this.itemSelected.emit(index);
    };
    /**
     * @param {?} slides
     * @return {?}
     */
    VaProductsNavComponent.prototype.moveSlides = /**
     * @param {?} slides
     * @return {?}
     */
    function (slides) {
        /** @type {?} */
        var sliderWidth = Math.round(slides.offsetWidth / slides.children[0].clientWidth);
        /** @type {?} */
        var numSlides = Math.ceil(slides.children.length / sliderWidth);
        if (numSlides === 0) {
            return;
        }
        /** @type {?} */
        var pageWidth = slides.offsetWidth;
        /** @type {?} */
        var move = 0;
        if (this.pageMarker === -1) {
            this.pageMarker = numSlides - 1; // go to end
            move = pageWidth * this.pageMarker;
            slides.style.left = "-" + move + "px";
        }
        else if (this.pageMarker >= numSlides) {
            slides.style.left = '0px';
            this.pageMarker = 0; // reset
        }
        else {
            move = pageWidth * this.pageMarker;
            slides.style.left = "-" + move + "px";
        }
    };
    /**
     * @param {?} slides
     * @return {?}
     */
    VaProductsNavComponent.prototype.pageNext = /**
     * @param {?} slides
     * @return {?}
     */
    function (slides) {
        this.pageMarker++;
        this.moveSlides(slides);
    };
    /**
     * @param {?} slides
     * @return {?}
     */
    VaProductsNavComponent.prototype.pagePrev = /**
     * @param {?} slides
     * @return {?}
     */
    function (slides) {
        this.pageMarker--;
        this.moveSlides(slides);
    };
    VaProductsNavComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-products-nav',
                    template: "<p *ngIf=\"items?.length > 1\" class=\"item-amount\">{{ 'FRONTEND.STORE.CONTAINS_NUM_ITEMS' | translate: {itemCount: items.length}  }}</p>\n<div class=\"wrapper\">\n  <nav *ngIf=\"items && !hideItemsNav\" (swipeleft)=\"pageNext(slides)\" (swiperight)=\"pagePrev(slides)\">\n    <div [ngClass]=\"{'hide-arrows': items && items.length < 5}\">\n      <span class=\"prev\" (click)=\"pagePrev(slides)\"><mat-icon>keyboard_arrow_left</mat-icon></span>\n      <span class=\"next\" (click)=\"pageNext(slides)\"><mat-icon>keyboard_arrow_right</mat-icon></span>\n    </div>\n    <ul class=\"slides\" #slides>\n      <li *ngFor=\"let item of items; index as i;\" (click)=\"onItemSelected(i)\">\n        <a [ngClass]=\"{'active': i === selectedIndex}\">\n          <span class=\"icon-area\">\n            <va-icon [iconUrl]=\"item.icon || item.iconUrl\" [name]=\"item.name || item.title\" [diameter]=\"80\"></va-icon>\n            <va-icon *ngIf=\"item.addonId\" class=\"addon-indicator\" [iconUrl]=\"item.productIcon\" [name]=\"item.productName\" [diameter]=\"24\"></va-icon>\n          </span>\n          <p>{{ item.name || item.title }}</p>\n          <div *ngIf=\"item.addonId\">\n            <span class=\"requires-text\">{{ 'FRONTEND.STORE.REQUIRES' | translate }}</span>\n            <span>{{item.productName}}</span>\n          </div>\n        </a>\n      </li>\n    </ul>\n  </nav>\n</div>\n",
                    styles: ["nav{position:relative;width:350px;margin:0 auto;background:#fff;border:1px solid #e0e0e0;border-width:1px 0;overflow:hidden}nav ul{display:-webkit-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0 50px;padding:0;position:relative;left:0;-webkit-transition:left .3s;transition:left .3s;word-break:break-word}nav li{min-width:100%;-webkit-box-flex:1;flex:1 0 25%;text-align:center;font-size:14px}nav li:first-child a{border-right:1px solid #e0e0e0}nav a{position:relative;display:block;height:100%;padding:20px;text-decoration:none;color:#212121;-webkit-transition:background .3s;transition:background .3s;-webkit-box-align:center;align-items:center;border-right:1px solid #e0e0e0;cursor:pointer}nav a:hover{background-color:rgba(255,255,255,.6)}nav a.active{background-color:#fff}nav a.active:after{content:'';display:block;position:absolute;bottom:-1px;left:0;width:100%;height:1px;background-color:#fff}nav p{margin-bottom:0}nav .icon img{width:80px;min-width:80px;height:80px}nav .next,nav .prev{position:absolute;height:100%;width:50px;top:0;background:rgba(33,33,33,.1);cursor:pointer;text-align:center;opacity:1;-webkit-transition:opacity .3s;transition:opacity .3s;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;z-index:1}nav .next:not(.disabled):hover,nav .prev:not(.disabled):hover{background:rgba(33,33,33,.3)}nav .prev{left:0}nav .next{right:0}nav .disabled{cursor:default;opacity:0}@media screen and (min-width:600px){nav{width:auto;overflow:initial}nav li{min-width:0;width:25%;-webkit-box-flex:0;flex-grow:0}nav .hide-arrows{display:none}nav .hide-arrows+.slides{margin:0}}va-icon{display:inline-block}.item-amount{color:#9e9e9e;font-size:14px;text-align:right;margin:0 24px 8px}.wrapper{overflow:hidden}.requires-text{color:#9e9e9e}.icon-area{position:relative;display:inline-block}.addon-indicator{position:absolute;border:2px solid #fff;border-radius:50%;bottom:-2px;right:-2px}"]
                }] }
    ];
    /** @nocollapse */
    VaProductsNavComponent.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    VaProductsNavComponent.propDecorators = {
        items: [{ type: Input }],
        hideItemsNav: [{ type: Input }],
        itemSelected: [{ type: Output }]
    };
    return VaProductsNavComponent;
}());
if (false) {
    /** @type {?} */
    VaProductsNavComponent.prototype.items;
    /** @type {?} */
    VaProductsNavComponent.prototype.hideItemsNav;
    /** @type {?} */
    VaProductsNavComponent.prototype.itemSelected;
    /** @type {?} */
    VaProductsNavComponent.prototype.selectedIndex;
    /** @type {?} */
    VaProductsNavComponent.prototype.pageMarker;
    /**
     * @type {?}
     * @private
     */
    VaProductsNavComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ProductsNavV2Component = /** @class */ (function () {
    function ProductsNavV2Component(translateService) {
        this.translateService = translateService;
        this.itemSelected = new EventEmitter();
        this.selected_id = '';
        this.pageMarker = 0;
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    /**
     * @param {?} id
     * @return {?}
     */
    ProductsNavV2Component.prototype.onItemSelected = /**
     * @param {?} id
     * @return {?}
     */
    function (id) {
        this.selected_id = id;
        this.itemSelected.emit(id);
    };
    /**
     * @param {?} slides
     * @return {?}
     */
    ProductsNavV2Component.prototype.moveSlides = /**
     * @param {?} slides
     * @return {?}
     */
    function (slides) {
        /** @type {?} */
        var sliderWidth = Math.round(slides.offsetWidth / slides.children[0].clientWidth);
        /** @type {?} */
        var numSlides = Math.ceil(slides.children.length / sliderWidth);
        if (numSlides === 0) {
            return;
        }
        /** @type {?} */
        var pageWidth = slides.offsetWidth;
        /** @type {?} */
        var move = 0;
        if (this.pageMarker === -1) {
            this.pageMarker = numSlides - 1; // go to end
            move = pageWidth * this.pageMarker;
            slides.style.left = "-" + move + "px";
        }
        else if (this.pageMarker >= numSlides) {
            slides.style.left = '0px';
            this.pageMarker = 0; // reset
        }
        else {
            move = pageWidth * this.pageMarker;
            slides.style.left = "-" + move + "px";
        }
    };
    /**
     * @param {?} slides
     * @return {?}
     */
    ProductsNavV2Component.prototype.pageNext = /**
     * @param {?} slides
     * @return {?}
     */
    function (slides) {
        this.pageMarker++;
        this.moveSlides(slides);
    };
    /**
     * @param {?} slides
     * @return {?}
     */
    ProductsNavV2Component.prototype.pagePrev = /**
     * @param {?} slides
     * @return {?}
     */
    function (slides) {
        this.pageMarker--;
        this.moveSlides(slides);
    };
    ProductsNavV2Component.decorators = [
        { type: Component, args: [{
                    selector: 'va-products-nav-v2',
                    template: "<p *ngIf=\"items?.length > 1\" class=\"item-amount\">{{ 'FRONTEND.STORE.CONTAINS_NUM_ITEMS' | translate: {itemCount: items.length} }}</p>\n<div class=\"wrapper\">\n  <nav *ngIf=\"items && !hideItemsNav\" (swipeleft)=\"pageNext(slides)\" (swiperight)=\"pagePrev(slides)\">\n    <div [ngClass]=\"{'hide-arrows': items && items.length < 5}\">\n      <span class=\"prev\" (click)=\"pagePrev(slides)\"><mat-icon>keyboard_arrow_left</mat-icon></span>\n      <span class=\"next\" (click)=\"pageNext(slides)\"><mat-icon>keyboard_arrow_right</mat-icon></span>\n    </div>\n    <ul class=\"slides\" #slides>\n      <li *ngFor=\"let lineItem of items;\" (click)=\"onItemSelected(lineItem?.item?.id)\">\n        <a [ngClass]=\"{'active': lineItem?.item?.id === selected_id}\">\n          <span class=\"icon-area\">\n            <va-icon [iconUrl]=\"lineItem?.item?.icon\" [name]=\"lineItem?.item?.name\" [diameter]=\"80\"></va-icon>\n            <va-icon *ngIf=\"lineItem?.parent?.id\" class=\"addon-indicator\" [iconUrl]=\"lineItem?.parent?.icon\" [name]=\"lineItem?.parent?.name\"\n                     [diameter]=\"24\"></va-icon>\n          </span>\n          <div class=\"name-container\">\n            <div>{{ lineItem?.item?.name }}</div>\n            <div *ngIf=\"lineItem?.item?.editionName\" class=\"edition-name\">{{ lineItem.item.editionName }}</div>\n          </div>\n          <div *ngIf=\"lineItem?.parent?.id\">\n            <span class=\"requires-text\">{{ 'FRONTEND.STORE.REQUIRES' | translate }} </span>\n            <span>{{lineItem?.parent.name}}</span>\n          </div>\n        </a>\n      </li>\n    </ul>\n  </nav>\n</div>\n",
                    styles: [".name-container{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.name-container va-badge{margin-top:12px;margin-left:6px}nav{position:relative;width:350px;margin:0 auto;background:#fff;border:1px solid #e0e0e0;border-width:1px 0;overflow:hidden}nav ul{display:-webkit-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0 50px;padding:0;position:relative;left:0;-webkit-transition:left .3s;transition:left .3s;word-break:break-word}nav li{min-width:100%;-webkit-box-flex:1;flex:1 0 25%;text-align:center;font-size:14px}nav li:first-child a{border-right:1px solid #e0e0e0}nav a{position:relative;display:block;height:100%;padding:20px;text-decoration:none;color:#212121;-webkit-transition:background .3s;transition:background .3s;-webkit-box-align:center;align-items:center;border-right:1px solid #e0e0e0;cursor:pointer}nav a:hover{background-color:rgba(255,255,255,.6)}nav a.active{background-color:#fff}nav a.active:after{content:'';display:block;position:absolute;bottom:-1px;left:0;width:100%;height:1px;background-color:#fff}nav p{margin-bottom:0}nav .icon img{width:80px;min-width:80px;height:80px}nav .next,nav .prev{position:absolute;height:100%;width:50px;top:0;background:rgba(33,33,33,.1);cursor:pointer;text-align:center;opacity:1;-webkit-transition:opacity .3s;transition:opacity .3s;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;z-index:1}nav .next:not(.disabled):hover,nav .prev:not(.disabled):hover{background:rgba(33,33,33,.3)}nav .prev{left:0}nav .next{right:0}nav .disabled{cursor:default;opacity:0}@media screen and (min-width:600px){nav{width:auto;overflow:initial}nav li{min-width:0;width:25%;-webkit-box-flex:0;flex-grow:0}nav .hide-arrows{display:none}nav .hide-arrows+.slides{margin:0}}va-icon{display:inline-block}.item-amount{color:#9e9e9e;font-size:14px;text-align:right;margin:0 24px 8px}.wrapper{overflow:hidden}.requires-text{color:#9e9e9e}.icon-area{position:relative;display:inline-block}.addon-indicator{position:absolute;border:2px solid #fff;border-radius:50%;bottom:-2px;right:-2px}.edition-name{color:#9e9e9e;font-style:italic;text-align:center;width:100%;font-size:16px;margin-bottom:4px}"]
                }] }
    ];
    /** @nocollapse */
    ProductsNavV2Component.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    ProductsNavV2Component.propDecorators = {
        items: [{ type: Input }],
        hideItemsNav: [{ type: Input }],
        itemSelected: [{ type: Output }]
    };
    return ProductsNavV2Component;
}());
if (false) {
    /** @type {?} */
    ProductsNavV2Component.prototype.items;
    /** @type {?} */
    ProductsNavV2Component.prototype.hideItemsNav;
    /** @type {?} */
    ProductsNavV2Component.prototype.itemSelected;
    /** @type {?} */
    ProductsNavV2Component.prototype.selected_id;
    /** @type {?} */
    ProductsNavV2Component.prototype.pageMarker;
    /**
     * @type {?}
     * @private
     */
    ProductsNavV2Component.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaProductsNavModule = /** @class */ (function () {
    function VaProductsNavModule() {
    }
    VaProductsNavModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        MatIconModule,
                        VaIconModule,
                        VaBadgeModule,
                        TranslateModule
                    ],
                    declarations: [VaProductsNavComponent, ProductsNavV2Component],
                    exports: [VaProductsNavComponent, ProductsNavV2Component]
                },] }
    ];
    return VaProductsNavModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPackageDetailsModule = /** @class */ (function () {
    function VaPackageDetailsModule() {
    }
    VaPackageDetailsModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        VaImageGalleryModule, CommonModule, MatIconModule, VaSafeHtmlModule, VaIconModule,
                        VaPricingModule, MatButtonModule, VaFilesModule, VaFaqsModule, VaSellingInfoModule,
                        VaHeaderContainerModule, VaAddonListModule, VaProductsNavModule
                    ],
                    declarations: [VaPackageDetailsComponent],
                    exports: [VaPackageDetailsComponent],
                    entryComponents: [VaPackageDetailsComponent]
                },] }
    ];
    return VaPackageDetailsModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var PackageDetails = /** @class */ (function () {
    function PackageDetails() {
    }
    Object.defineProperty(PackageDetails.prototype, "isPackageFree", {
        get: /**
         * @return {?}
         */
        function () {
            /** @type {?} */
            var isFreeHelper = (/**
             * @param {?} prices
             * @return {?}
             */
            function (prices) {
                return prices ? prices.some((/**
                 * @param {?} p
                 * @return {?}
                 */
                function (p) { return p.price === 0 || p.price === undefined; })) : false;
            });
            return this.pricing && isFreeHelper(this.pricing.prices);
        },
        enumerable: true,
        configurable: true
    });
    return PackageDetails;
}());
if (false) {
    /** @type {?} */
    PackageDetails.prototype.solution_id;
    /** @type {?} */
    PackageDetails.prototype.partner_id;
    /** @type {?} */
    PackageDetails.prototype.market_id;
    /** @type {?} */
    PackageDetails.prototype.name;
    /** @type {?} */
    PackageDetails.prototype.icon;
    /** @type {?} */
    PackageDetails.prototype.status;
    /** @type {?} */
    PackageDetails.prototype.tagline;
    /** @type {?} */
    PackageDetails.prototype.header_image_url;
    /** @type {?} */
    PackageDetails.prototype.content;
    /** @type {?} */
    PackageDetails.prototype.hide_product_icons_and_names;
    /** @type {?} */
    PackageDetails.prototype.hide_product_details;
    /** @type {?} */
    PackageDetails.prototype.createdDate;
    /** @type {?} */
    PackageDetails.prototype.updatedDate;
    /** @type {?} */
    PackageDetails.prototype.pricing;
    /** @type {?} */
    PackageDetails.prototype.line_items;
    /** @type {?} */
    PackageDetails.prototype.market_action;
}
/**
 * @param {?} data
 * @param {?} products
 * @return {?}
 */
function convertToPackageDetails(data, products) {
    if (!data) {
        return undefined;
    }
    /** @type {?} */
    var newPackage = new PackageDetails();
    if (!data.pricing) {
        data.pricing = Pricing$1.fromProto({
            currency: undefined,
            prices: [{
                    price: 0,
                    frequency: undefined,
                    isStartingPrice: false,
                }]
        });
    }
    Object.assign(newPackage, data);
    if (!newPackage.name) {
        newPackage.name = 'Untitled';
    }
    if (data.created) {
        newPackage.createdDate = new Date(data.created);
    }
    if (data.updated) {
        newPackage.updatedDate = new Date(data.updated);
    }
    if (data.lineItems) {
        newPackage.line_items = convertProtoLineItemsToStoreLineItems(data.lineItems, products);
    }
    if (typeof data.pricing.currency === 'number') {
        newPackage.pricing.currency = Currency[data.pricing.currency];
    }
    return newPackage;
}
/**
 * @param {?} protoLineItems
 * @param {?} products
 * @return {?}
 */
function convertProtoLineItemsToStoreLineItems(protoLineItems, products) {
    if (!protoLineItems || !protoLineItems.lineItems || protoLineItems.lineItems.length === 0 || !products || products.length === 0) {
        return [];
    }
    return protoLineItems.lineItems.map((/**
     * @param {?} lineItem
     * @return {?}
     */
    function (lineItem) {
        /** @type {?} */
        var product = products.find((/**
         * @param {?} p
         * @return {?}
         */
        function (p) { return p.productId === lineItem.id; }));
        /** @type {?} */
        var parent;
        if (!!lineItem.parentId) {
            parent = products.find((/**
             * @param {?} p
             * @return {?}
             */
            function (p) { return p.productId === lineItem.parentId; }));
        }
        return convertProtoLineItemToStoreLineItem(lineItem, product, parent);
    }));
}
/**
 * @param {?} protoLineItem
 * @param {?} product
 * @param {?=} parentProduct
 * @return {?}
 */
function convertProtoLineItemToStoreLineItem(protoLineItem, product, parentProduct) {
    if (!product || !protoLineItem) {
        return undefined;
    }
    /** @type {?} */
    var files = [];
    if (product.pdfUploadUrls && product.pdfUploadUrls.length > 0) {
        files = product.pdfUploadUrls.map((/**
         * @param {?} url
         * @return {?}
         */
        function (url) { return new File(url); }));
    }
    /** @type {?} */
    var lineItem = (/** @type {?} */ ({
        item: {
            id: protoLineItem.id,
            editionId: protoLineItem.editionId,
            icon: product.iconUrl,
            name: product.name,
            editionName: '',
            description: product.description,
            keySellingPoints: product.keySellingPoints,
            faqs: product.faqs,
            files: files,
            screenshotUrls: product.screenshotUrls,
            lmiCategories: [],
        },
        quantity: protoLineItem.quantity,
        parent: {}
    }));
    if (protoLineItem.parentId && parentProduct) {
        lineItem.parent = {
            id: protoLineItem.parentId,
            editionId: '',
            icon: parentProduct.iconUrl,
            name: parentProduct.name,
            editionName: '',
        };
    }
    return lineItem;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPackageDetailsV2Component = /** @class */ (function () {
    function VaPackageDetailsV2Component(translateService) {
        var _this = this;
        this.translateService = translateService;
        this.showActionButton = true;
        this.showPricing = true;
        this.getItNow = new EventEmitter();
        this.pkg$$ = new ReplaySubject(1);
        this.itemSelectedEvent$$ = new BehaviorSubject('');
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
        this.orderedLineItems$ = this.pkg$$.pipe(map((/**
         * @param {?} pkg
         * @return {?}
         */
        function (pkg) { return pkg.line_items; })), filter((/**
         * @param {?} items
         * @return {?}
         */
        function (items) { return !!items || items.length === 0; })), shareReplay(1));
        this.productNameForSingleAddon$ = this.orderedLineItems$.pipe(map((/**
         * @param {?} items
         * @return {?}
         */
        function (items) { return _this.getParentsNameForItem(items); })));
        this.selectedItem$ = combineLatest([this.itemSelectedEvent$$, this.orderedLineItems$]).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), id = _b[0], lineItems = _b[1];
            return lineItems.find((/**
             * @param {?} lineItem
             * @return {?}
             */
            function (lineItem) { return lineItem.item.id === id; }));
        })));
        this.lmiCategories$ = this.orderedLineItems$.pipe(map((/**
         * @param {?} lis
         * @return {?}
         */
        function (lis) {
            /** @type {?} */
            var lmiMap = (lis || []).reduce((/**
             * @param {?} prev
             * @param {?} li
             * @return {?}
             */
            function (prev, li) {
                if (li && li.item) {
                    (li.item.lmiCategories || []).forEach((/**
                     * @param {?} lmi
                     * @return {?}
                     */
                    function (lmi) { return prev.set(lmi, lmi); }));
                }
                return prev;
            }), new Map());
            /** @type {?} */
            var lmiCats = [];
            lmiMap.forEach((/**
             * @param {?} v
             * @param {?} k
             * @return {?}
             */
            function (v, k) {
                lmiCats.push(k);
            }));
            return lmiCats;
        })));
        // Set the initial selected Item
        this.orderedLineItems$.pipe(map((/**
         * @param {?} lineItems
         * @return {?}
         */
        function (lineItems) { return lineItems[0]; })), tap((/**
         * @param {?} lineItem
         * @return {?}
         */
        function (lineItem) { return _this.selectItem(lineItem && lineItem.item ? lineItem.item.id : ''); })), take(1)).subscribe();
    }
    Object.defineProperty(VaPackageDetailsV2Component.prototype, "pkg", {
        set: /**
         * @param {?} pkg
         * @return {?}
         */
        function (pkg) {
            this.pkg$$.next(pkg);
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    VaPackageDetailsV2Component.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        if (!this.actionLabel) {
            this.actionLabel = this.translateService.instant('FRONTEND.STORE.GET_IT_NOW');
        }
    };
    /**
     * @param {?} id
     * @return {?}
     */
    VaPackageDetailsV2Component.prototype.selectItem = /**
     * @param {?} id
     * @return {?}
     */
    function (id) {
        this.itemSelectedEvent$$.next(id);
    };
    /**
     * @return {?}
     */
    VaPackageDetailsV2Component.prototype.emitGetItNow = /**
     * @return {?}
     */
    function () {
        this.getItNow.emit();
    };
    /**
     * @param {?} items
     * @return {?}
     */
    VaPackageDetailsV2Component.prototype.getParentsNameForItem = /**
     * @param {?} items
     * @return {?}
     */
    function (items) {
        if (items && items.length === 1 && items[0]) {
            return items[0].parent.name;
        }
    };
    VaPackageDetailsV2Component.decorators = [
        { type: Component, args: [{
                    selector: 'va-package-details-v2',
                    template: "<div *ngIf=\"pkg$$ | async as pkg\" class=\"page\">\n  <va-header-container [iconUrl]=\"pkg.icon\"\n                       [title]=\"pkg.name\"\n                       [tagline]=\"pkg.tagline\"\n                       [prerequisite]=\"productNameForSingleAddon$ | async\"\n                       [chipLabels]=\"lmiCategories$ | async\"\n                       [pricing]=\"pkg.pricing\"\n                       [pricingLabel]=\"'FRONTEND.STORE.PRICING' | translate\"\n                       [showAction]=\"showActionButton\"\n                       [showPricing]=\"showPricing\"\n                       [actionLabel]=\"actionLabel\"\n                       [actionEnabled]=true\n                       (actionSelected)=\"emitGetItNow()\"\n  ></va-header-container>\n\n  <ng-container *ngIf=\"pkg?.content\">\n    <va-selling-info [description]=\"pkg.content\"></va-selling-info>\n  </ng-container>\n\n  <va-products-nav-v2 [items]=\"orderedLineItems$ | async\"\n                   [hideItemsNav]=\"pkg?.hide_product_icons_and_names\"\n                   (itemSelected)=\"selectItem($event)\"></va-products-nav-v2>\n\n  <ng-container *ngIf=\"selectedItem$ | async as selectedItem\">\n    <div *ngIf=\"!pkg?.hide_product_details\" class=\"package-content\">\n      <div class=\"left-column\">\n        <section *ngIf=\"selectedItem?.item?.description || selectedItem?.item?.keySellingPoints\">\n          <va-selling-info [description]=\"selectedItem?.item?.description\"\n                           [keySellingPoints]=\"selectedItem?.item?.keySellingPoints\"></va-selling-info>\n        </section>\n\n        <section *ngIf=\"selectedItem?.item?.faqs?.length > 0 && selectedItem?.item?.faqs[0].question\">\n          <h2 class=\"va-component-title\">{{ 'FRONTEND.STORE.FAQS' | translate }}</h2>\n          <va-faqs [faqs]=\"selectedItem.item.faqs\"></va-faqs>\n        </section>\n      </div>\n\n      <div class=\"right-column\">\n        <section *ngIf=\"selectedItem?.item?.screenshotUrls?.length > 0\">\n          <h2 class=\"va-component-title\">{{ 'FRONTEND.STORE.GALLERY' | translate }}</h2>\n          <va-image-gallery [imageUrls]=\"selectedItem.item.screenshotUrls\"></va-image-gallery>\n        </section>\n\n        <section *ngIf=\"selectedItem?.item?.files?.length > 0\">\n          <h2 class=\"va-component-title\">{{ 'FRONTEND.STORE.FILES' | translate }}</h2>\n          <va-files [files]=\"selectedItem.item.files\"></va-files>\n        </section>\n      </div>\n    </div>\n  </ng-container>\n</div>\n",
                    styles: [":host{display:block;font-size:14px;line-height:1.4}:host *{box-sizing:border-box}.va-component-title{font-size:24px;font-weight:300;margin-top:0}@media screen and (min-width:600px){.va-component-title{font-size:32px}}img{max-width:100%}va-icon{display:inline-block}.page{position:relative;margin:0 auto 20px;background:#fff;color:#212121;box-shadow:0 3px 10px rgba(33,33,33,.3);overflow:hidden;font-size:16px}.page .item-amount{color:#9e9e9e;font-size:14px;text-align:right;margin:0 24px 8px}section{padding:24px}.left-column{width:66%}@media screen and (max-width:600px){.left-column{width:100%}}.right-column{width:34%}.package-content{display:-webkit-box;display:flex}@media screen and (max-width:600px){.right-column{width:100%}.package-content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}}"]
                }] }
    ];
    /** @nocollapse */
    VaPackageDetailsV2Component.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    VaPackageDetailsV2Component.propDecorators = {
        showActionButton: [{ type: Input }],
        showPricing: [{ type: Input }],
        actionLabel: [{ type: Input }],
        pkg: [{ type: Input }],
        getItNow: [{ type: Output }]
    };
    return VaPackageDetailsV2Component;
}());
if (false) {
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.showActionButton;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.showPricing;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.actionLabel;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.getItNow;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.pkg$$;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.itemSelectedEvent$$;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.selectedItem$;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.orderedLineItems$;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.productNameForSingleAddon$;
    /** @type {?} */
    VaPackageDetailsV2Component.prototype.lmiCategories$;
    /**
     * @type {?}
     * @private
     */
    VaPackageDetailsV2Component.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPackageDetailsV2Module = /** @class */ (function () {
    function VaPackageDetailsV2Module() {
    }
    VaPackageDetailsV2Module.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        VaImageGalleryModule,
                        CommonModule,
                        MatIconModule,
                        VaSafeHtmlModule,
                        VaIconModule,
                        VaPricingModule,
                        MatButtonModule,
                        VaFilesModule,
                        VaFaqsModule,
                        VaSellingInfoModule,
                        VaHeaderContainerModule,
                        VaAddonListModule,
                        VaProductsNavModule,
                        TranslateModule
                    ],
                    declarations: [VaPackageDetailsV2Component],
                    exports: [VaPackageDetailsV2Component],
                    entryComponents: [VaPackageDetailsV2Component]
                },] }
    ];
    return VaPackageDetailsV2Module;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function SalesPackage() { }
if (false) {
    /** @type {?} */
    SalesPackage.prototype.formattedPrices;
    /** @type {?} */
    SalesPackage.prototype.packageId;
    /** @type {?} */
    SalesPackage.prototype.name;
    /** @type {?} */
    SalesPackage.prototype.icon;
    /** @type {?} */
    SalesPackage.prototype.productIds;
    /** @type {?} */
    SalesPackage.prototype.products;
    /** @type {?} */
    SalesPackage.prototype.addonsWithNoParent;
    /** @type {?} */
    SalesPackage.prototype.totalAddons;
    /** @type {?|undefined} */
    SalesPackage.prototype.activationStatus;
}
/**
 * @record
 */
function SalesProduct() { }
if (false) {
    /** @type {?} */
    SalesProduct.prototype.formattedPrices;
    /** @type {?} */
    SalesProduct.prototype.productId;
    /** @type {?} */
    SalesProduct.prototype.name;
    /** @type {?} */
    SalesProduct.prototype.icon;
    /** @type {?} */
    SalesProduct.prototype.tagline;
    /** @type {?|undefined} */
    SalesProduct.prototype.activationStatus;
    /** @type {?|undefined} */
    SalesProduct.prototype.editionId;
    /** @type {?|undefined} */
    SalesProduct.prototype.editionName;
    /** @type {?} */
    SalesProduct.prototype.addons;
    /** @type {?|undefined} */
    SalesProduct.prototype.parentInfo;
}
/**
 * @record
 */
function ProductParentInfo() { }
if (false) {
    /** @type {?} */
    ProductParentInfo.prototype.parentId;
    /** @type {?} */
    ProductParentInfo.prototype.parentName;
    /** @type {?} */
    ProductParentInfo.prototype.parentIconUrl;
    /** @type {?} */
    ProductParentInfo.prototype.multipleActivations;
}
/**
 * @record
 */
function SalesAddon() { }
if (false) {
    /** @type {?} */
    SalesAddon.prototype.parentId;
    /** @type {?} */
    SalesAddon.prototype.addonId;
    /** @type {?} */
    SalesAddon.prototype.name;
    /** @type {?} */
    SalesAddon.prototype.icon;
    /** @type {?} */
    SalesAddon.prototype.tagline;
    /** @type {?} */
    SalesAddon.prototype.parentName;
    /** @type {?} */
    SalesAddon.prototype.parentIcon;
    /** @type {?} */
    SalesAddon.prototype.multipleActivations;
    /** @type {?|undefined} */
    SalesAddon.prototype.activationStatus;
}
/**
 * @record
 */
function PackageItemActivationStatus() { }
if (false) {
    /** @type {?} */
    PackageItemActivationStatus.prototype.packageItemId;
    /** @type {?} */
    PackageItemActivationStatus.prototype.status;
}
/** @enum {number} */
var ActivationStatus = {
    SUCCESS: 0,
    WARNING: 1,
    ERROR: 2,
};
ActivationStatus[ActivationStatus.SUCCESS] = 'SUCCESS';
ActivationStatus[ActivationStatus.WARNING] = 'WARNING';
ActivationStatus[ActivationStatus.ERROR] = 'ERROR';
/**
 * @record
 */
function StatusNotificationItem() { }
if (false) {
    /** @type {?} */
    StatusNotificationItem.prototype.icon;
    /** @type {?} */
    StatusNotificationItem.prototype.text;
    /** @type {?} */
    StatusNotificationItem.prototype.status;
}
/**
 * @param {?} packages
 * @param {?} products
 * @param {?} addons
 * @return {?}
 */
function buildSalesPackages(packages, products, addons) {
    if (!packages || packages.length < 1) {
        return [];
    }
    return packages.map((/**
     * @param {?} pkg
     * @return {?}
     */
    function (pkg) { return buildSalesPackageFromPackage(pkg, products, addons); }));
}
/**
 * @param {?} pkg
 * @param {?} products
 * @param {?} addons
 * @return {?}
 */
function buildSalesPackageFromPackage(pkg, products, addons) {
    if (!pkg) {
        return null;
    }
    /** @type {?} */
    var salesProducts = buildSalesProducts(pkg, products, addons);
    // Addons can be in a package even if the parent product is not, this will create salesAddons with no parent
    /** @type {?} */
    var addonsWithNoParent = buildSalesAddonsWithNoParent(pkg, products, addons);
    return createSalesPackage(pkg, salesProducts, addonsWithNoParent);
}
/**
 * @param {?} pkg
 * @param {?} products
 * @param {?} addons
 * @return {?}
 */
function buildSalesProducts(pkg, products, addons) {
    if (!(products && products.length && pkg.products && pkg.products.length)) {
        return [];
    }
    /** @type {?} */
    var productMap = new Map();
    products.forEach((/**
     * @param {?} product
     * @return {?}
     */
    function (product) { return productMap.set(product.productId, product); }));
    return pkg.products
        .map((/**
     * @param {?} productId
     * @return {?}
     */
    function (productId) {
        /** @type {?} */
        var productMatch = productMap.get(productId);
        /** @type {?} */
        var addonsInPackage = coerceAddonsForAddonKeys(addons, pkg.addon_keys);
        return productMatch ? buildSalesProductFromProduct(productMatch, addonsInPackage) : null;
    }))
        .filter((/**
     * @param {?} productItem
     * @return {?}
     */
    function (productItem) { return productItem; }));
}
/**
 * @param {?} addons
 * @param {?} addonKeys
 * @return {?}
 */
function coerceAddonsForAddonKeys(addons, addonKeys) {
    if (!addons || addons.length === 0 || !addonKeys || addonKeys.length === 0) {
        return [];
    }
    return addons.reduce((/**
     * @param {?} addonsArray
     * @param {?} addon
     * @return {?}
     */
    function (addonsArray, addon) {
        /** @type {?} */
        var key = addonKeys.find((/**
         * @param {?} k
         * @return {?}
         */
        function (k) { return k.addonId === addon.addonId; }));
        if (key) {
            /** @type {?} */
            var quantity = key.quantity || 1;
            for (var i = 0; i < quantity; i++) {
                addonsArray.push(addon);
            }
        }
        return addonsArray;
    }), []);
}
/**
 * @param {?} pkg
 * @param {?} products
 * @param {?} addons
 * @return {?}
 */
function buildSalesAddonsWithNoParent(pkg, products, addons) {
    if (!addons || addons.length < 1 || !pkg.addon_keys) {
        return [];
    }
    /** @type {?} */
    var productMap = new Map();
    products.forEach((/**
     * @param {?} product
     * @return {?}
     */
    function (product) { return productMap.set(product.productId, product); }));
    /** @type {?} */
    var addonsMap = new Map();
    addons.forEach((/**
     * @param {?} addon
     * @return {?}
     */
    function (addon) { return addonsMap.set(addon.addonId, addon); }));
    /** @type {?} */
    var addonsWithNoParent = pkg.addon_keys.reduce((/**
     * @param {?} addonArray
     * @param {?} addonKey
     * @return {?}
     */
    function (addonArray, addonKey) {
        if (pkg.products && pkg.products.some((/**
         * @param {?} productId
         * @return {?}
         */
        function (productId) { return productId === addonKey.appId; }))) {
            return addonArray || [];
        }
        /** @type {?} */
        var parentProduct = productMap.get(addonKey.appId);
        /** @type {?} */
        var parentName = parentProduct ? parentProduct.name : null;
        /** @type {?} */
        var parentIcon = parentProduct ? parentProduct.iconUrl : null;
        /** @type {?} */
        var quantity = addonKey.quantity || 1;
        /** @type {?} */
        var addon = addonsMap.get(addonKey.addonId);
        for (var i = 0; i < quantity; i++) {
            addonArray.push(createSalesAddon(addon, parentName, parentIcon));
        }
        return addonArray;
    }), []);
    return addonsWithNoParent;
}
/**
 * @param {?} product
 * @param {?} addons
 * @return {?}
 */
function buildSalesProductFromProduct(product, addons) {
    if (!product) {
        return null;
    }
    if (!addons || addons.length < 1) {
        return createSalesProduct(product, null);
    }
    /** @type {?} */
    var productAddons = addons.filter((/**
     * @param {?} addon
     * @return {?}
     */
    function (addon) { return addon.appId === product.productId; }));
    /** @type {?} */
    var salesAddons = createSalesAddons(productAddons);
    return createSalesProduct(product, salesAddons);
}
/**
 * @param {?} pkg
 * @param {?} salesProducts
 * @param {?} addonsWithNoParent
 * @return {?}
 */
function createSalesPackage(pkg, salesProducts, addonsWithNoParent) {
    var e_1, _a;
    /** @type {?} */
    var totalAddons = 0;
    try {
        for (var _b = __values(pkg.addon_keys || []), _c = _b.next(); !_c.done; _c = _b.next()) {
            var key = _c.value;
            totalAddons += key.quantity || 1;
        }
    }
    catch (e_1_1) { e_1 = { error: e_1_1 }; }
    finally {
        try {
            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
        }
        finally { if (e_1) throw e_1.error; }
    }
    return {
        formattedPrices: pkg.priceStrings.join(', '),
        packageId: pkg.solution_id,
        name: pkg.name,
        icon: pkg.icon,
        productIds: pkg.products,
        products: salesProducts || [],
        addonsWithNoParent: addonsWithNoParent || [],
        totalAddons: totalAddons
    };
}
/**
 * @param {?} product
 * @param {?} salesAddons
 * @return {?}
 */
function createSalesProduct(product, salesAddons) {
    /** @type {?} */
    var parentInfo;
    if (product instanceof ProductWithParent) {
        parentInfo = {
            parentId: product.parentId,
            parentName: product.parentName,
            parentIconUrl: product.parentIconUrl,
            multipleActivations: product.multipleActivations || false,
        };
    }
    return {
        formattedPrices: product.priceStrings.join(', '),
        productId: product.productId,
        name: product.name,
        tagline: product.tagline || '',
        icon: product.iconUrl,
        addons: salesAddons || [],
        editionId: product.editionId,
        editionName: product.editionName,
        parentInfo: parentInfo,
    };
}
/**
 * @param {?} addons
 * @return {?}
 */
function createSalesAddons(addons) {
    return addons.map((/**
     * @param {?} addon
     * @return {?}
     */
    function (addon) { return createSalesAddon(addon); }));
}
/**
 * @param {?} addon
 * @param {?=} parentName
 * @param {?=} parentIcon
 * @return {?}
 */
function createSalesAddon(addon, parentName, parentIcon) {
    return {
        parentId: addon.appId,
        addonId: addon.addonId,
        name: addon.title,
        tagline: addon.tagline || '',
        icon: addon.icon || '',
        multipleActivations: addon.multipleActivations,
        parentIcon: parentIcon || '',
        parentName: parentName || ''
    };
}
/**
 * @param {?} pkg
 * @param {?} products
 * @param {?} addons
 * @param {?} activationStatus
 * @return {?}
 */
function createSalesPackageWithStatus(pkg, products, addons, activationStatus) {
    return {
        formattedPrices: pkg.formattedPrices,
        packageId: pkg.packageId,
        name: pkg.name,
        icon: pkg.icon,
        productIds: pkg.productIds,
        products: products || [],
        addonsWithNoParent: addons || [],
        activationStatus: activationStatus || null,
        totalAddons: pkg.totalAddons
    };
}
/**
 * @param {?} product
 * @param {?} addons
 * @param {?} activationStatus
 * @return {?}
 */
function createSalesProductWithStatus(product, addons, activationStatus) {
    return {
        formattedPrices: product.formattedPrices,
        productId: product.productId,
        name: product.name,
        editionId: product.editionId,
        editionName: product.editionName,
        tagline: product.tagline,
        icon: product.icon,
        addons: addons || [],
        activationStatus: activationStatus || null,
        parentInfo: product.parentInfo || null,
    };
}
/**
 * @param {?} addon
 * @param {?} activationStatus
 * @return {?}
 */
function createSalesAddonWithStatus(addon, activationStatus) {
    return {
        parentId: addon.parentId,
        addonId: addon.addonId,
        name: addon.name,
        tagline: addon.tagline,
        icon: addon.icon,
        parentIcon: addon.parentIcon,
        parentName: addon.parentName,
        multipleActivations: addon.multipleActivations,
        activationStatus: activationStatus || null
    };
}
/**
 * @param {?} salesPackages
 * @param {?} statuses
 * @return {?}
 */
function addStatusesToSalesPackages(salesPackages, statuses) {
    if (!statuses || statuses.length === 0) {
        return salesPackages;
    }
    return salesPackages.map((/**
     * @param {?} salesPackage
     * @return {?}
     */
    function (salesPackage) {
        /** @type {?} */
        var newProducts = salesPackage.products.map((/**
         * @param {?} product
         * @return {?}
         */
        function (product) { return addStatusesToSalesProduct(product, statuses); }));
        /** @type {?} */
        var newAddonsWithNoParent = salesPackage.addonsWithNoParent.map((/**
         * @param {?} addon
         * @return {?}
         */
        function (addon) {
            /** @type {?} */
            var status = findStatus(statuses, addon.addonId);
            return addStatusesToSalesAddon(addon, status);
        }));
        /** @type {?} */
        var productStatuses = newProducts
            .map((/**
         * @param {?} product
         * @return {?}
         */
        function (product) { return product.activationStatus.status; }));
        /** @type {?} */
        var addonStatuses = newProducts
            .map((/**
         * @param {?} product
         * @return {?}
         */
        function (product) { return product.addons ? product.addons.map((/**
         * @param {?} addon
         * @return {?}
         */
        function (addon) { return addon.activationStatus.status; })) : []; }))
            .reduce((/**
         * @param {?} statusList
         * @param {?} reducedList
         * @return {?}
         */
        function (statusList, reducedList) { return reducedList.concat(statusList); }), []);
        /** @type {?} */
        var addonsWithNoParentStatuses = newAddonsWithNoParent
            .map((/**
         * @param {?} addon
         * @return {?}
         */
        function (addon) { return addon.activationStatus ? addon.activationStatus.status : null; }));
        /** @type {?} */
        var allStatuses = __spread(productStatuses, addonStatuses, addonsWithNoParentStatuses);
        /** @type {?} */
        var packageStatus = convertNumberToActivationStatus(Math.max.apply(Math, __spread(allStatuses)));
        /** @type {?} */
        var statusNotification = createStatusNotificationItemForPackage(packageStatus);
        return createSalesPackageWithStatus(salesPackage, newProducts, newAddonsWithNoParent, statusNotification);
    }));
}
/**
 * @param {?} product
 * @param {?} statuses
 * @return {?}
 */
function addStatusesToSalesProduct(product, statuses) {
    if (!statuses || statuses.length === 0) {
        return product;
    }
    /** @type {?} */
    var productStatus = findStatus(statuses, product.productId);
    /** @type {?} */
    var statusNotification = createStatusNotificationItemForPackageItem(productStatus);
    if (!product.addons) {
        return createSalesProductWithStatus(product, null, statusNotification);
    }
    /** @type {?} */
    var newSalesAddons = product.addons.map((/**
     * @param {?} addon
     * @return {?}
     */
    function (addon) {
        /** @type {?} */
        var addonStatus = findStatus(statuses, addon.addonId);
        return addStatusesToSalesAddon(addon, addonStatus);
    }));
    return createSalesProductWithStatus(product, newSalesAddons, statusNotification);
}
/**
 * @param {?} addon
 * @param {?} status
 * @return {?}
 */
function addStatusesToSalesAddon(addon, status) {
    /** @type {?} */
    var addonStatusNotification = createStatusNotificationItemForPackageItem(status);
    return createSalesAddonWithStatus(addon, addonStatusNotification);
}
/**
 * @param {?} statuses
 * @param {?} id
 * @return {?}
 */
function findStatus(statuses, id) {
    if (!statuses || statuses.length <= 0) {
        return null;
    }
    /** @type {?} */
    var statusIndex = statuses.findIndex((/**
     * @param {?} s
     * @return {?}
     */
    function (s) {
        return s.packageItemId === id;
    }));
    if (statusIndex < 0) {
        return null;
    }
    /** @type {?} */
    var status = statuses[statusIndex].status;
    statuses.splice(statusIndex, 1);
    return status;
}
/**
 * @param {?} status
 * @return {?}
 */
function createStatusNotificationItemForPackageItem(status) {
    switch (status) {
        case ActivationStatus.SUCCESS:
            return { icon: 'check_circle', status: status, text: 'Activated' };
        case ActivationStatus.WARNING:
            return { icon: 'warning', status: status, text: 'Already Activated' };
        default:
            return { icon: 'error', status: status, text: 'Activation Errors' };
    }
}
/**
 * @param {?} status
 * @return {?}
 */
function createStatusNotificationItemForPackage(status) {
    switch (status) {
        case ActivationStatus.SUCCESS:
            return { icon: 'check_circle', status: status, text: 'Activated' };
        case ActivationStatus.WARNING:
            return { icon: 'warning', status: status, text: 'Activation Warnings' };
        default:
            return { icon: 'error', status: status, text: 'Activation Errors Occured' };
    }
}
/**
 * @param {?} number
 * @return {?}
 */
function convertNumberToActivationStatus(number) {
    switch (number) {
        case 0:
            return ActivationStatus.SUCCESS;
        case 1:
            return ActivationStatus.WARNING;
        default:
            return ActivationStatus.ERROR;
    }
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @enum {string} */
var ListIndent = {
    INDENT_ZERO: 'indent-zero',
    INDENT_ONE: 'indent-one',
    INDENT_TWO: 'indent-two',
};
var VaPackageDropdownItemComponent = /** @class */ (function () {
    function VaPackageDropdownItemComponent() {
        this.enableDropdown = false;
        this.indent = ListIndent.INDENT_ZERO;
        this.itemToggled = new EventEmitter();
    }
    /**
     * @return {?}
     */
    VaPackageDropdownItemComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
    };
    /**
     * @return {?}
     */
    VaPackageDropdownItemComponent.prototype.toggleItem = /**
     * @return {?}
     */
    function () {
        this.itemToggled.emit(null);
    };
    /**
     * @param {?} status
     * @return {?}
     */
    VaPackageDropdownItemComponent.prototype.isActivatedStatus = /**
     * @param {?} status
     * @return {?}
     */
    function (status) {
        return status === ActivationStatus.SUCCESS;
    };
    /**
     * @param {?} status
     * @return {?}
     */
    VaPackageDropdownItemComponent.prototype.isWarningStatus = /**
     * @param {?} status
     * @return {?}
     */
    function (status) {
        return status === ActivationStatus.WARNING;
    };
    /**
     * @param {?} status
     * @return {?}
     */
    VaPackageDropdownItemComponent.prototype.isErrorStatus = /**
     * @param {?} status
     * @return {?}
     */
    function (status) {
        return status === ActivationStatus.ERROR;
    };
    VaPackageDropdownItemComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-package-dropdown-item',
                    template: "<mat-list-item [ngClass]=\"indent\" class=\"va-dropdown-list-item\">\n  <va-icon *ngIf=\"!secondaryIconUrl && !secondaryIconName; else dualIcon\" mat-list-avatar [name]=\"title\" [iconUrl]=\"iconUrl\" [diameter]=\"40\"></va-icon>\n  <h3 mat-line class=\"va-dropdown-list-item__title\">{{ title }}\n    <va-badge *ngIf=\"titleBadge\" small color=\"blue-solid\" class=\"va-dropdown-list-item__title-badge\">{{ titleBadge }}</va-badge>\n    <span *ngIf=\"titleDescriptor\" class=\"va-dropdown-list-item__title-descriptor\">{{ titleDescriptor }}</span>\n  </h3>\n  <p class=\"package-dropdown-font\" mat-line>{{subtitle}}</p>\n\n  <span *ngIf=\"!statusItem\" class=\"va-dropdown-list-item__layout\">\n    <p class=\"va-dropdown-list-item__layout va-dropdown-list-item__notice\">{{ description }}</p>\n    <ng-container *ngIf=\"enableDropdown; then dropdownButton\"></ng-container>\n  </span>\n\n  <span *ngIf=\"statusItem\" class=\"va-dropdown-list-item__layout va-dropdown-list-item__status\">\n    <div [ngClass]=\"{\n           'activated': isActivatedStatus(statusItem.status),\n           'warning': isWarningStatus(statusItem.status),\n           'error': isErrorStatus(statusItem.status)}\">\n      <mat-icon>{{statusItem.icon}}</mat-icon>\n    </div>\n    <p class=\"va-dropdown-list-item__notice\"\n       [ngClass]=\"{\n        'activated': isActivatedStatus(statusItem.status),\n        'warning': isWarningStatus(statusItem.status),\n        'error': isErrorStatus(statusItem.status)}\">\n      {{ statusItem.text }}\n    </p>\n    <ng-container *ngIf=\"enableDropdown; then dropdownButton\"></ng-container>\n  </span>\n</mat-list-item>\n\n\n<ng-template #dropdownButton>\n  <button *ngIf=\"enableDropdown\" mat-icon-button type=\"button\" (click)=\"toggleItem()\">\n    <mat-icon mat-list-icon\n              class=\"dropdown-icon\"\n              [ngClass]=\"{'dropdown-icon-rotate-up': !toggleValue, 'dropdown-icon-rotate-down': toggleValue}\">\n      keyboard_arrow_down\n    </mat-icon>\n  </button>\n</ng-template>\n\n<ng-template #dualIcon>\n  <div class=\"dual-icon\">\n    <va-icon mat-list-avatar [iconUrl]=\"iconUrl\" [name]=\"title\" [diameter]=\"40\"></va-icon>\n    <va-icon mat-list-avatar class=\"secondary-icon\" [iconUrl]=\"secondaryIconUrl\" [diameter]=\"20\" [name]=\"secondaryIconName\"></va-icon>\n  </div>\n</ng-template>\n",
                    styles: [".va-dropdown-list-item{border-bottom:1px solid rgba(0,0,0,.12)}mat-list-item .va-dropdown-list-item__title{font-weight:700}.va-dropdown-list-item__title-badge{padding-bottom:4px}.indent-one{padding-left:30px}.va-dropdown-list-item__title-descriptor{font-size:11px;font-weight:700;font-style:italic}.indent-two{padding-left:30px}.indent-two .mat-list-avatar{margin-left:40px}.dual-icon{position:relative;display:inline-block;-webkit-box-ordinal-group:0;order:-1;margin-right:16px}.dual-icon .secondary-icon{position:absolute;border-radius:50%;bottom:-24px;right:-24px}.va-dropdown-list-item__layout{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}.va-dropdown-list-item__layout .va-dropdown-list-item__notice{width:-webkit-max-content;width:-moz-max-content;width:max-content;font-style:italic}@media screen and (max-width:500px){.va-dropdown-list-item__layout p{display:none}}.va-dropdown-list-item__layout mat-icon{padding:0}.va-dropdown-list-item__layout button{padding:0;min-width:0}.va-dropdown-list-item__layout button .dropdown-icon{color:rgba(0,0,0,.54)}.va-dropdown-list-item__layout button .dropdown-icon-rotate-down{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:.4s;transition:.4s;pointer-events:none}.va-dropdown-list-item__layout button .dropdown-icon-rotate-up{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:.4s;transition:.4s;pointer-events:none}.va-dropdown-list-item__status{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}.va-dropdown-list-item__status p{padding-left:6px;font-size:14px;white-space:nowrap}.va-dropdown-list-item__status .activated{color:#4caf50}.va-dropdown-list-item__status .warning{color:#ffa000}.va-dropdown-list-item__status .error{color:#c62828}", ".package-dropdown-font,.product-dropdown-font{color:rgba(0,0,0,.54);font-size:14px;font-weight:400}.package-list-container{border-top:1px solid rgba(0,0,0,.12);padding:0}.package-list-container mat-list{padding:0}.package-dropdown-stencil-display{display:-webkit-box;display:flex;width:100%;-webkit-box-flex:1;flex-grow:1}.package-dropdown-stencil-display va-icon{margin-right:20px}.package-dropdown-stencil-display .stencil-text{width:inherit;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center}.package-dropdown-stencil-display .stencil-text .stencil-title{height:32px;width:40%;margin-bottom:5px!important;margin-top:0!important}.package-dropdown-stencil-display .stencil-text .stencil-tagline{height:32px;width:inherit}.product-or-addon-list{background-color:rgba(0,0,0,.04);overflow:hidden}"]
                }] }
    ];
    VaPackageDropdownItemComponent.propDecorators = {
        title: [{ type: Input }],
        titleBadge: [{ type: Input }],
        titleDescriptor: [{ type: Input }],
        iconUrl: [{ type: Input }],
        secondaryIconUrl: [{ type: Input }],
        secondaryIconName: [{ type: Input }],
        subtitle: [{ type: Input }],
        statusItem: [{ type: Input }],
        enableDropdown: [{ type: Input }],
        indent: [{ type: Input }],
        toggleValue: [{ type: Input }],
        description: [{ type: Input }],
        itemToggled: [{ type: Output }]
    };
    return VaPackageDropdownItemComponent;
}());
if (false) {
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.title;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.titleBadge;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.titleDescriptor;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.iconUrl;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.secondaryIconUrl;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.secondaryIconName;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.subtitle;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.statusItem;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.enableDropdown;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.indent;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.toggleValue;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.description;
    /** @type {?} */
    VaPackageDropdownItemComponent.prototype.itemToggled;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function OrderLengthsForToggling() { }
if (false) {
    /** @type {?} */
    OrderLengthsForToggling.prototype.packages;
    /** @type {?} */
    OrderLengthsForToggling.prototype.products;
}
var VaPackageDropdownComponent = /** @class */ (function () {
    function VaPackageDropdownComponent(translateService) {
        this.translateService = translateService;
        // controls whether only one dropdown can be expanded at a time
        this.singularDropdown = false;
        // hides pricing
        this.hidePricing = false;
        this.packageProductIndent = ListIndent.INDENT_ONE;
        this.packageAddonWithoutProductIndent = ListIndent.INDENT_ONE;
        this.packageAddonWithProductIndent = ListIndent.INDENT_TWO;
        this.productAddonIndent = ListIndent.INDENT_ONE;
        this.packages$$ = new ReplaySubject(1);
        this.products$$ = new ReplaySubject(1);
        this.standAloneProducts$$ = new ReplaySubject(1);
        this.statuses$$ = new BehaviorSubject([]);
        this.addons$$ = new ReplaySubject(1);
        this.orderItemLengths$$ = new BehaviorSubject((/** @type {?} */ ({
            packages: 0,
            products: 0
        })));
        this.packageToggles = [];
        this.productToggles = [];
        this.translateService.setTranslation('en', En.en, true);
        this.translateService.setTranslation('cs', Cs.cs, true);
    }
    Object.defineProperty(VaPackageDropdownComponent.prototype, "packages", {
        // packages in dropdown
        set: 
        // packages in dropdown
        /**
         * @param {?} packages
         * @return {?}
         */
        function (packages) {
            this.packages$$.next(packages);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDropdownComponent.prototype, "products", {
        // products within given packages
        set: 
        // products within given packages
        /**
         * @param {?} products
         * @return {?}
         */
        function (products) {
            this.products$$.next(products);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDropdownComponent.prototype, "standAloneProducts", {
        // products not associated with a package
        set: 
        // products not associated with a package
        /**
         * @param {?} standAloneProducts
         * @return {?}
         */
        function (standAloneProducts) {
            this.standAloneProducts$$.next(standAloneProducts);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDropdownComponent.prototype, "statuses", {
        // statuses for all products and addons
        set: 
        // statuses for all products and addons
        /**
         * @param {?} statuses
         * @return {?}
         */
        function (statuses) {
            this.statuses$$.next(statuses);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(VaPackageDropdownComponent.prototype, "addons", {
        // addons within given packages
        set: 
        // addons within given packages
        /**
         * @param {?} addons
         * @return {?}
         */
        function (addons) {
            this.addons$$.next(addons);
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        /** @type {?} */
        var packages$ = this.packages$$.pipe(filter((/**
         * @param {?} packages
         * @return {?}
         */
        function (packages) { return packages !== null; })));
        /** @type {?} */
        var products$ = this.products$$.pipe(filter((/**
         * @param {?} products
         * @return {?}
         */
        function (products) { return products !== null; })));
        /** @type {?} */
        var addons$ = this.addons$$.pipe(filter((/**
         * @param {?} addons
         * @return {?}
         */
        function (addons) { return addons !== null; })));
        /** @type {?} */
        var salesPackage$ = zip(packages$, products$, addons$).pipe(tap((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 3), packages = _b[0], products = _b[1], _ = _b[2];
            _this.orderItemLengths$$.next((/** @type {?} */ ({
                packages: packages.length,
                products: products.length
            })));
        })), map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 3), packages = _b[0], products = _b[1], addons = _b[2];
            return buildSalesPackages(packages, products, addons);
        })));
        this.salesPackages$ = combineLatest(salesPackage$, this.statuses$$).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), salesPackages = _b[0], statuses = _b[1];
            return addStatusesToSalesPackages(salesPackages, statuses);
        })), startWith([]));
        this.salesProducts$ = combineLatest(this.standAloneProducts$$, this.statuses$$).pipe(filter((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), products = _b[0], _ = _b[1];
            return products !== null;
        })), map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), products = _b[0], statuses = _b[1];
            return products.map((/**
             * @param {?} p
             * @return {?}
             */
            function (p) {
                /** @type {?} */
                var addons = p.addons || null;
                /** @type {?} */
                var salesProducts = buildSalesProductFromProduct(p, addons);
                return addStatusesToSalesProduct(salesProducts, statuses);
            }));
        })), startWith([]));
        this.templateData$ = combineLatest(this.salesPackages$, this.salesProducts$).pipe(map((/**
         * @param {?} __0
         * @return {?}
         */
        function (_a) {
            var _b = __read(_a, 2), packages = _b[0], products = _b[1];
            return ({ packages: packages, products: products });
        })));
    };
    /**
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.openAllDropdowns = /**
     * @return {?}
     */
    function () {
        for (var x = 0; x < this.orderItemLengths$$.getValue().packages; x++) {
            this.packageToggles[x] = true;
        }
        for (var x = 0; x < this.orderItemLengths$$.getValue().products; x++) {
            this.productToggles[x] = true;
        }
    };
    /**
     * @param {?} indexToToggle
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.togglePackage = /**
     * @param {?} indexToToggle
     * @return {?}
     */
    function (indexToToggle) {
        if (this.singularDropdown) {
            /** @type {?} */
            var openedIndex = this.packageToggles.findIndex((/**
             * @param {?} value
             * @return {?}
             */
            function (value) { return value === true; }));
            if (openedIndex !== indexToToggle) {
                this.packageToggles[openedIndex] = false;
            }
            /** @type {?} */
            var productOpenedIndex = this.productToggles.findIndex((/**
             * @param {?} value
             * @return {?}
             */
            function (value) { return value === true; }));
            if (productOpenedIndex > -1) {
                this.productToggles[productOpenedIndex] = false;
            }
        }
        this.packageToggles[indexToToggle] = !this.packageToggles[indexToToggle];
    };
    /**
     * @param {?} indexToToggle
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.toggleProduct = /**
     * @param {?} indexToToggle
     * @return {?}
     */
    function (indexToToggle) {
        if (this.singularDropdown) {
            /** @type {?} */
            var openedIndex = this.productToggles.findIndex((/**
             * @param {?} value
             * @return {?}
             */
            function (value) { return value === true; }));
            if (openedIndex !== indexToToggle) {
                this.productToggles[openedIndex] = false;
            }
            /** @type {?} */
            var packageOpenedIndex = this.packageToggles.findIndex((/**
             * @param {?} value
             * @return {?}
             */
            function (value) { return value === true; }));
            if (packageOpenedIndex > -1) {
                this.packageToggles[packageOpenedIndex] = false;
            }
        }
        this.productToggles[indexToToggle] = !this.productToggles[indexToToggle];
    };
    /**
     * @param {?} product
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.standAloneProductDescription = /**
     * @param {?} product
     * @return {?}
     */
    function (product) {
        if (product.addons && product.addons.length > 0) {
            /** @type {?} */
            var description = "Contains " + product.addons.length;
            description = product.addons.length === 1 ? description + " Addon" : description + " Addons";
            return description;
        }
        return '';
    };
    /**
     * @param {?} product
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.standAloneProductWithParentDescription = /**
     * @param {?} product
     * @return {?}
     */
    function (product) {
        if (!product.parentInfo) {
            return '';
        }
        return "(Requires " + product.parentInfo.parentName + ")";
    };
    /**
     * @param {?} pkg
     * @return {?}
     */
    VaPackageDropdownComponent.prototype.packageDescription = /**
     * @param {?} pkg
     * @return {?}
     */
    function (pkg) {
        /** @type {?} */
        var hasProducts = pkg.products && pkg.products.length > 0;
        if (!hasProducts && pkg.totalAddons === 0) {
            return 'No Items in Package';
        }
        /** @type {?} */
        var description = '';
        /** @type {?} */
        var hasOneProduct = pkg.products && pkg.products.length === 1;
        if (hasProducts || pkg.totalAddons > 0) {
            description = 'Contains ';
        }
        if (hasProducts) {
            description = description + " " + pkg.products.length;
            description = hasOneProduct ? description + " Product" : description + " Products";
        }
        if (hasProducts && pkg.totalAddons > 0) {
            description = description + " & " + pkg.totalAddons;
            description = pkg.totalAddons === 1 ? description + " Addon" : description + " Addons";
        }
        return description;
    };
    VaPackageDropdownComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-package-dropdown',
                    animations: [
                        trigger('listAnimationStart', [
                            state('void', style({ height: '0px' })),
                            state('*', style({ height: '*' })),
                            transition('void => *', [animate('0.25s ease')]),
                            transition('* => void', [animate('0.25s ease')])
                        ])
                    ],
                    template: "<ng-container *ngIf=\"templateData$ | async as data\">\n  <mat-card class=\"package-list-container\" *ngIf=\"data.products?.length > 0 || data.packages?.length > 0 else loading\">\n    <mat-list>\n      <div class=\"package-list\" *ngFor=\"let package of data.packages; let packageIndex = index\">\n\n        <va-package-dropdown-item\n          [title]=\"package.name\"\n          [iconUrl]=\"package.icon\"\n          [subtitle]=\"hidePricing ? '' : package.formattedPrices\"\n          [statusItem]=\"package.activationStatus\"\n          [description]=\"packageDescription(package)\"\n          [enableDropdown]=\"package.products?.length > 0 || package.addonsWithNoParent?.length > 0\"\n          [toggleValue]=\"packageToggles[packageIndex]\"\n          (itemToggled)=\"togglePackage(packageIndex)\"\n        ></va-package-dropdown-item>\n\n        <mat-list class=\"product-or-addon-list package-dropdown-font\" *ngIf=\"packageToggles[packageIndex]\"\n                  [@listAnimationStart]>\n          <div *ngFor=\"let product of package.products\">\n            <va-package-dropdown-item\n              [title]=\"product.name\"\n              [subtitle]=\"product.tagline\"\n              [titleBadge]=\"product.editionName\"\n              [iconUrl]=\"product.icon\"\n              [statusItem]=\"product.activationStatus\"\n              [indent]=\"packageProductIndent\"\n            ></va-package-dropdown-item>\n\n            <va-package-dropdown-item\n              *ngFor=\"let addon of product.addons\"\n              [title]=\"addon.name\"\n              [subtitle]=\"addon.tagline\"\n              [iconUrl]=\"addon.icon\"\n              [statusItem]=\"addon.activationStatus\"\n              [indent]=\"packageAddonWithProductIndent\"\n            ></va-package-dropdown-item>\n          </div>\n\n          <va-package-dropdown-item\n            *ngFor=\"let addon of package.addonsWithNoParent\"\n            [title]=\"addon.name\"\n            [titleDescriptor]=\"'FRONTEND.STORE.REQUIRES_DESCRIPTOR' | translate: {requirementName: addon.parentName}\"\n            [subtitle]=\"addon.tagline\"\n            [iconUrl]=\"addon.icon\"\n            [secondaryIconUrl]=\"addon.parentIcon\"\n            [secondaryIconName]=\"addon.parentName\"\n            [statusItem]=\"addon.activationStatus\"\n            [indent]=\"packageAddonWithoutProductIndent\"\n          ></va-package-dropdown-item>\n        </mat-list>\n      </div>\n\n      <div class=\"product-list\" *ngFor=\"let product of data.products; let productIndex = index\">\n        <va-package-dropdown-item\n          [title]=\"product.name\"\n          [titleBadge]=\"product.editionName\"\n          [titleDescriptor]=\"standAloneProductWithParentDescription(product)\"\n          [iconUrl]=\"product.icon\"\n          [subtitle]=\"hidePricing ? '' : product.formattedPrices\"\n          [secondaryIconUrl]=\"product.parentInfo?.parentIconUrl\"\n          [secondaryIconName]=\"product.parentInfo?.parentName\"\n          [statusItem]=\"product.activationStatus\"\n          [description]=\"standAloneProductDescription(product)\"\n          [enableDropdown]=\"product.addons?.length > 0\"\n          [toggleValue]=\"productToggles[productIndex]\"\n          (itemToggled)=\"toggleProduct(productIndex)\"\n        ></va-package-dropdown-item>\n\n        <mat-list class=\"product-or-addon-list product-dropdown-font\" *ngIf=\"productToggles[productIndex]\"\n                  [@listAnimationStart]>\n          <va-package-dropdown-item\n            *ngFor=\"let addon of product.addons\"\n            [title]=\"addon.name\"\n            [subtitle]=\"addon.tagline\"\n            [iconUrl]=\"addon.icon\"\n            [statusItem]=\"addon.activationStatus\"\n            [indent]=\"productAddonIndent\"\n          ></va-package-dropdown-item>\n        </mat-list>\n      </div>\n\n    </mat-list>\n  </mat-card>\n</ng-container>\n\n<ng-template #loading>\n  <mat-card>\n    <div class=\"package-dropdown-stencil-display\">\n      <va-icon [iconUrl]=\"\"></va-icon>\n      <div class=\"stencil-text\">\n        <h1 class=\"stencil-title stencil-shimmer\"></h1>\n        <span class=\"stencil-tagline stencil-shimmer\"></span>\n      </div>\n    </div>\n  </mat-card>\n</ng-template>\n",
                    styles: [".package-dropdown-font,.product-dropdown-font{color:rgba(0,0,0,.54);font-size:14px;font-weight:400}.package-list-container{border-top:1px solid rgba(0,0,0,.12);padding:0}.package-list-container mat-list{padding:0}.package-dropdown-stencil-display{display:-webkit-box;display:flex;width:100%;-webkit-box-flex:1;flex-grow:1}.package-dropdown-stencil-display va-icon{margin-right:20px}.package-dropdown-stencil-display .stencil-text{width:inherit;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center}.package-dropdown-stencil-display .stencil-text .stencil-title{height:32px;width:40%;margin-bottom:5px!important;margin-top:0!important}.package-dropdown-stencil-display .stencil-text .stencil-tagline{height:32px;width:inherit}.product-or-addon-list{background-color:rgba(0,0,0,.04);overflow:hidden}"]
                }] }
    ];
    /** @nocollapse */
    VaPackageDropdownComponent.ctorParameters = function () { return [
        { type: TranslateService }
    ]; };
    VaPackageDropdownComponent.propDecorators = {
        packages: [{ type: Input }],
        products: [{ type: Input }],
        standAloneProducts: [{ type: Input }],
        statuses: [{ type: Input }],
        addons: [{ type: Input }],
        singularDropdown: [{ type: Input }],
        hidePricing: [{ type: Input }]
    };
    return VaPackageDropdownComponent;
}());
if (false) {
    /** @type {?} */
    VaPackageDropdownComponent.prototype.singularDropdown;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.hidePricing;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.packageProductIndent;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.packageAddonWithoutProductIndent;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.packageAddonWithProductIndent;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.productAddonIndent;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.packages$$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.products$$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.standAloneProducts$$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.statuses$$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.addons$$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.orderItemLengths$$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.templateData$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.salesPackages$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.salesProducts$;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.packageToggles;
    /** @type {?} */
    VaPackageDropdownComponent.prototype.productToggles;
    /**
     * @type {?}
     * @private
     */
    VaPackageDropdownComponent.prototype.translateService;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaPackageDropdownModule = /** @class */ (function () {
    function VaPackageDropdownModule() {
    }
    VaPackageDropdownModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        MatButtonModule,
                        MatCardModule,
                        MatListModule$1,
                        MatIconModule,
                        VaIconModule,
                        VaBadgeModule,
                        TranslateModule
                    ],
                    declarations: [VaPackageDropdownComponent, VaPackageDropdownItemComponent],
                    exports: [VaPackageDropdownComponent],
                    entryComponents: [VaPackageDropdownComponent]
                },] }
    ];
    return VaPackageDropdownModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaProductDetailsComponent = /** @class */ (function () {
    function VaProductDetailsComponent() {
        this.hasVerifiedContract = false;
        this.canAccessContractPricing = false;
        this.showActionButton = false;
        this.showPricing = false;
        this.showPricingAction = false;
        this.loaded = true;
        this.enableClicked = new EventEmitter();
        this.addonSelected = new EventEmitter();
        this.primaryPricingActionSelected = new EventEmitter();
        this.pricingActionSelected = new EventEmitter();
    }
    /**
     * @return {?}
     */
    VaProductDetailsComponent.prototype.getAddons = /**
     * @return {?}
     */
    function () {
        if (!this._addons) {
            this._addons = this.product.addons.map((/**
             * @param {?} addon
             * @return {?}
             */
            function (addon) { return Addon.fromApi(addon); }));
        }
        return this._addons;
    };
    /**
     * @return {?}
     */
    VaProductDetailsComponent.prototype.getActionLabel = /**
     * @return {?}
     */
    function () {
        if (this.product.isArchived) {
            return 'Enable';
        }
        return 'Enabled';
    };
    Object.defineProperty(VaProductDetailsComponent.prototype, "price", {
        get: /**
         * @return {?}
         */
        function () {
            // NOTE: wholesalePrice = 0 means free, wholesalePrice = null || -1 means "contact sales"
            /** @type {?} */
            var prices = [];
            if (this.product.wholesalePrice !== CONTACT_SALES && this.product.wholesalePrice != null) {
                prices = [{
                        price: this.product.wholesalePrice,
                        frequency: this.product.billingFrequency
                    }];
            }
            return {
                currency: this.product.currency,
                prices: prices
            };
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} addonId
     * @return {?}
     */
    VaProductDetailsComponent.prototype.onAddonSelected = /**
     * @param {?} addonId
     * @return {?}
     */
    function (addonId) {
        this.addonSelected.emit(addonId);
    };
    VaProductDetailsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-product-details',
                    template: "<div class=\"page\">\n    <va-header-container [iconUrl]=\"product.iconUrl\"\n                         [title]=\"product.name\"\n                         [tagline]=\"product.tagline\"\n                         [chipLabels]=\"product.getLmiCategoryNames()\"\n                         [pricing]=\"price\"\n                         [pricingLabel]=\"'Wholesale Price'\"\n                         [primaryPricingActionLabel]=\"primaryPricingActionLabel\"\n                         [pricingActionLabel]=\"pricingActionLabel\"\n                         [pricingActionEnabled]=\"showPricingAction\"\n                         [actionLabel]=\"getActionLabel()\"\n                         [actionEnabled]=\"product.isArchived\"\n                         [showAction]=\"showActionButton\"\n                         [showPricing]=\"showPricing\"\n                         [billedProduct]=\"billedProduct\"\n                         [hasVerifiedContract]=\"hasVerifiedContract\"\n                         [loaded]=\"loaded\"\n                         (primaryPricingActionSelected)=\"primaryPricingActionSelected.emit()\"\n                         (pricingActionSelected)=\"pricingActionSelected.emit()\"\n                         (actionSelected)=\"enableClicked.emit()\">\n    </va-header-container>\n    <div class=\"product-details product-content\">\n      <div class=\"left-column\">\n        <ng-container *ngIf=\"product.description || product.keySellingPoints\">\n          <va-selling-info [description]=\"product.description\"\n                          [keySellingPoints]=\"product.keySellingPoints\"></va-selling-info>\n        </ng-container>\n        <section *ngIf=\"product.addons?.length > 0\">\n          <h2 class=\"va-component-title\">Add-Ons</h2>\n          <va-addon-list (addonSelected)=\"onAddonSelected($event)\"\n                         [addons]=\"getAddons()\"\n                         [showPricing]=\"showPricing\"\n                         [hasVerifiedContract]=\"hasVerifiedContract\"\n                         [canAccessContractPricing]=\"canAccessContractPricing\"\n                         [partnerID]=\"partnerID\">\n          </va-addon-list>\n        </section>\n\n        <section *ngIf=\"product.faqs?.length > 0\">\n          <h2 class=\"va-component-title\">FAQs</h2>\n          <va-faqs [faqs]=\"product.faqs\"></va-faqs>\n        </section>\n      </div>\n\n      <div class=\"right-column\">\n        <section *ngIf=\"product.restrictions?.country?.whitelist?.length > 0\">\n          <supported-countries [countryCodes]=\"product.restrictions.country.whitelist\"></supported-countries>\n        </section>\n\n        <section *ngIf=\"product.screenshotUrls?.length > 0\">\n          <h2 class=\"va-component-title\">Gallery</h2>\n          <va-image-gallery [imageUrls]=\"product.screenshotUrls\"></va-image-gallery>\n        </section>\n\n        <section *ngIf=\"product.files?.length > 0\">\n          <h2 class=\"va-component-title\">Files</h2>\n          <va-files [files]=\"product.files\"></va-files>\n        </section>\n      </div>\n    </div>\n</div>\n",
                    styles: [":host{display:block;font-size:14px;line-height:1.4}:host *{box-sizing:border-box}.va-component-title{font-size:24px;font-weight:300;margin-top:0}@media screen and (min-width:600px){.va-component-title{font-size:32px}}img{max-width:100%}va-icon{display:inline-block}.sales-person-details{max-height:430px;overflow:hidden}.page{position:relative;margin:0 auto 20px;background:#fff;color:#212121;box-shadow:0 3px 10px rgba(33,33,33,.3);overflow:hidden;font-size:16px}.page .item-amount{color:#9e9e9e;font-size:14px;text-align:right;margin:0 24px 8px}section{padding:24px}.left-column{width:66%}@media screen and (max-width:600px){.left-column{width:100%}}.right-column{width:34%}.product-content{display:-webkit-box;display:flex}@media screen and (max-width:600px){.right-column{width:100%}.product-content{-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}}"]
                }] }
    ];
    VaProductDetailsComponent.propDecorators = {
        product: [{ type: Input }],
        billedProduct: [{ type: Input }],
        hasVerifiedContract: [{ type: Input }],
        canAccessContractPricing: [{ type: Input }],
        showActionButton: [{ type: Input }],
        showPricing: [{ type: Input }],
        primaryPricingActionLabel: [{ type: Input }],
        pricingActionLabel: [{ type: Input }],
        showPricingAction: [{ type: Input }],
        loaded: [{ type: Input }],
        partnerID: [{ type: Input }],
        enableClicked: [{ type: Output }],
        addonSelected: [{ type: Output }],
        primaryPricingActionSelected: [{ type: Output }],
        pricingActionSelected: [{ type: Output }]
    };
    return VaProductDetailsComponent;
}());
if (false) {
    /** @type {?} */
    VaProductDetailsComponent.prototype.product;
    /** @type {?} */
    VaProductDetailsComponent.prototype.billedProduct;
    /** @type {?} */
    VaProductDetailsComponent.prototype.hasVerifiedContract;
    /** @type {?} */
    VaProductDetailsComponent.prototype.canAccessContractPricing;
    /** @type {?} */
    VaProductDetailsComponent.prototype.showActionButton;
    /** @type {?} */
    VaProductDetailsComponent.prototype.showPricing;
    /** @type {?} */
    VaProductDetailsComponent.prototype.primaryPricingActionLabel;
    /** @type {?} */
    VaProductDetailsComponent.prototype.pricingActionLabel;
    /** @type {?} */
    VaProductDetailsComponent.prototype.showPricingAction;
    /** @type {?} */
    VaProductDetailsComponent.prototype.loaded;
    /** @type {?} */
    VaProductDetailsComponent.prototype.partnerID;
    /** @type {?} */
    VaProductDetailsComponent.prototype.enableClicked;
    /** @type {?} */
    VaProductDetailsComponent.prototype.addonSelected;
    /** @type {?} */
    VaProductDetailsComponent.prototype.primaryPricingActionSelected;
    /** @type {?} */
    VaProductDetailsComponent.prototype.pricingActionSelected;
    /**
     * @type {?}
     * @private
     */
    VaProductDetailsComponent.prototype._addons;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var VaProductDetailsModule = /** @class */ (function () {
    function VaProductDetailsModule() {
    }
    VaProductDetailsModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        VaImageGalleryModule, CommonModule, VaIconModule,
                        VaPricingModule, VaFilesModule, VaFaqsModule, VaSellingInfoModule,
                        VaHeaderContainerModule, VaSafeHtmlModule, VaAddonListModule, RestrictionsModule
                    ],
                    declarations: [VaProductDetailsComponent],
                    exports: [VaProductDetailsComponent],
                    entryComponents: [VaProductDetailsComponent]
                },] }
    ];
    return VaProductDetailsModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ResellerItem = /** @class */ (function () {
    function ResellerItem(data) {
        this.quantity = 1;
        data = data || {};
        Object.assign(this, data);
    }
    return ResellerItem;
}());
if (false) {
    /** @type {?} */
    ResellerItem.prototype.appId;
    /** @type {?} */
    ResellerItem.prototype.addonId;
    /** @type {?} */
    ResellerItem.prototype.name;
    /** @type {?} */
    ResellerItem.prototype.icon;
    /** @type {?} */
    ResellerItem.prototype.tagline;
    /** @type {?} */
    ResellerItem.prototype.headerImage;
    /** @type {?} */
    ResellerItem.prototype.currency;
    /** @type {?} */
    ResellerItem.prototype.price;
    /** @type {?} */
    ResellerItem.prototype.billingFrequency;
    /** @type {?} */
    ResellerItem.prototype.lmiCategories;
    /** @type {?} */
    ResellerItem.prototype.enabled;
    /** @type {?} */
    ResellerItem.prototype.isCustom;
    /** @type {?} */
    ResellerItem.prototype.orderForm;
    /** @type {?} */
    ResellerItem.prototype.quantity;
    /** @type {?} */
    ResellerItem.prototype.allowMultipleActivations;
    /** @type {?} */
    ResellerItem.prototype.usesCustomizationForm;
    /** @type {?} */
    ResellerItem.prototype.usesActivationSpecificEntryUrl;
    /** @type {?} */
    ResellerItem.prototype.entryUrl;
    /** @type {?} */
    ResellerItem.prototype.restrictions;
    /** @type {?} */
    ResellerItem.prototype.activationRequiresApproval;
    /** @type {?} */
    ResellerItem.prototype.billingId;
    /** @type {?} */
    ResellerItem.prototype.usesEditions;
    /** @type {?} */
    ResellerItem.prototype.editionIds;
    /** @type {?} */
    ResellerItem.prototype.suggestedRetailPrice;
    /** @type {?} */
    ResellerItem.prototype.editionId;
    /** @type {?} */
    ResellerItem.prototype.trialConfiguration;
    /** @type {?} */
    ResellerItem.prototype.integration;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var CheckboxField = /** @class */ (function (_super) {
    __extends(CheckboxField, _super);
    function CheckboxField() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.controlType = 'checkbox';
        return _this;
    }
    return CheckboxField;
}(FieldBase));
if (false) {
    /** @type {?} */
    CheckboxField.prototype.controlType;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function Option() { }
if (false) {
    /** @type {?} */
    Option.prototype.value;
    /** @type {?} */
    Option.prototype.label;
    /** @type {?|undefined} */
    Option.prototype.disabled;
}
/**
 * @record
 */
function DropDownFieldOptions() { }
if (false) {
    /** @type {?} */
    DropDownFieldOptions.prototype.options;
    /** @type {?|undefined} */
    DropDownFieldOptions.prototype.allowMultiples;
    /** @type {?|undefined} */
    DropDownFieldOptions.prototype.allowDuplicates;
    /** @type {?|undefined} */
    DropDownFieldOptions.prototype.maxChoices;
}
var DropdownField = /** @class */ (function (_super) {
    __extends(DropdownField, _super);
    function DropdownField(options) {
        var _this = _super.call(this, options) || this;
        _this.controlType = 'dropdown';
        _this.options = [];
        if (!!options.options && options.options.length > 0) {
            // Because this typeof guard is on the element and not the array as a whole typescript doesn't recognize it as a valid type assertion
            // The ts-ignore's are required because of this
            if (typeof options.options[0] === 'string') {
                if (options.allowMultiples) {
                    // @ts-ignore
                    _this.options = options.options.map((/**
                     * @param {?} o
                     * @return {?}
                     */
                    function (o) { return ({ value: o, name: o }); }));
                }
                else {
                    // @ts-ignore
                    _this.options = options.options.map((/**
                     * @param {?} o
                     * @return {?}
                     */
                    function (o) { return ({ value: o, label: o }); }));
                }
            }
            else {
                if (options.allowMultiples) {
                    // @ts-ignore
                    _this.options = options.options.map((/**
                     * @param {?} o
                     * @return {?}
                     */
                    function (o) { return ({ value: o.value, name: o.label }); }));
                }
                else {
                    // @ts-ignore
                    _this.options = options.options;
                }
            }
        }
        _this.allowMultiples = !!options.allowMultiples;
        _this.allowDuplicates = !!options.allowDuplicates;
        _this.maxChoices = options.maxChoices ? options.maxChoices : 1;
        _this.validator = _this.validatorBuilder();
        return _this;
    }
    /**
     * @protected
     * @return {?}
     */
    DropdownField.prototype.validatorBuilder = /**
     * @protected
     * @return {?}
     */
    function () {
        /** @type {?} */
        var maxChoices = this.maxChoices;
        return (/**
         * @param {?} control
         * @return {?}
         */
        function (control) {
            if (Array.isArray(control.value) && maxChoices && control.value.length > maxChoices) {
                return { overMaxChoices: true };
            }
        });
    };
    return DropdownField;
}(FieldBase));
if (false) {
    /** @type {?} */
    DropdownField.prototype.controlType;
    /** @type {?} */
    DropdownField.prototype.options;
    /** @type {?} */
    DropdownField.prototype.allowMultiples;
    /** @type {?} */
    DropdownField.prototype.allowDuplicates;
    /** @type {?} */
    DropdownField.prototype.maxChoices;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
var DEFAULT_NUM_FILES = 5;
/**
 * @record
 */
function FileUploadGroupFieldOptions() { }
if (false) {
    /** @type {?} */
    FileUploadGroupFieldOptions.prototype.fileType;
    /** @type {?} */
    FileUploadGroupFieldOptions.prototype.uploadUrl;
    /** @type {?} */
    FileUploadGroupFieldOptions.prototype.numFiles;
}
var FileUploadGroupField = /** @class */ (function (_super) {
    __extends(FileUploadGroupField, _super);
    function FileUploadGroupField(options) {
        var _this = _super.call(this, options) || this;
        _this.controlType = 'file';
        if (!options.uploadUrl) {
            throw new Error('uploadUrl is required.');
        }
        _this.fileType = options.fileType || 'image';
        _this.numFiles = options.numFiles || DEFAULT_NUM_FILES;
        _this.uploadUrl = options.uploadUrl;
        _this.value = [];
        return _this;
    }
    return FileUploadGroupField;
}(FieldBase));
if (false) {
    /** @type {?} */
    FileUploadGroupField.prototype.controlType;
    /** @type {?} */
    FileUploadGroupField.prototype.fileType;
    /** @type {?} */
    FileUploadGroupField.prototype.uploadUrl;
    /** @type {?} */
    FileUploadGroupField.prototype.numFiles;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var TextareaField = /** @class */ (function (_super) {
    __extends(TextareaField, _super);
    function TextareaField() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.controlType = 'textarea';
        return _this;
    }
    return TextareaField;
}(FieldBase));
if (false) {
    /** @type {?} */
    TextareaField.prototype.controlType;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function TextBoxFieldOptions() { }
if (false) {
    /** @type {?} */
    TextBoxFieldOptions.prototype.textboxType;
    /** @type {?|undefined} */
    TextBoxFieldOptions.prototype.prefix;
    /** @type {?|undefined} */
    TextBoxFieldOptions.prototype.suffix;
    /** @type {?|undefined} */
    TextBoxFieldOptions.prototype.displayOnly;
}
var TextboxField = /** @class */ (function (_super) {
    __extends(TextboxField, _super);
    function TextboxField(options) {
        var _this = _super.call(this, options) || this;
        _this.controlType = 'textbox';
        _this.textboxType = options.textboxType || 'text';
        _this.prefix = options.prefix || '';
        _this.suffix = options.suffix || '';
        _this.regexValidator = options.regexValidator || '';
        _this.regexErrorMessage = options.regexErrorMessage || '';
        _this.displayOnly = options.displayOnly || false;
        return _this;
    }
    return TextboxField;
}(FieldBase));
if (false) {
    /** @type {?} */
    TextboxField.prototype.controlType;
    /** @type {?} */
    TextboxField.prototype.textboxType;
    /** @type {?} */
    TextboxField.prototype.prefix;
    /** @type {?} */
    TextboxField.prototype.suffix;
    /** @type {?} */
    TextboxField.prototype.regexValidator;
    /** @type {?} */
    TextboxField.prototype.regexErrorMessage;
    /** @type {?} */
    TextboxField.prototype.displayOnly;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @record
 */
function User() { }
if (false) {
    /** @type {?} */
    User.prototype.userId;
    /** @type {?} */
    User.prototype.email;
    /** @type {?|undefined} */
    User.prototype.firstName;
    /** @type {?|undefined} */
    User.prototype.lastName;
}
/**
 * @record
 */
function VBCUserFieldOptions() { }
if (false) {
    /** @type {?} */
    VBCUserFieldOptions.prototype.users;
}
var VBCUserField = /** @class */ (function (_super) {
    __extends(VBCUserField, _super);
    function VBCUserField(options) {
        var _this = _super.call(this, {
            id: options.id,
            label: options.label,
            required: options.required,
            description: options.description,
            options: getOptions(options.users),
            disabled: options.disabled,
            forOfficeUseOnly: options.forOfficeUseOnly
        }) || this;
        _this.controlType = 'vbcuser';
        return _this;
    }
    return VBCUserField;
}(DropdownField));
if (false) {
    /** @type {?} */
    VBCUserField.prototype.controlType;
}
/**
 * @param {?} vbcUsers
 * @return {?}
 */
function getOptions(vbcUsers) {
    if (vbcUsers && vbcUsers.length > 0) {
        vbcUsers.sort(compareUsersByEmail);
        return vbcUsers.map((/**
         * @param {?} user
         * @return {?}
         */
        function (user) {
            /** @type {?} */
            var labelString = createLabelString(user.firstName, user.lastName, user.email);
            if (user.userId && user.email && user.firstName && user.lastName) {
                return {
                    label: labelString,
                    value: JSON.stringify({ firstName: user.firstName, lastName: user.lastName, email: user.email, id: user.userId })
                };
            }
            return { label: labelString, value: '', disabled: true };
        }));
    }
    return [{ label: 'No Users — Please add one to this account', value: '', disabled: true }];
}
/**
 * @param {?} a
 * @param {?} b
 * @return {?}
 */
function compareUsersByEmail(a, b) {
    if (a == null) {
        return -1;
    }
    if (b == null) {
        return 1;
    }
    return a.email.localeCompare(b.email);
}
/**
 * @param {?} firstName
 * @param {?} lastName
 * @param {?} email
 * @return {?}
 */
function createLabelString(firstName, lastName, email) {
    /** @type {?} */
    var returnString = '';
    returnString += firstName ? firstName + ' ' : '';
    returnString += lastName ? lastName + ' ' : '';
    returnString += email ? "(" + email + ")" : '';
    return returnString;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

export { ActivationStatus, AddonDetailsComponent, AddonDropDownFormSectionData, AddonModule, BUSINESS_USER, CHECK_BOX, CONTACT_SALES, CardListStencilComponent, CardStencilComponent, CaseTransform, CheckboxField, DROP_DOWN, DetailsStencilComponent, DropDownFormSectionComponent, DropDownFormSectionData, DropdownField, FILES, FORM_FIELDS, FieldBase, FieldBuilderComponent, FieldComponent, FieldService, File, FileUploadGroupField, HeimdallServiceToken, LMI_CATEGORIES, LMI_CATEGORIES_BY_NAME, LMI_CATEGORY_MAP, ListStencilComponent, OrderFormComponent, OrderFormSectionComponent, OrderFormSectionData, Package, PackageDetails, Product, ProductOrderFormSectionData, ProductWithParent, ProductsNavV2Component, ResellerItem, RestrictionsModule, STOREFRONT_FILTER_NAME, SearchBarStencilComponent, StencilsModule, StoreCardComponent, StoreCardModule, StoreComponent, StoreModule, StoreService, StorefrontComponent, TEXT_AREA, TEXT_BOX, TextareaField, TextboxField, VBCUserField, VaAddonListComponent, VaAddonListModule, VaFaqsComponent, VaFaqsModule, VaFilesComponent, VaFilesModule, VaHeaderContainerComponent, VaHeaderContainerModule, VaOrderFormModule, VaPackageDetailsComponent, VaPackageDetailsModule, VaPackageDetailsV2Component, VaPackageDetailsV2Module, VaPackageDropdownComponent, VaPackageDropdownModule, VaPricingComponent, VaPricingModule, VaProductDetailsComponent, VaProductDetailsModule, VaProductsNavComponent, VaProductsNavModule, VaSalespersonDetailsComponent, VaSalespersonDetailsModule, VaSellingInfoComponent, VaSellingInfoModule, combineProductOrderWithContainedProducts, convertToPackageDetails, getUniqueProductAddonId, orderProductsAndAddons, HeimdallClient as ɵb, HeimdallClientModule as ɵc, HighlightPricingComponent as ɵd, TablePricingComponent as ɵe, OrderItemListComponent as ɵf, PricePipe as ɵg, FormatBillingFrequencyPipe as ɵh, OrderFormService as ɵi, OrderItemListService as ɵj, SupportedCountriesComponent as ɵk, VaPackageDetailsV2Component as ɵl, Sellable as ɵm, VaPackageDropdownItemComponent as ɵn };
//# sourceMappingURL=vendasta-store.js.map