{"version":3,"names":["scCartHeaderCss","wp","i18n","__","h","class","size","_a","this","getItemsCount","call"],"sources":["./src/components/controllers/cart/cart-header/sc-cart-header.scss?tag=sc-cart-header&encapsulation=shadow","./src/components/controllers/cart/cart-header/sc-cart-header.tsx"],"sourcesContent":[".cart-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n font-size: 1em;\n}\n\n.cart-title {\n text-align: center;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n padding: 0 var(--sc-spacing-small);\n}\n\n.cart__close {\n cursor:pointer;\n}\n","import { Component, h, Event, EventEmitter } from '@stencil/core';\nimport { state as checkoutState } from '@store/checkout';\nimport { __ } from '@wordpress/i18n';\n\n@Component({\n tag: 'sc-cart-header',\n styleUrl: 'sc-cart-header.scss',\n shadow: true,\n})\nexport class ScCartHeader {\n @Event() scCloseCart: EventEmitter<void>;\n\n /** Count the number of items in the cart. */\n getItemsCount() {\n const items = checkoutState.checkout?.line_items?.data || [];\n let count = 0;\n items.forEach(item => {\n count = count + item?.quantity;\n });\n return count;\n }\n\n render() {\n return (\n <div class=\"cart-header\">\n <sc-icon\n class=\"cart__close\"\n name=\"arrow-right\"\n onClick={() => this.scCloseCart.emit()}\n onKeyDown={e => {\n if ('Enter' === e?.code || 'Space' === e?.code) {\n this.scCloseCart.emit();\n }\n }}\n tabIndex={0}\n role=\"button\"\n aria-label={__('Close Cart', 'surecart')}\n ></sc-icon>\n <div class=\"cart-title\">\n <slot />\n </div>\n <sc-tag size=\"small\">{this?.getItemsCount?.() || 0}</sc-tag>\n </div>\n );\n }\n}\n"],"mappings":"sRAAA,MAAMA,EAAkB,6P,8lBCoCFC,GAAAC,KAAAC,GAAE,2BAAAC,EAAA,OAAAC,MAAA,cAAAD,EAAA,cAAAA,EAAA,UAAAE,KAAA,WAAAC,EAAAC,OAAA,MAAAA,YAAA,SAAAA,KAAAC,iBAAA,MAAAF,SAAA,SAAAA,EAAAG,KAAAF,QAAA,G"}