ng-shopping-cart
Version:
An Angular component library to create shopping carts
3 lines (2 loc) • 33.1 kB
JavaScript
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/common/http")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","@angular/common/http"],e):e(t["ng-shopping-cart"]={},t.ng.core,t.ng.common,t.ng.common.http)}(this,function(t,e,n,r){"use strict";var a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])};function i(t,e){function n(){this.constructor=t}a(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}function o(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var r,a,i=n.call(t),o=[];try{for(;(void 0===e||e-- >0)&&!(r=i.next()).done;)o.push(r.value)}catch(s){a={error:s}}finally{try{r&&!r.done&&(n=i["return"])&&n.call(i)}finally{if(a)throw a.error}}return o}function s(t){if(!t)throw new Error("Invalid format for currency. Expected a non empty string");var e={currencyCode:undefined,display:"symbol",digitsInfo:undefined,locale:undefined},n=["currencyCode","display","digitsInfo","locale"],r=t.split(":");if(r.length>4)throw new Error("Invalid format for currency. Expected a value in the form "+n.join(":")+" and got "+t);return r.forEach(function(t,r){var a=t;"auto"===a&&(a=1===r?"symbol":undefined),e[n[r]]=a}),e}var c=function(){function t(){this.localeFormat=s("auto"),this.format="auto",this.onChange=new e.EventEmitter,this.onItemAdded=new e.EventEmitter,this.onItemRemoved=new e.EventEmitter,this.onItemsChanged=new e.EventEmitter,this.onTaxChange=new e.EventEmitter,this.onShippingChange=new e.EventEmitter}return t.prototype.getTax=function(){return this.cost()*(this.getTaxRate()/100)},t.prototype.totalCost=function(){return this.cost()+this.getTax()+this.getShipping()},t.prototype.setLocaleFormat=function(t){this.localeFormat=s(t),this.format=t,this.onChange.emit({change:"format",value:this.format})},t.prototype.getLocaleFormat=function(t){return void 0===t&&(t=!1),t?this.localeFormat:this.format},t.prototype.toObject=function(){return{taxRate:this.getTaxRate(),shipping:this.getShipping(),items:this.getItems()}},t}(),u=function(){function t(){}return t.prototype.total=function(){return this.getPrice()*this.getQuantity()},t}(),p=function(){function t(t){this.cartService=t,this._editorQuantity=1,this.hasEditor=!1,this.horizontalEditor=!0,this.editorPrecedence="before",this.custom=!1,this.buttonText="Add to cart",this.buttonClass="add-to-cart-button",this.type="button",this.position="left",this.dropdown=[{label:"1 item",value:1},{label:"2 items",value:2},{label:"5 items",value:5}],this.change=new e.EventEmitter,this.added=new e.EventEmitter}return Object.defineProperty(t.prototype,"editorQuantity",{get:function(){return this._editorQuantity},set:function(t){this._editorQuantity=t,this.change.emit(t)},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){this.computeClass()},t.prototype.itemQuantity=function(){return"button"===this.type?this.quantity?this.quantity:this.item.getQuantity():this._editorQuantity},t.prototype.ngOnChanges=function(t){if(t.type&&(this.hasEditor="button"!==t.type.currentValue,"dropdown"===t.type.currentValue&&this.dropdown.length)){var e=this.itemQuantity();this.dropdown.find(function(t){return t.value===e})||(this._editorQuantity=this.dropdown[0].value)}if(t.position){var n=t.position.currentValue;this.horizontalEditor="left"===n||"right"===n,this.editorPrecedence="left"===n||"top"===n?"before":"after"}this.computeClass()},t.prototype.addToCart=function(t){if(t.stopPropagation(),this.item){var e=this.itemQuantity();this.item.setQuantity(e),this.cartService.addItem(this.item),this.added.emit(this.item)}},t.prototype.computeClass=function(){this.containerClass=["add-to-cart-"+this.type,this.horizontalEditor?"editor-position-horizontal":"editor-position-vertical"]},t}();p.decorators=[{type:e.Component,args:[{selector:"add-to-cart",template:'<div class="add-to-cart" [ngClass]="containerClass">\n <div class="add-to-cart-component" [ngClass]="position"\n *ngIf="editorPrecedence === \'before\' && hasEditor">\n <add-to-cart-editor [type]="type" [dropdown]="dropdown" [(value)]="editorQuantity"></add-to-cart-editor>\n </div>\n <div class="cart-button-container" (click)="addToCart($event)">\n <ng-container *ngIf="!custom">\n <button type="button" [ngClass]="buttonClass" [disabled]="!item">\n {{buttonText}}\n </button>\n </ng-container>\n <ng-content *ngIf="custom">\n </ng-content>\n </div>\n <div class="add-to-cart-component" [ngClass]="position"\n *ngIf="editorPrecedence === \'after\' && hasEditor">\n <add-to-cart-editor [type]="type" [dropdown]="dropdown" [(value)]="editorQuantity"></add-to-cart-editor>\n </div>\n</div>\n'}]}],p.ctorParameters=function(){return[{type:c}]},p.propDecorators={custom:[{type:e.Input}],item:[{type:e.Input}],buttonText:[{type:e.Input}],buttonClass:[{type:e.Input}],type:[{type:e.Input}],position:[{type:e.Input}],dropdown:[{type:e.Input}],quantity:[{type:e.Input}],change:[{type:e.Output}],added:[{type:e.Output}]};var l=function(){function t(t,r,a){this.cartService=t,this.httpClient=r,this.locale=a,this.empty=!0,this.cost=0,this.taxRate=0,this.shipping=0,this.currency="USD",this.paypalLocale="en",this.custom=!1,this.buttonText="Checkout",this.buttonClass="cart-checkout-button",this.service="log",this.settings=null,this.checkout=new e.EventEmitter,this.error=new e.EventEmitter,this.getLocaleCurrencyName=n.getLocaleCurrencyName}return t.prototype.ngOnInit=function(){var t=this;this.updateCart(!0),this._serviceSubscription=this.cartService.onChange.subscribe(function(e){return t.updateCart("format"===e.change)})},t.prototype.updateCart=function(t){this.empty=this.cartService.isEmpty(),this.cost=this.cartService.cost(),this.taxRate=this.cartService.getTaxRate(),this.shipping=this.cartService.getShipping(),t&&this.updateLocale()},t.prototype.updateLocale=function(){this.format=this.localeFormat?s(this.localeFormat):this.cartService.getLocaleFormat(!0);var t=this.format.locale||this.locale;this.paypalLocale=t.substring(0,2),this.currency=this.format.currencyCode||this.getCurrency(t)},t.prototype.getCurrency=function(t){var e=this.getLocaleCurrencyName(t);if(!e)return"USD";if(3===e.length)return e;var r=new n.CurrencyPipe(t).transform(0,undefined,"code","1.0-0",t),a=r.startsWith("0");return r.substr(a?-3:0,3)},t.prototype.doCheckout=function(){var t=this,e=this.cartService.toObject();switch(this.service){case"log":console.log(e),this.checkout.emit(e);break;case"http":if(!this.settings)throw new Error("Missing settings configuration");var n=["POST","PUT","PATCH"],a=this.httpSettings,i=a.url,o=a.method,s=void 0===o?"POST":o,c=a.options,u=a.body,p=s.toUpperCase();if(-1===n.indexOf(p))throw new Error("Invalid http verb found in method setting. Expected one of "+n.join(" ")+" and got "+s);if(u&&(e="function"==typeof u?u(e):Object.assign({},e,u)),c&&c.headers&&c.headers.has("Content-Type"))c.headers.get("Content-Type").startsWith("application/x-www-form-urlencoded")&&(e=new r.HttpParams({fromObject:e}));this.httpClient.request(new r.HttpRequest(p,i,e,c)).toPromise().then(function(e){t.checkout.emit(e)})["catch"](function(e){t.error.emit(e)})}},t.prototype.ngOnChanges=function(t){if(t.settings&&t.settings.currentValue){var e=Object.prototype.hasOwnProperty,n=t.settings.currentValue;e.call(n,"business")&&(this.paypalSettings=t.settings.currentValue),e.call(n,"url")&&(this.httpSettings=t.settings.currentValue)}t.localeFormat&&this.updateLocale()},t.prototype.ngOnDestroy=function(){this._serviceSubscription.unsubscribe()},t}();l.decorators=[{type:e.Component,args:[{selector:"cart-checkout",template:'<ng-container *ngIf="service === \'log\' || service === \'http\'">\n <button [ngClass]="buttonClass" [disabled]="empty" *ngIf="!custom" (click)="doCheckout()">\n {{buttonText}}\n </button>\n <span (click)="doCheckout()" *ngIf="custom">\n <ng-content>\n </ng-content>\n </span>\n</ng-container>\n<ng-container *ngIf="service === \'paypal\'">\n <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">\n <input type="hidden" name="cmd" value="_xclick"/>\n <input type="hidden" name="business" value="{{paypalSettings.business}}"/>\n <input type="hidden" name="lc" value="{{paypalLocale}}"/>\n <input type="hidden" name="item_name" value="{{paypalSettings.itemName}}" *ngIf="paypalSettings.itemName"/>\n <input type="hidden" name="item_number" value="{{paypalSettings.itemNumber}}" *ngIf="paypalSettings.itemNumber"/>\n <input type="hidden" name="amount" value="{{cost}}"/>\n <input type="hidden" name="currency_code" value="{{currency}}"/>\n <input type="hidden" name="tax_rate" value="{{taxRate}}"/>\n <input type="hidden" name="shipping" value="{{shipping}}"/>\n <input type="hidden" name="bn" value="{{paypalSettings.serviceName + \'_BuyNow_WPS_\' + paypalSettings.country}}"\n *ngIf="paypalSettings.serviceName && paypalSettings.country"/>\n <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit"\n alt="PayPal - The safer, easier way to pay online!"/>\n <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1"/>\n </form>\n</ng-container>\n'}]}],l.ctorParameters=function(){return[{type:c},{type:r.HttpClient},{type:undefined,decorators:[{type:e.Inject,args:[e.LOCALE_ID]}]}]},l.propDecorators={custom:[{type:e.Input}],buttonText:[{type:e.Input}],buttonClass:[{type:e.Input}],service:[{type:e.Input}],settings:[{type:e.Input}],localeFormat:[{type:e.Input}],checkout:[{type:e.Output}],error:[{type:e.Output}]};var m=function(){function t(t){this.cartService=t,this.noItemsText="No items",this.oneItemText="One item",this.manyItemsText="# items",this.totalItems=0,this.totalCost=0}return t.prototype.updateItemsText=function(){var t=this.noItemsText;this.totalItems>0&&(t=1===this.totalItems?this.oneItemText:this.manyItemsText),this.itemsText=t.replace("#",this.totalItems.toString())},t.prototype.updateComponent=function(){this.totalItems=this.cartService.itemCount(),this.totalCost=this.cartService.isEmpty()?0:this.cartService.totalCost(),this.localeFormat||(this.format=this.cartService.getLocaleFormat(!0)),this.updateItemsText()},t.prototype.ngOnInit=function(){var t=this;this.updateComponent(),this._serviceSubscription=this.cartService.onChange.subscribe(function(){t.updateComponent()})},t.prototype.ngOnChanges=function(t){t.localeFormat&&(this.format=this.localeFormat?s(this.localeFormat):this.cartService.getLocaleFormat(!0)),(t.noItemsText||t.oneItemText||t.manyItemsText)&&this.updateItemsText()},t.prototype.ngOnDestroy=function(){this._serviceSubscription.unsubscribe()},t}();m.decorators=[{type:e.Component,args:[{selector:"cart-summary",template:'<div class="cart-summary">\n <div class="cart-summary-icon">\n <svg *ngIf="!icon" version="1.1" class="summary-icon" xmlns="http://www.w3.org/2000/svg"\n xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32">\n <path stroke="currentColor" stroke-width="2" stroke-linecap="round" fill="none" stroke-linejoin="round"\n d="M2,4 L6,4 L10,20 L21,20 L25,10 L8,10 M13,10 L13,20 M18,20 L18,10 M10,15 L23,15"/>\n <circle fill="currentColor" cx="11" cy="24" r="2"/>\n <circle fill="currentColor" cx="21" cy="24" r="2"/>\n </svg>\n <img *ngIf="icon" [src]="icon" class="summary-icon" alt="cart-summary-icon">\n </div>\n <div class="cart-summary-contents">\n <div class="cart-summary-items">\n {{itemsText}}\n </div>\n <div class="cart-summary-cost">\n {{totalCost | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </div>\n </div>\n</div>\n'}]}],m.ctorParameters=function(){return[{type:c}]},m.propDecorators={icon:[{type:e.Input}],noItemsText:[{type:e.Input}],oneItemText:[{type:e.Input}],manyItemsText:[{type:e.Input}],localeFormat:[{type:e.Input}]};var h=function(){function t(){this.type="text",this.value=1,this.valueChange=new e.EventEmitter}return t.prototype.changeValue=function(t){var e=parseFloat(t);this.valueChange.emit(Number.isNaN(e)?1:e)},t}();h.decorators=[{type:e.Component,args:[{selector:"add-to-cart-editor",template:'<ng-container *ngIf="type === \'dropdown\'">\n <select class="add-to-cart-input" #selectAmount (change)="changeValue(selectAmount.value)">\n <option [selected]="item.value === value" *ngFor="let item of dropdown" [value]="item.value">{{item.label}}</option>\n </select>\n</ng-container>\n<ng-container *ngIf="type === \'number\' || type === \'text\'">\n <input class="add-to-cart-input" #inputAmount [type]="type" (change)="changeValue(inputAmount.value)" [value]="value">\n</ng-container>\n'}]}],h.ctorParameters=function(){return[]},h.propDecorators={type:[{type:e.Input}],dropdown:[{type:e.Input}],value:[{type:e.Input}],valueChange:[{type:e.Output}]};var d=function(){function t(t){this.cartService=t,this.display="responsive-table",this.images=!0,this.emptyText="Your cart is empty",this.customEmptyContent=!1,this.nameHeaderText="Name",this.quantityHeaderText="Quantity",this.priceHeaderText="Price",this.totalHeaderText="Total",this.taxFooterText="Tax",this.shippingFooterText="Shipping",this.totalFooterText="Total",this.empty=!0,this.taxRate=0,this.tax=0,this.shipping=0,this.cost=0}return t.prototype.update=function(){this.empty=this.cartService.isEmpty(),this.items=this.cartService.getItems(),this.taxRate=this.cartService.getTaxRate()/100,this.tax=this.cartService.getTax(),this.shipping=this.cartService.getShipping(),this.cost=this.cartService.totalCost(),this.localeFormat||(this.format=this.cartService.getLocaleFormat(!0))},t.prototype.increase=function(t){t.setQuantity(t.getQuantity()+1),this.cartService.addItem(t)},t.prototype.decrease=function(t){t.getQuantity()>1?(t.setQuantity(t.getQuantity()-1),this.cartService.addItem(t)):this.cartService.removeItem(t.getId())},t.prototype.ngOnInit=function(){var t=this;this.update(),this._serviceSubscription=this.cartService.onChange.subscribe(function(){t.update()})},t.prototype.ngOnChanges=function(t){t.localeFormat&&(this.format=this.localeFormat?s(this.localeFormat):this.cartService.getLocaleFormat(!0))},t.prototype.ngOnDestroy=function(){this._serviceSubscription.unsubscribe()},t}();d.decorators=[{type:e.Component,args:[{selector:"cart-view",template:'<ng-container *ngIf="empty">\n <div *ngIf="!customEmptyContent" class="cart-view-empty">\n {{emptyText}}\n </div>\n <ng-content *ngIf="customEmptyContent"></ng-content>\n</ng-container>\n<ng-container *ngIf="!empty">\n <ng-container *ngIf="display !== \'table\'">\n <div *ngIf="!empty" class="cart-view" [ngClass]="display + \'-display\'">\n <div class="cart-list-view" [ngClass]="{\'no-images\': !images}">\n <div class="cart-list-header">\n <div class="cart-list-header-value cart-list-image-header">\n </div>\n <div class="cart-list-header-value cart-list-name-header">\n {{nameHeaderText}}\n </div>\n <div class="cart-list-header-value cart-list-quantity-header">\n {{quantityHeaderText}}\n </div>\n <div class="cart-list-header-value cart-list-price-header">\n {{priceHeaderText}}\n </div>\n <div class="cart-list-header-value cart-list-total-header">\n {{totalHeaderText}}\n </div>\n </div>\n <div *ngFor="let cartItem of items" class="cart-list-item">\n <div class="cart-list-value cart-list-image-value"\n [ngStyle]="{\'background-image\': \'url(\' + cartItem.getImage() + \')\'}">\n </div>\n <div class="cart-list-value cart-list-name-value">\n {{cartItem.getName()}}\n </div>\n <div class="cart-list-value cart-list-quantity-value">\n <button type="button" class="cart-increase-button" (click)="increase(cartItem)">\n +\n </button>\n <span class="cart-list-quantity-content">{{cartItem.getQuantity()}}</span>\n <button type="button" class="cart-decrease-button" (click)="decrease(cartItem)">\n -\n </button>\n </div>\n <div class="cart-list-value cart-list-price-value">\n {{cartItem.getPrice() | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </div>\n <div class="cart-list-value cart-list-total-value">\n {{cartItem.total() | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </div>\n </div>\n <div class="cart-list-footer">\n <div class="cart-list-summary">\n <div class="cart-empty-summary" *ngIf="images"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-tax-summary">\n {{taxFooterText}}: ({{taxRate | percent:format.digitsInfo:format.locale}})\n {{tax | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </div>\n </div>\n <div class="cart-list-summary">\n <div class="cart-empty-summary" *ngIf="images"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-shipping-summary">\n {{shippingFooterText}}:\n {{shipping | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </div>\n </div>\n <div class="cart-list-summary">\n <div class="cart-empty-summary" *ngIf="images"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-empty-summary"></div>\n <div class="cart-total-summary">\n {{totalFooterText}}:\n {{cost | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-container *ngIf="display === \'table\'">\n <table class="cart-view table-display">\n <thead class="cart-list-header">\n <tr>\n <th class="cart-list-header-value cart-list-image-header" *ngIf="images"></th>\n <th class="cart-list-header-value cart-list-name-header">{{nameHeaderText}}</th>\n <th class="cart-list-header-value cart-list-quantity-header">{{quantityHeaderText}}</th>\n <th class="cart-list-header-value cart-list-price-header">{{priceHeaderText}}</th>\n <th class="cart-list-header-value cart-list-total-header">{{totalHeaderText}}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor="let cartItem of items">\n <td class="cart-list-value cart-list-image-value" *ngIf="images"\n [ngStyle]="{\'background-image\': \'url(\' + cartItem.getImage() + \')\'}">\n </td>\n <td class="cart-list-value cart-list-name-value">{{cartItem.getName()}}</td>\n <td class="cart-list-value cart-list-quantity-value">\n <button type="button" class="cart-increase-button" (click)="increase(cartItem)">\n +\n </button>\n <span class="cart-list-quantity-content">{{cartItem.getQuantity()}}</span>\n <button type="button" class="cart-decrease-button" (click)="decrease(cartItem)">\n -\n </button>\n </td>\n <td class="cart-list-value cart-list-price-value">\n {{cartItem.getPrice() | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </td>\n <td class="cart-list-value cart-list-total-value">\n {{cartItem.total() | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </td>\n </tr>\n </tbody>\n <tfoot class="cart-list-footer">\n <tr class="cart-list-summary">\n <td [attr.colspan]="images ? 4 : 3" class="cart-empty-summary"></td>\n <td class="cart-tax-summary">\n {{taxFooterText}}: ({{taxRate | percent:format.digitsInfo:format.locale}})\n {{tax | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </td>\n </tr>\n <tr class="cart-list-summary">\n <td [attr.colspan]="images ? 4 : 3" class="cart-empty-summary"></td>\n <td class="cart-shipping-summary">\n {{shippingFooterText}}:\n {{shipping | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </td>\n </tr>\n <tr class="cart-list-summary">\n <td [attr.colspan]="images ? 4 : 3" class="cart-empty-summary"></td>\n <td class="cart-total-summary">\n {{totalFooterText}}:\n {{cost | currency:format.currencyCode:format.display:format.digitsInfo:format.locale}}\n </td>\n </tr>\n </tfoot>\n </table>\n </ng-container>\n</ng-container>\n'}]}],d.ctorParameters=function(){return[{type:c}]},d.propDecorators={display:[{type:e.Input}],images:[{type:e.Input}],emptyText:[{type:e.Input}],customEmptyContent:[{type:e.Input}],nameHeaderText:[{type:e.Input}],quantityHeaderText:[{type:e.Input}],priceHeaderText:[{type:e.Input}],totalHeaderText:[{type:e.Input}],taxFooterText:[{type:e.Input}],shippingFooterText:[{type:e.Input}],totalFooterText:[{type:e.Input}],localeFormat:[{type:e.Input}]};var y=function(){return function(){}}();y.decorators=[{type:e.Component,args:[{selector:"cart-showcase-item",template:'<div class="showcase-item default-sc-item" [ngStyle]="{\'background-image\': \'url(\' + item.getImage() + \')\'}">\n <div class="default-sc-description">\n <div class="default-sc-name">\n {{item.getName()}}\n </div>\n <div class="default-sc-price">\n {{item.getPrice() | cartCurrency:format}}\n </div>\n </div>\n</div>\n'}]}],y.ctorParameters=function(){return[]};var g=function(){function t(t){this.cartService=t,this.xsClass="sc-container-xs-12",this.sClass="sc-container-s-6",this.mClass="sc-container-m-4",this.lClass="sc-container-l-4",this.xlClass="sc-container-xl-3",this.ratioClass="sc-ratio-1-1",this.xsCols=1,this.sCols=2,this.mCols=3,this.lCols=3,this.xlCols=4,this.columns=12,this.itemComponent=y,this.aspectRatio="1:1"}return t.prototype.getColumnSize=function(t){return Math.floor(this.columns/t)},t.prototype.ngOnChanges=function(t){for(var e=["xsCols","sCols","mCols","lCols","xlCols"],n=["xs","s","m","l","xl"],r=0;r<e.length;r++){var a=e[r],i=t[a];if(t.columns||i){var o=n[r],s=this.getColumnSize(this[a]);this[o+"Class"]="sc-container-"+o+"-"+s}}if(t.aspectRatio){var c=t.aspectRatio.currentValue.split(":");2===c.length&&(this.ratioClass="sc-ratio-"+c[0]+"-"+c[1])}t.localeFormat&&(this.format=this.localeFormat||this.cartService.getLocaleFormat())},t.prototype.ngOnInit=function(){var t=this;this.format=this.localeFormat||this.cartService.getLocaleFormat(),this._serviceSubscription=this.cartService.onChange.subscribe(function(e){"format"!==e.change||t.localeFormat||(t.format=t.cartService.getLocaleFormat())})},t.prototype.ngOnDestroy=function(){this._serviceSubscription.unsubscribe()},t}();g.decorators=[{type:e.Component,args:[{selector:"cart-showcase",template:'<div class="cart-showcase">\n <div class="sc-item-container" *ngFor="let carItem of items"\n [ngClass]="[xsClass, sClass, mClass, lClass, xlClass, ratioClass]">\n <div class="sc-item-wrapper">\n <ng-container\n *cartShowcaseOutlet="itemComponent;item:carItem;format:format;injector:injector;ngModuleFactory:moduleFactory">\n </ng-container>\n </div>\n </div>\n</div>\n'}]}],g.ctorParameters=function(){return[{type:c}]},g.propDecorators={xsCols:[{type:e.Input}],sCols:[{type:e.Input}],mCols:[{type:e.Input}],lCols:[{type:e.Input}],xlCols:[{type:e.Input}],columns:[{type:e.Input}],items:[{type:e.Input}],itemComponent:[{type:e.Input}],injector:[{type:e.Input}],moduleFactory:[{type:e.Input}],aspectRatio:[{type:e.Input}],localeFormat:[{type:e.Input}]};var f=function(){function t(t){this.viewContainerRef=t,this._componentRef=null,this._moduleRef=null}return t.prototype.cleanModule=function(){this._moduleRef&&this._moduleRef.destroy()},t.prototype.ngOnChanges=function(t){if(1!==Object.keys(t).length||!t.cartShowcaseOutletFormat){if(this.viewContainerRef.clear(),this._componentRef=null,this.cartShowcaseOutlet){var n=this.cartShowcaseOutletInjector||this.viewContainerRef.parentInjector;if(t.cartShowcaseOutletNgModuleFactory)if(this.cleanModule(),this.cartShowcaseOutletNgModuleFactory){var r=n.get(e.NgModuleRef);this._moduleRef=this.cartShowcaseOutletNgModuleFactory.create(r.injector)}else this._moduleRef=null;var a=(this._moduleRef?this._moduleRef.componentFactoryResolver:n.get(e.ComponentFactoryResolver)).resolveComponentFactory(this.cartShowcaseOutlet);this._componentRef=this.viewContainerRef.createComponent(a,this.viewContainerRef.length,n);var i=this._componentRef.instance;i.item=this.cartShowcaseOutletItem,i.format=this.cartShowcaseOutletFormat}}else this._componentRef&&(this._componentRef.instance.format=this.cartShowcaseOutletFormat)},t.prototype.ngOnDestroy=function(){this.cleanModule()},t}();f.decorators=[{type:e.Directive,args:[{selector:"[cartShowcaseOutlet]"}]}],f.ctorParameters=function(){return[{type:e.ViewContainerRef}]},f.propDecorators={cartShowcaseOutlet:[{type:e.Input}],cartShowcaseOutletInjector:[{type:e.Input}],cartShowcaseOutletNgModuleFactory:[{type:e.Input}],cartShowcaseOutletItem:[{type:e.Input}],cartShowcaseOutletFormat:[{type:e.Input}]};var v=new e.InjectionToken("CartItemClass"),I=new e.InjectionToken("CartServiceConfiguration"),C=new e.InjectionToken("CartServiceType"),x=function(t){function e(){var e=t.apply(this,function(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(o(arguments[e]));return t}(arguments))||this;return e._items=[],e._taxRate=0,e._shipping=0,e}return i(e,t),e.prototype._addItem=function(t){var e=this._items.findIndex(function(e){return e.getId()===t.getId()});-1===e?this._items.push(t):this._items[e]=t,this.onItemAdded.emit(t),this.onItemsChanged.emit(this._items.length),this.onChange.emit({change:"items",value:this.getItems()})},e.prototype._removeItem=function(t){var e=this._items.findIndex(function(e){return e.getId()===t});if(-1!==e){var n=this._items.splice(e,1);this.onItemRemoved.emit(n[0]),this.onItemsChanged.emit(this._items.length),this.onChange.emit({change:"items",value:this.getItems()})}},e.prototype.getItem=function(t){return this._items.find(function(e){return e.getId()===t})},e.prototype.getItems=function(){return this._items.slice()},e.prototype.itemCount=function(){return this._items.length},e.prototype.entries=function(){return this._items.reduce(function(t,e){return t+e.getQuantity()},0)},e.prototype.addItem=function(t){this._addItem(t)},e.prototype.removeItem=function(t){this._removeItem(t)},e.prototype.cost=function(){return this._items.reduce(function(t,e){return t+e.getPrice()*e.getQuantity()},0)},e.prototype.clear=function(){this._items=[],this.onItemsChanged.emit(this._items.length),this.onChange.emit({change:"items",value:this.getItems()})},e.prototype.getShipping=function(){return this._shipping},e.prototype.setShipping=function(t){this._shipping=t,this.onShippingChange.emit(this._shipping),this.onChange.emit({change:"shipping",value:this._shipping})},e.prototype.getTaxRate=function(){return this._taxRate},e.prototype.setTaxRate=function(t){this._taxRate=t,this.onTaxChange.emit(this._taxRate),this.onChange.emit({change:"taxRate",value:this._taxRate})},e.prototype.isEmpty=function(){return 0===this._items.length},e}(c);x.decorators=[{type:e.Injectable}],x.ctorParameters=function(){return[]};var S=function(t){function e(e,n){var r=t.call(this)||this;return r.storageKey=n&&n.storageKey?n.storageKey:"NgShoppingCart",r.clearOnError=!n||n.clearOnError===undefined||n.clearOnError,r.itemClass=e,r}return i(e,t),e.prototype.resetStorage=function(t){if(!this.clearOnError&&t){if("string"==typeof t)throw new Error(t);throw t}this.setTaxRate(0),this.setShipping(0),this.clear(),this.save()},e.prototype.save=function(){this.storage.setItem(this.storageKey,JSON.stringify(this.toObject()))},e.prototype.restore=function(){var t=this;if(this.storage.getItem(this.storageKey))try{var e=JSON.parse(this.storage.getItem(this.storageKey));if(!(e.hasOwnProperty("items")&&Array.isArray(e.items)&&e.hasOwnProperty("taxRate")&&e.hasOwnProperty("shipping")))return void this.resetStorage("The object found under the key "+this.storageKey+" is not a valid cart object");this._items=e.items.map(function(e){return t.itemClass.fromJSON?t.itemClass.fromJSON(e):new t.itemClass(e)}),this.setTaxRate(parseFloat(e.taxRate)),this.setShipping(parseFloat(e.shipping))}catch(n){this.resetStorage(n)}else this.resetStorage(!1)},e.prototype.addItem=function(e){t.prototype.addItem.call(this,e),this.save()},e.prototype.removeItem=function(e){t.prototype.removeItem.call(this,e),this.save()},e.prototype.clear=function(){t.prototype.clear.call(this),this.save()},e.prototype.setShipping=function(e){t.prototype.setShipping.call(this,e),this.save()},e.prototype.setTaxRate=function(e){t.prototype.setTaxRate.call(this,e),this.save()},e}(x);S.ctorParameters=function(){return[{type:u,decorators:[{type:e.Inject,args:[v]}]},{type:undefined,decorators:[{type:e.Inject,args:[I]}]}]};var b=function(t){function e(e,n){var r=t.call(this,e,n)||this;return r.storage=window.localStorage,r.restore(),r}return i(e,t),e}(S);b.decorators=[{type:e.Injectable}],b.ctorParameters=function(){return[{type:undefined,decorators:[{type:e.Inject,args:[v]}]},{type:undefined,decorators:[{type:e.Inject,args:[I]}]}]};var w=function(t){function e(e,n){var r=t.call(this,e,n)||this;return r.storage=window.sessionStorage,r.restore(),r}return i(e,t),e}(S);w.decorators=[{type:e.Injectable}],w.ctorParameters=function(){return[{type:undefined,decorators:[{type:e.Inject,args:[v]}]},{type:undefined,decorators:[{type:e.Inject,args:[I]}]}]};var T=function(t){function e(e){void 0===e&&(e={});var n=t.call(this)||this;return n.id=e.id||0,n.name=e.name||"",n.price=e.price||0,n.image=e.image||"",n.quantity=e.quantity||1,n.data=e.data||{},n}return i(e,t),e.prototype.getId=function(){return this.id},e.prototype.setId=function(t){this.id=t},e.prototype.getName=function(){return this.name},e.prototype.setName=function(t){this.name=t},e.prototype.getPrice=function(){return this.price},e.prototype.setPrice=function(t){this.price=t},e.prototype.getQuantity=function(){return this.quantity},e.prototype.setQuantity=function(t){this.quantity=t},e.prototype.getImage=function(){return this.image},e.prototype.setImage=function(t){this.image=t},e.prototype.getData=function(){return this.data},e.prototype.setData=function(t){this.data=t},e}(u);function _(t,e,n){switch(t){case"localStorage":return new b(e,n);case"sessionStorage":return new w(e,n);default:return new x}}function O(t){return{provide:C,useValue:t||"localStorage"}}function F(t){return{provide:v,useValue:t||T}}function R(t,e){return{provide:I,useValue:"memory"!==t?e||{storageKey:"NgShoppingCart",clearOnError:!0}:null}}var E=function(){function t(t){this._locale=t,this.currencyFormatter=new n.CurrencyPipe(this._locale)}return t.prototype.transform=function(t,e){if(void 0===e&&(e="auto"),!t&&0!==t)return null;var n=s(e),r=n.currencyCode,a=n.display,i=n.digitsInfo,o=n.locale;return this.currencyFormatter.transform(t,r,a,i,o)},t}();E.decorators=[{type:e.Pipe,args:[{name:"cartCurrency"}]}],E.ctorParameters=function(){return[{type:undefined,decorators:[{type:e.Inject,args:[e.LOCALE_ID]}]}]};var P=function(){function t(){}return t.forRoot=function(e){return void 0===e&&(e={}),{ngModule:t,providers:[F(e.itemType),O(e.serviceType),R(e.serviceType,e.serviceOptions),{provide:c,useFactory:_,deps:[C,v,I]}]}},t.forChild=function(){return{ngModule:t}},t}();P.decorators=[{type:e.NgModule,args:[{declarations:[h,p,l,m,g,d,f,y,E],imports:[n.CommonModule,r.HttpClientModule],exports:[h,p,l,m,g,d,y,E,n.CommonModule,r.HttpClientModule],entryComponents:[y]}]}],P.ctorParameters=function(){return[]},t.AddToCartComponent=p,t.CartCheckoutComponent=l,t.CartSummaryComponent=m,t.CartShowcaseComponent=g,t.CartShowcaseItemComponent=y,t.CartViewComponent=d,t.CartCurrencyPipe=E,t.ShoppingCartModule=P,t.CART_ITEM_CLASS=v,t.CART_SERVICE_CONFIGURATION=I,t.CART_SERVICE_TYPE=C,t.CartService=c,t.MemoryCartService=x,t.LocalStorageCartService=b,t.SessionStorageCartService=w,t.CartItem=u,t.BaseCartItem=T,t.parseLocaleFormat=s,t.ɵa=h,t.ɵb=f,t.ɵc=_,t.ɵe=F,t.ɵf=R,t.ɵd=O,t.ɵg=S,Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=ng-shopping-cart.umd.min.js.map