JezK

Edit File: sc-product-price-modal.entry.js.map

{"file":"sc-product-price-modal.entry.js","mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,MAAM,sBAAsB,GAAG,gcAAgc,CAAC;AAChe,kCAAe,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;svBCqEI,UAAE;;;k4CA8BL,UAAE;;;;;;;;","names":[],"sources":["src/components/controllers/product/sc-product-price-modal/sc-product-price-modal.scss?tag=sc-product-price-modal&encapsulation=shadow","src/components/controllers/product/sc-product-price-modal/sc-product-price-modal.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\nsc-dialog {\n --body-spacing: var(--sc-spacing-xx-large);\n color: var(--sc-color-gray-600);\n text-decoration: none;\n font-size: 16px;\n}\n\n.dialog {\n &__header {\n display: flex;\n align-items: center;\n gap: var(--sc-spacing-medium);\n }\n\n &__header-text {\n line-height: var(--sc-line-height-dense);\n }\n\n &__image {\n img {\n width: 60px;\n height: 60px;\n display: block;\n }\n }\n\n &__action {\n font-weight: var(--sc-font-weight-bold);\n }\n\n &__product-name {\n font-size: var(--sc-font-size-small);\n }\n}\n","import { Component, Element, h, Prop, State } from '@stencil/core';\nimport { onChange, state } from '@store/product';\nimport { __ } from '@wordpress/i18n';\n\nimport { getProductBuyLink, submitCartForm } from '@store/product/mutations';\nimport { setProduct } from '@store/product/setters';\nimport { getAdditionalErrorMessages, getTopLevelError } from '../../../../functions/error';\nimport { ScNoticeStore } from '../../../../types';\n@Component({\n tag: 'sc-product-price-modal',\n styleUrl: 'sc-product-price-modal.scss',\n shadow: true,\n})\nexport class ScProductPriceModal {\n @Element() el: HTMLScProductBuyButtonElement;\n\n private priceInput: HTMLScPriceInputElement;\n\n /** The button text */\n @Prop() buttonText: string;\n\n /** Whether to add to cart */\n @Prop() addToCart: boolean;\n\n /** The product id */\n @Prop() productId: string;\n\n // Is add to cart enabled.\n @State() error: ScNoticeStore;\n\n async submit() {\n // if add to cart is undefined/false navigate to buy url\n if (!this.addToCart) {\n const checkoutUrl = window?.scData?.pages?.checkout;\n if (!checkoutUrl) return;\n return window.location.assign(getProductBuyLink(this.productId, checkoutUrl));\n }\n\n // submit the cart form.\n try {\n await submitCartForm(this.productId);\n } catch (e) {\n console.error(e);\n this.error = e;\n }\n }\n\n componentWillLoad() {\n // focus on price input when opened.\n onChange(this.productId, () => {\n setTimeout(() => {\n this.priceInput?.triggerFocus();\n }, 50);\n });\n }\n\n render() {\n if (!state[this.productId]?.selectedPrice?.ad_hoc) {\n return null;\n }\n\n return (\n <sc-dialog open={state[this.productId]?.dialog === (this?.addToCart ? 'ad_hoc_cart' : 'ad_hoc_buy')} onScRequestClose={() => setProduct(this.productId, { dialog: null })}>\n <span class=\"dialog__header\" slot=\"label\">\n {!!state[this.productId]?.product?.image_url && (\n <div class=\"dialog__image\">\n <img src={state[this.productId]?.product?.image_url} />\n </div>\n )}\n <div class=\"dialog__header-text\">\n <div class=\"dialog__action\">{__('Enter An Amount', 'surecart')}</div>\n <div class=\"dialog__product-name\">{state[this.productId]?.product?.name}</div>\n </div>\n </span>\n\n <sc-form\n onScSubmit={e => {\n e.stopImmediatePropagation();\n this.submit();\n }}\n onScFormSubmit={e => e.stopImmediatePropagation()}\n >\n {!!this.error && (\n <sc-alert type=\"danger\" scrollOnOpen={true} open={!!this.error} closable={false}>\n {!!getTopLevelError(this.error) && <span slot=\"title\" innerHTML={getTopLevelError(this.error)}></span>}\n {(getAdditionalErrorMessages(this.error) || []).map((message, index) => (\n <div innerHTML={message} key={index}></div>\n ))}\n </sc-alert>\n )}\n <sc-price-input\n ref={el => (this.priceInput = el as HTMLScPriceInputElement)}\n value={state[this.productId]?.adHocAmount?.toString?.()}\n currency-code={state[this.productId]?.selectedPrice?.currency}\n min={state[this.productId]?.selectedPrice?.ad_hoc_min_amount}\n max={state[this.productId]?.selectedPrice?.ad_hoc_max_amount}\n onScInput={e => setProduct(this.productId, { adHocAmount: parseInt(e.target.value) })}\n required\n />\n <sc-button type=\"primary\" full submit busy={state[this.productId]?.busy}>\n <slot>{this.buttonText || __('Add To Cart', 'surecart')}</slot>\n </sc-button>\n </sc-form>\n </sc-dialog>\n );\n }\n}\n"],"version":3}