@ribajs/shopify
Version:
Shopify extension for Riba.js
143 lines • 10.8 kB
JavaScript
import { Component } from "@ribajs/core";
import { ShopifyCartService } from "../../services/index.js";
import { getInputValue, hasChildNodesTrim } from "@ribajs/utils/src/dom.js";
export class ShopifyCartComponent extends Component {
static tagName = "shopify-cart";
static get observedAttributes() {
return ["shipping-address", "estimate-shipping-rate"];
}
requiredAttributes() {
return [];
}
scope = this.getScopeDefaults();
getScopeDefaults() {
return {
cart: ShopifyCartService.cart,
shippingAddress: null,
estimateShippingRate: false,
shippingRates: [],
removeItem: this.removeItem,
increaseItem: this.increaseItem,
decreaseItem: this.decreaseItem,
getItem: this.getItem,
onItemQuantityChanged: this.onItemQuantityChanged,
pending: false,
};
}
set cart(cart) {
this.scope.cart = cart;
if (this.scope.shippingAddress && this.scope.estimateShippingRate) {
ShopifyCartService.getShippingRates(this.scope.shippingAddress, true, {
triggerOnChange: false,
triggerOnComplete: false,
triggerOnStart: false,
}).then((shippingRates) => {
this.scope.shippingRates =
shippingRates;
});
}
}
get cart() {
return this.scope.cart || null;
}
constructor() {
super();
}
connectedCallback() {
super.connectedCallback();
this.init(ShopifyCartComponent.observedAttributes);
}
removeItem(lineItem) {
ShopifyCartService.change(lineItem.variant_id, 0)
.then((cart) => {
return cart;
})
.catch((error) => {
console.error(error);
});
}
increaseItem(lineItem) {
lineItem.quantity++;
ShopifyCartService.change(lineItem.variant_id, lineItem.quantity)
.then((cart) => {
return cart;
})
.catch((error) => {
console.error(error);
});
}
decreaseItem(lineItem) {
lineItem.quantity--;
if (lineItem.quantity < 0) {
lineItem.quantity = 0;
}
ShopifyCartService.change(lineItem.variant_id, lineItem.quantity)
.then((cart) => {
return cart;
})
.catch((error) => {
console.error(error);
});
}
onItemQuantityChanged(lineItem, event, scope, htmlEl) {
if (!htmlEl) {
console.warn("Input element not found");
return;
}
const newValue = Number(getInputValue(htmlEl));
if (newValue === lineItem.quantity) {
return;
}
lineItem.quantity = newValue;
ShopifyCartService.change(lineItem.variant_id, lineItem.quantity)
.then((cart) => {
this.debug("ShopifyCartService changed", cart);
return cart;
})
.catch((error) => {
console.error(error);
});
}
getItem(id) {
id = Number(id);
const item = this.scope.cart?.items.find((item) => Number(item.id) === id) || null;
this.debug("getItem", id, item, this.scope.cart?.items);
return item;
}
onCartRequestStart() {
this.scope.pending = true;
}
onCartRequestComplete(cart) {
if (cart) {
this.cart = cart;
}
this.scope.pending = false;
}
async beforeBind() {
await super.beforeBind();
ShopifyCartService.shopifyCartEventDispatcher.on("ShopifyCart:request:start", this.onCartRequestStart, this);
ShopifyCartService.shopifyCartEventDispatcher.on("ShopifyCart:request:complete", this.onCartRequestComplete, this);
}
disconnectedCallback() {
super.disconnectedCallback();
ShopifyCartService.shopifyCartEventDispatcher.off("ShopifyCart:request:start", this.onCartRequestStart, this);
ShopifyCartService.shopifyCartEventDispatcher.off("ShopifyCart:request:complete", this.onCartRequestComplete, this);
}
async afterBind() {
this.debug("afterBind", this.scope);
if (!this.cart) {
this.cart = await ShopifyCartService.get();
}
await super.afterBind();
}
async template() {
if (hasChildNodesTrim(this)) {
return null;
}
else {
const { default: template } = await import("./cart.component.html?raw");
return template;
}
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FydC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9jYXJ0L2NhcnQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWEsTUFBTSxjQUFjLENBQUM7QUFRcEQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDN0QsT0FBTyxFQUFFLGFBQWEsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBZTVFLE1BQU0sT0FBTyxvQkFBcUIsU0FBUSxTQUFTO0lBQzFDLE1BQU0sQ0FBQyxPQUFPLEdBQUcsY0FBYyxDQUFDO0lBRXZDLE1BQU0sS0FBSyxrQkFBa0I7UUFDM0IsT0FBTyxDQUFDLGtCQUFrQixFQUFFLHdCQUF3QixDQUFDLENBQUM7SUFDeEQsQ0FBQztJQUVTLGtCQUFrQjtRQUMxQixPQUFPLEVBQUUsQ0FBQztJQUNaLENBQUM7SUFFTSxLQUFLLEdBQVUsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7SUFFcEMsZ0JBQWdCO1FBQ3hCLE9BQU87WUFDTCxJQUFJLEVBQUUsa0JBQWtCLENBQUMsSUFBSTtZQUM3QixlQUFlLEVBQUUsSUFBSTtZQUNyQixvQkFBb0IsRUFBRSxLQUFLO1lBQzNCLGFBQWEsRUFBRSxFQUFFO1lBQ2pCLFVBQVUsRUFBRSxJQUFJLENBQUMsVUFBVTtZQUMzQixZQUFZLEVBQUUsSUFBSSxDQUFDLFlBQVk7WUFDL0IsWUFBWSxFQUFFLElBQUksQ0FBQyxZQUFZO1lBQy9CLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTztZQUNyQixxQkFBcUIsRUFBRSxJQUFJLENBQUMscUJBQXFCO1lBQ2pELE9BQU8sRUFBRSxLQUFLO1NBQ2YsQ0FBQztJQUNKLENBQUM7SUFFRCxJQUFjLElBQUksQ0FBQyxJQUE4QjtRQUUvQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxJQUFJ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