Pass Alpine instance to createStore and createData (#267)

statamic-rad-pack · Dec 12, 2024 · bdf55d3 · bdf55d3
1 parent 7fbd3b3
commit bdf55d3
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 6 deletions.
diff --git a/docs/content/en/frontend/storefront-api.md b/docs/content/en/frontend/storefront-api.md
@@ -139,8 +139,8 @@ import Alpine from 'alpinejs';
 
 window.Alpine = Alpine;
 
-createStore();
-createData();
+createStore(Alpine);
+createData(Alpine);
 
 Alpine.start();
 ```
@@ -152,7 +152,7 @@ To use it:
 
 ```antlers
 {{ $variants = {shopify:variants} }}
-<div x-data='statamic.shopify.product({{ options | to_json }}, {{ variants | to_json }})'>
+<div x-data='shopifyProduct({{ options | to_json }}, {{ variants | to_json }})'>
 
 	<form @submit.prevent="handleSubmit($event.target)">
         <input type="hidden" name="product_id" id="ss-product-id" value="{{ product_id }}" />

diff --git a/resources/js/shopify/alpine.js b/resources/js/shopify/alpine.js
@@ -1,7 +1,6 @@
 import { addLines, getOrCreateCart, removeLine, setCartAttributes, setCartNote, updateLineQuantity } from './cart';
-import Alpine from 'alpinejs';
 
-const createStore = () => {
+const createStore = (Alpine) => {
     Alpine.store('statamic.shopify.cart', {
         cartId: null,
         checkoutUrl: '',
@@ -76,7 +75,7 @@ const createStore = () => {
     });
 }
 
-const createData = () => {
+const createData = (Alpine) => {
     Alpine.data('shopifyProduct', (options, variants) => ({
         added: false,
         customAttributes: {},