JezK
Edit File: sc-cart-session-provider_3.cjs.entry.js
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); const index = require('./index-be4abba1.js'); const mutations$1 = require('./mutations-98f05402.js'); const index$1 = require('./index-c2d0eb49.js'); const mutations$2 = require('./mutations-d5d6ddf1.js'); const mutations = require('./mutations-627c79a0.js'); const animationRegistry = require('./animation-registry-b597d2f4.js'); const getters = require('./getters-68a0d178.js'); require('./index-c3de642f.js'); require('./utils-a9d13080.js'); require('./remove-query-args-b57e8cd3.js'); require('./add-query-args-49dcb630.js'); require('./index-fb76df07.js'); require('./google-8dbad1a6.js'); require('./currency-71fce0f0.js'); require('./store-01e8edc2.js'); require('./price-da3cab3d.js'); require('./fetch-5e8dc1d5.js'); require('./index-7ced8198.js'); const ScCartSessionProvider = class { constructor(hostRef) { index.registerInstance(this, hostRef); this.scSetState = index.createEvent(this, "scSetState", 7); } handleUpdateSession(e) { const { data, options } = e.detail; if (options === null || options === void 0 ? void 0 : options.silent) { this.update(data); } else { this.loadUpdate(data); } } /** Handle the error response. */ handleErrorResponse(e) { var _a, _b; if ((e === null || e === void 0 ? void 0 : e.code) === 'readonly' || ((_b = (_a = e === null || e === void 0 ? void 0 : e.additional_errors) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.code) === 'checkout.customer.account_mismatch') { mutations.clearCheckout(); } // expired if ((e === null || e === void 0 ? void 0 : e.code) === 'rest_cookie_invalid_nonce') { mutations$1.updateFormState('EXPIRE'); return; } // something went wrong if (e === null || e === void 0 ? void 0 : e.message) { mutations$2.createErrorNotice(e); } // handle curl timeout errors. if ((e === null || e === void 0 ? void 0 : e.code) === 'http_request_failed') { mutations$2.createErrorNotice(wp.i18n.__('Something went wrong. Please reload the page and try again.', 'surecart')); } } /** Fetch a session. */ async fetch(args = {}) { this.loadUpdate({ status: 'draft', ...args }); } /** Update a the order */ async update(data = {}, query = {}) { var _a; try { mutations$1.state.checkout = (await index$1.updateCheckout({ id: (_a = mutations$1.state.checkout) === null || _a === void 0 ? void 0 : _a.id, data: { ...data, }, query: { ...query, }, })); } catch (e) { console.error(e); throw e; } } /** Updates a session with loading status changes. */ async loadUpdate(data = {}) { try { mutations$1.updateFormState('FETCH'); await this.update(data); mutations$1.updateFormState('RESOLVE'); } catch (e) { mutations$1.updateFormState('REJECT'); this.handleErrorResponse(e); } } render() { return (index.h("sc-line-items-provider", { key: '4f389805680c0bba62eb5a90cc326aaad4e2fc31', order: mutations$1.state.checkout, onScUpdateLineItems: e => this.loadUpdate({ line_items: e.detail }) }, index.h("slot", { key: '45559f39cf7a79348a0fa5b89dd567ecb368b4d6' }))); } get el() { return index.getElement(this); } }; const scDrawerCss = ":host {\n display: contents;\n}\n.drawer {\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n overflow: hidden;\n font-family: var(--sc-font-sans);\n font-weight: var(--sc-font-weight-normal);\n}\n.drawer--contained {\n position: absolute;\n z-index: initial;\n}\n.drawer--fixed {\n position: fixed;\n z-index: var(--sc-z-index-drawer);\n}\n.drawer__panel {\n position: absolute;\n display: flex;\n flex-direction: column;\n z-index: 2;\n max-width: 100%;\n max-height: 100%;\n background-color: var(--sc-panel-background-color);\n box-shadow: var(--sc-shadow-x-large);\n transition: var(--sc-transition-medium) transform;\n overflow: auto;\n pointer-events: all;\n}\n.drawer__panel:focus {\n outline: none;\n}\n.drawer--top .drawer__panel {\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n width: 100%;\n height: var(--sc-drawer-size, 400px);\n}\n.drawer--end .drawer__panel {\n top: 0;\n inset-inline-end: 0;\n bottom: auto;\n inset-inline-start: auto;\n width: 100%;\n max-width: var(--sc-drawer-size, 400px);\n height: 100%;\n}\n.drawer--bottom .drawer__panel {\n top: auto;\n right: auto;\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--sc-drawer-size, 400px);\n}\n.drawer--start .drawer__panel {\n top: 0;\n inset-inline-end: auto;\n bottom: auto;\n inset-inline-start: 0;\n width: var(--sc-drawer-size, 400px);\n height: 100%;\n}\n.header__sticky {\n position: sticky;\n top: 0;\n z-index: 10;\n background: #fff;\n}\n.drawer__header {\n display: flex;\n align-items: center;\n padding: var(--sc-drawer-header-spacing);\n border-bottom: var(--sc-drawer-border);\n}\n\n.drawer__title {\n flex: 1 1 auto;\n font: inherit;\n font-size: var(--sc-font-size-large);\n line-height: var(--sc-line-height-dense);\n margin: 0;\n}\n.drawer__close {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n font-size: var(--sc-font-size-x-large);\n color: var(--sc-color-gray-500);\n cursor: pointer;\n}\n.drawer__body {\n flex: 1 1 auto;\n}\n\n.drawer--has-footer .drawer__footer {\n border-top: var(--sc-drawer-border);\n padding: var(--sc-drawer-footer-spacing);\n\n &.is-sticky {\n position: sticky;\n bottom: 0;\n background: #fff;\n }\n}\n\n.drawer__overlay {\n display: block;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: var(--sc-overlay-background-color);\n pointer-events: all;\n}\n.drawer--contained .drawer__overlay {\n position: absolute;\n}\n"; const ScDrawerStyle0 = scDrawerCss; const ScDrawer = class { constructor(hostRef) { index.registerInstance(this, hostRef); this.scInitialFocus = index.createEvent(this, "scInitialFocus", 7); this.scRequestClose = index.createEvent(this, "scRequestClose", 7); this.scShow = index.createEvent(this, "scShow", 7); this.scHide = index.createEvent(this, "scHide", 7); this.scAfterShow = index.createEvent(this, "scAfterShow", 7); this.scAfterHide = index.createEvent(this, "scAfterHide", 7); this.open = false; this.label = ''; this.placement = 'end'; this.contained = false; this.noHeader = false; this.stickyHeader = false; this.stickyFooter = false; } componentDidLoad() { this.drawer.hidden = !this.open; if (this.open && !this.contained) { this.lockBodyScrolling(); } this.handleOpenChange(); } disconnectedCallback() { this.unLockBodyScrolling(); } lockBodyScrolling() { document.body.classList.add('sc-scroll-lock'); } unLockBodyScrolling() { document.body.classList.remove('sc-scroll-lock'); } /** Shows the drawer. */ async show() { if (this.open) { return undefined; } this.open = true; } /** Hides the drawer */ async hide() { if (!this.open) { return undefined; } this.open = false; } getDirection() { return getComputedStyle(this.el).direction === 'rtl' ? 'rtl' : 'ltr'; } async requestClose(source = 'method') { const slRequestClose = this.scRequestClose.emit(source); if (slRequestClose.defaultPrevented) { const animation = animationRegistry.getAnimation(this.el, 'drawer.denyClose', { dir: this.getDirection() }); animationRegistry.animateTo(this.panel, animation.keyframes, animation.options); return; } this.hide(); } handleKeyDown(event) { if (event.key === 'Escape') { event.stopPropagation(); this.requestClose('keyboard'); } } async handleOpenChange() { if (this.open) { this.scShow.emit(); this.originalTrigger = document.activeElement; // Lock body scrolling only if the drawer isn't contained if (!this.contained) { this.lockBodyScrolling(); } // When the drawer is shown, Safari will attempt to set focus on whatever element has autofocus. This causes the // drawer's animation to jitter, so we'll temporarily remove the attribute, call `focus({ preventScroll: true })` // ourselves, and add the attribute back afterwards. // // Related: https://github.com/shoelace-style/shoelace/issues/693 // const autoFocusTarget = this.el.querySelector('[autofocus]'); if (autoFocusTarget) { autoFocusTarget.removeAttribute('autofocus'); } await Promise.all([animationRegistry.stopAnimations(this.drawer), animationRegistry.stopAnimations(this.overlay)]); this.drawer.hidden = false; // Set initial focus requestAnimationFrame(() => { const slInitialFocus = this.scInitialFocus.emit(); if (!slInitialFocus.defaultPrevented) { // Set focus to the autofocus target and restore the attribute if (autoFocusTarget) { autoFocusTarget.focus({ preventScroll: true }); } else { this.panel.focus({ preventScroll: true }); } } // Restore the autofocus attribute if (autoFocusTarget) { autoFocusTarget.setAttribute('autofocus', ''); } }); const dir = this.getDirection(); const panelAnimation = animationRegistry.getAnimation(this.el, `drawer.show${this.placement.charAt(0).toUpperCase() + this.placement.slice(1)}`, { dir }); const overlayAnimation = animationRegistry.getAnimation(this.el, 'drawer.overlay.show', { dir }); await Promise.all([animationRegistry.animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options), animationRegistry.animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options)]); this.scAfterShow.emit(); } else { // Hide this.scHide.emit(); this.unLockBodyScrolling(); await Promise.all([animationRegistry.stopAnimations(this.drawer), animationRegistry.stopAnimations(this.overlay)]); const dir = this.getDirection(); const panelAnimation = animationRegistry.getAnimation(this.el, `drawer.hide${this.placement.charAt(0).toUpperCase() + this.placement.slice(1)}`, { dir }); const overlayAnimation = animationRegistry.getAnimation(this.el, 'drawer.overlay.hide', { dir }); await Promise.all([animationRegistry.animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options), animationRegistry.animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options)]); this.drawer.hidden = true; // Restore focus to the original trigger const trigger = this.originalTrigger; if (typeof (trigger === null || trigger === void 0 ? void 0 : trigger.focus) === 'function') { setTimeout(() => trigger.focus()); } this.scAfterHide.emit(); } } render() { return (index.h("div", { key: '780ee1379d8c5544673b1ceb0b4b680e3164e032', part: "base", class: { 'drawer': true, 'drawer--open': this.open, 'drawer--top': this.placement === 'top', 'drawer--end': this.placement === 'end', 'drawer--bottom': this.placement === 'bottom', 'drawer--start': this.placement === 'start', 'drawer--contained': this.contained, 'drawer--fixed': !this.contained, 'drawer--has-footer': this.el.querySelector('[slot="footer"]') !== null, }, ref: el => (this.drawer = el), onKeyDown: (e) => this.handleKeyDown(e) }, index.h("div", { key: '37e451e88c3f852898e35e643636c3a57d5580c3', part: "overlay", class: "drawer__overlay", onClick: () => this.requestClose('overlay'), tabindex: "-1", ref: el => (this.overlay = el) }), index.h("div", { key: '6891cc43d79fccf48ece953a846884b67b43d7de', part: "panel", class: "drawer__panel", role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? 'false' : 'true', "aria-label": this.noHeader ? this.label : undefined, "aria-labelledby": !this.noHeader ? 'title' : undefined, tabindex: "0", ref: el => (this.panel = el) }, !this.noHeader && (index.h("header", { key: 'e88aebab0a41d3718b81505513529087b236cc60', part: "header", class: this.stickyHeader ? 'header__sticky' : '' }, index.h("slot", { key: '6f3ac20a27d7cbeb9aa0ee9b334065a004959a5d', name: "header" }, index.h("div", { key: '08f3602305519b53ef8897d0ff6be9b59766a90b', class: "drawer__header" }, index.h("h2", { key: '7a8b4b29bf6f15d229465f2aa68602cd8c261b9f', part: "title", class: "drawer__title", id: "title" }, index.h("slot", { key: '898abde5f12380d03c145af61a0d041f7286dc03', name: "label" }, this.label.length > 0 ? this.label : ' ', " ")), index.h("sc-icon", { key: '51f403579b8a6afac1173313dc5cc4f2104f32e4', part: "close-button", exportparts: "base:close-button__base", class: "drawer__close", name: "x", label: /** translators: Close this modal window. */ wp.i18n.__('Close', 'surecart'), onClick: () => this.requestClose('close-button') }))))), index.h("footer", { key: 'd681a8d1a8652062c45ad0b285da0af95de15d8d', part: "header-suffix", class: "drawer__header-suffix" }, index.h("slot", { key: '0ae6c3129238b1c89a7fa920fde5bf93f75e08d3', name: "header-suffix" })), index.h("div", { key: '0c86dac4bf3ad211541fa4a1d1611a38ccb2a538', part: "body", class: "drawer__body" }, index.h("slot", { key: 'c87fb8253579e77244643633b9128946b563f175' })), index.h("footer", { key: '706560ac939f2b815b981f55844e1dda52eb7049', part: "footer", class: this.stickyFooter ? 'drawer__footer is-sticky' : 'drawer__footer' }, index.h("slot", { key: 'a4bb85fea755de3ecbbeabff5d310835e9e4d705', name: "footer" }))))); } get el() { return index.getElement(this); } static get watchers() { return { "open": ["handleOpenChange"] }; } }; // Top animationRegistry.setDefaultAnimation('drawer.showTop', { keyframes: [ { opacity: 0, transform: 'translateY(-100%)' }, { opacity: 1, transform: 'translateY(0)' }, ], options: { duration: 250, easing: 'ease' }, }); animationRegistry.setDefaultAnimation('drawer.hideTop', { keyframes: [ { opacity: 1, transform: 'translateY(0)' }, { opacity: 0, transform: 'translateY(-100%)' }, ], options: { duration: 250, easing: 'ease' }, }); // End — in LTR the panel rests on the right and slides in from the right (translateX 100%). In RTL the panel rests on // the left (because `inset-inline-end` flips), so it must slide in from the left (translateX -100%). animationRegistry.setDefaultAnimation('drawer.showEnd', { keyframes: [ { opacity: 0, transform: 'translateX(100%)' }, { opacity: 1, transform: 'translateX(0)' }, ], rtlKeyframes: [ { opacity: 0, transform: 'translateX(-100%)' }, { opacity: 1, transform: 'translateX(0)' }, ], options: { duration: 250, easing: 'ease' }, }); animationRegistry.setDefaultAnimation('drawer.hideEnd', { keyframes: [ { opacity: 1, transform: 'translateX(0)' }, { opacity: 0, transform: 'translateX(100%)' }, ], rtlKeyframes: [ { opacity: 1, transform: 'translateX(0)' }, { opacity: 0, transform: 'translateX(-100%)' }, ], options: { duration: 250, easing: 'ease' }, }); // Bottom animationRegistry.setDefaultAnimation('drawer.showBottom', { keyframes: [ { opacity: 0, transform: 'translateY(100%)' }, { opacity: 1, transform: 'translateY(0)' }, ], options: { duration: 250, easing: 'ease' }, }); animationRegistry.setDefaultAnimation('drawer.hideBottom', { keyframes: [ { opacity: 1, transform: 'translateY(0)' }, { opacity: 0, transform: 'translateY(100%)' }, ], options: { duration: 250, easing: 'ease' }, }); // Start — mirrors End. In LTR slides in from the left; in RTL the panel rests on the right (because `inset-inline-start` // flips), so it must slide in from the right. animationRegistry.setDefaultAnimation('drawer.showStart', { keyframes: [ { opacity: 0, transform: 'translateX(-100%)' }, { opacity: 1, transform: 'translateX(0)' }, ], rtlKeyframes: [ { opacity: 0, transform: 'translateX(100%)' }, { opacity: 1, transform: 'translateX(0)' }, ], options: { duration: 250, easing: 'ease' }, }); animationRegistry.setDefaultAnimation('drawer.hideStart', { keyframes: [ { opacity: 1, transform: 'translateX(0)' }, { opacity: 0, transform: 'translateX(-100%)' }, ], rtlKeyframes: [ { opacity: 1, transform: 'translateX(0)' }, { opacity: 0, transform: 'translateX(100%)' }, ], options: { duration: 250, easing: 'ease' }, }); // Deny close animationRegistry.setDefaultAnimation('drawer.denyClose', { keyframes: [{ transform: 'scale(1)' }, { transform: 'scale(1.01)' }, { transform: 'scale(1)' }], options: { duration: 250 }, }); // Overlay animationRegistry.setDefaultAnimation('drawer.overlay.show', { keyframes: [{ opacity: 0 }, { opacity: 1 }], options: { duration: 250, easing: 'ease' }, }); animationRegistry.setDefaultAnimation('drawer.overlay.hide', { keyframes: [{ opacity: 1 }, { opacity: 0 }], options: { duration: 250, easing: 'ease' }, }); ScDrawer.style = ScDrawerStyle0; const ScFormErrorProvider = class { constructor(hostRef) { index.registerInstance(this, hostRef); this.scUpdateError = index.createEvent(this, "scUpdateError", 7); this.error = undefined; } /** Trigger the error event when an error happens */ handleErrorUpdate(val) { this.scUpdateError.emit(val); } render() { return !!(mutations$2.state === null || mutations$2.state === void 0 ? void 0 : mutations$2.state.message) ? (index.h("sc-alert", { exportparts: "base, icon, text, title, message, close", type: "danger", scrollOnOpen: true, open: !!(mutations$2.state === null || mutations$2.state === void 0 ? void 0 : mutations$2.state.message), closable: !!(mutations$2.state === null || mutations$2.state === void 0 ? void 0 : mutations$2.state.dismissible) }, (mutations$2.state === null || mutations$2.state === void 0 ? void 0 : mutations$2.state.message) && index.h("span", { slot: "title", innerHTML: mutations$2.state.message }), (getters.getAdditionalErrorMessages() || []).map((message, index$1) => (index.h("div", { innerHTML: message, key: index$1 }))))) : null; } static get watchers() { return { "error": ["handleErrorUpdate"] }; } }; exports.sc_cart_session_provider = ScCartSessionProvider; exports.sc_drawer = ScDrawer; exports.sc_error = ScFormErrorProvider; //# sourceMappingURL=sc-cart-session-provider_3.cjs.entry.js.map