If your snippets are outdated, you can update them by overwriting them with the versions listed here.

snippets/spiff-button-design-product.liquid

 {% assign product_object = all_products[product_handle] %}
   <style>
     .spiff-spinner-outer {
       animation: rotator 1s linear infinite;
     }
     .spiff-spinner-inner {
       stroke-dasharray: 45 180;
     }
     @keyframes rotator {
       0% { transform: rotate(0deg); }
       100% { transform: rotate(360deg); }
     }
   </style>
   <script>
     var openDisplayProductWorkflowForProduct{{product_object.id}};
     var pageSessionId;
     window.addEventListener('SpiffApiReady', function() {
       const product = new window.Spiff.Product({
           integrationId: '{{shop.permanent_domain}}',
           productId: '{{product_object.id}}'
       });
       const hideElements = () => {
           const elements = document.querySelectorAll('[data-spiff-hide]');
           elements.forEach(el => {
               const externalProductId = el.getAttribute('data-product-id');
               if (externalProductId === '{{product_object.id}}') {
                   el.style.display = 'none';
               }
           });
       }
       product.on('ready', () => {
             hideElements();
             const buttons = document.querySelectorAll('.spiff-api-button[data-product-id="{{product_object.id}}"]');
             if (pageSessionId === undefined) {
                pageSessionId = window.Spiff.Analytics.createPageSession();
             }
             for (button of buttons) {
                 button.style.display = 'block';
             }
       });
       product.confirmActive();
       openDisplayProductWorkflowForProduct{{product_object.id}} = (event) => {
           event.target.disabled = true;
           event.preventDefault();
           event.stopPropagation();

           const spinnerSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
           spinnerSvg.setAttribute('class', 'spiff-spinner-outer');
           spinnerSvg.setAttribute('height', event.target.clientHeight);
           spinnerSvg.setAttribute('width', event.target.clientHeight);
           spinnerSvg.setAttribute('viewBox', '0 0 66 66');
           const spinnerCircle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
           spinnerCircle.setAttribute('class', 'spiff-spinner-inner');
           spinnerCircle.setAttribute('cx', 33);
           spinnerCircle.setAttribute('cy', 33);
           spinnerCircle.setAttribute('fill', 'none');
           spinnerCircle.setAttribute('r', 30);
           spinnerCircle.setAttribute('stroke', 'black');
           spinnerCircle.setAttribute('stroke-width', 6);
           spinnerSvg.appendChild(spinnerCircle);
           event.target.appendChild(spinnerSvg);

           const transactionOptions = {
               presentmentCurrency: '{{cart.currency.iso_code}}',
               product: product,
               shouldCreateDesignProduct: true,
               pageSessionId
           };
           const transaction = new window.Spiff.Transaction(transactionOptions);
           transaction.on('quit', () => {
               event.target.removeChild(spinnerSvg);
               event.target.disabled = false;
               console.log("The user exited before completing their design");
           });
           transaction.on('complete', async (result) => {
             const lineItemProperties = {
                 spiffTransactionId: result.transactionId,
                 previewImage: result.previewImage
             };
             const keys = Object.keys(result.exportedData);
             for (const key of keys) {
                 lineItemProperties[key] = result.exportedData[key].value;
             }
             const addToCartRequestBody = JSON.stringify({
               quantity: 1,
               id: result.designProductVariantId,
               properties: lineItemProperties
             });
             await fetch('/cart/add.js', {
               method: 'POST',
               body: addToCartRequestBody,
               headers: { 'Content-Type': 'application/json' }
             });
             event.target.removeChild(spinnerSvg);
             event.target.disabled = false;
             {% if redirect_to_cart %}window.top.location.href = '/cart';{% endif %}
           });
           transaction.execute();
       };
     });
   </script>
 <button
     class='spiff-api-button'
     data-product-id='{{product_object.id}}'
     onclick="openDisplayProductWorkflowForProduct{{product_object.id}}(event)"
     style="
            display:none;
            color:{% if label_colour %}
              {{label_colour}}
            {% else %}
              #FFFFFF
            {% endif %};
            background-color:{% if background_colour %}
              {{background_colour}}
            {% else %}
              rgb(214, 27, 92)
            {% endif %};
            {% if height %}height:{{height}};{% endif %}
            {% if width %}width:{{width}};{% endif %}
            "
 >{% if label_text %}{{label_text}}{% else %}Customise now on #spiff{% endif %}</button>

snippets/spiff-button-standard.liquid

{% assign product_object = all_products[product_handle] %}
   <style>
     .spiff-spinner-outer {
       animation: rotator 1s linear infinite;
     }
     .spiff-spinner-inner {
       stroke-dasharray: 45 180;
     }
     @keyframes rotator {
       0% { transform: rotate(0deg); }
       100% { transform: rotate(360deg); }
     }
   </style>
   <script>
     var pageSessionId;
     var openStandardWorkflowForProduct{{product_object.id}};
     window.addEventListener('SpiffApiReady', function() {
       const product = new window.Spiff.Product({
           integrationId: '{{shop.permanent_domain}}',
           productId: '{{product_object.id}}'
       });
       const hideElements = () => {
           const elements = document.querySelectorAll('[data-spiff-hide]');
           elements.forEach(el => {
               const externalProductId = el.getAttribute('data-product-id');
               if (externalProductId === '{{product_object.id}}') {
                   el.style.display = 'none';
               }
           });
       }
       product.on('ready', () => {
             hideElements();
            if (pageSessionId === undefined) {
                pageSessionId = window.Spiff.Analytics.createPageSession();
             }
             const buttons = document.querySelectorAll('.spiff-api-button[data-product-id="{{product_object.id}}"]');
             for (button of buttons) {
                 button.style.display = 'block';
             }
       });
       product.confirmActive();
       openStandardWorkflowForProduct{{product_object.id}} = (event) => {
           event.target.disabled = true;
           event.preventDefault();
           event.stopPropagation();

           const spinnerSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
           spinnerSvg.setAttribute('class', 'spiff-spinner-outer');
           spinnerSvg.setAttribute('height', event.target.clientHeight);
           spinnerSvg.setAttribute('width', event.target.clientHeight);
           spinnerSvg.setAttribute('viewBox', '0 0 66 66');
           const spinnerCircle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
           spinnerCircle.setAttribute('class', 'spiff-spinner-inner');
           spinnerCircle.setAttribute('cx', 33);
           spinnerCircle.setAttribute('cy', 33);
           spinnerCircle.setAttribute('fill', 'none');
           spinnerCircle.setAttribute('r', 30);
           spinnerCircle.setAttribute('stroke', 'black');
           spinnerCircle.setAttribute('stroke-width', 6);
           spinnerSvg.appendChild(spinnerCircle);
           event.target.appendChild(spinnerSvg);

           const transactionOptions = {
               presentmentCurrency: '{{cart.currency.iso_code}}',
               product: product,
               shouldCreateDesignProduct: false,
               pageSessionId
           };
           const transaction = new window.Spiff.Transaction(transactionOptions);
           transaction.on('quit', () => {
               event.target.removeChild(spinnerSvg);
               event.target.disabled = false;
               console.log("The user exited before completing their design");
           });
           transaction.on('complete', async (result) => {
             const lineItemProperties = {
                 spiffTransactionId: result.transactionId,
                 previewImage: result.previewImage
             };
             const keys = Object.keys(result.exportedData);
             for (const key of keys) {
                 lineItemProperties[key] = result.exportedData[key].value;
             }
             const firstVariantId = '{{product_object.variants[0].id}}';
             const addToCartRequestBody = JSON.stringify({
               quantity: 1,
               id: firstVariantId,
               properties: lineItemProperties
             });
             await fetch('/cart/add.js', {
               method: 'POST',
               body: addToCartRequestBody,
               headers: { 'Content-Type': 'application/json' }
             });
             event.target.removeChild(spinnerSvg);
             event.target.disabled = false;
             {% if redirect_to_cart %}window.top.location.href = '/cart';{% endif %}
           });
           transaction.execute();
       };
     });
   </script>
 <button
     class='spiff-api-button'
     data-product-id='{{product_object.id}}'
     onclick="openStandardWorkflowForProduct{{product_object.id}}(event)"
     style="
            display:none;
            color:{% if label_colour %}
              {{label_colour}}
            {% else %}
              #FFFFFF
            {% endif %};
            background-color:{% if background_colour %}
              {{background_colour}}
            {% else %}
              rgb(214, 27, 92)
            {% endif %};
            {% if height %}height:{{height}};{% endif %}
            {% if width %}width:{{width}};{% endif %}
            "
 >{% if label_text %}{{label_text}}{% else %}Customise now on #spiff{% endif %}</button>

snippets/spiff-line-item-image.liquid

                    {% for property in line_item.properties %}
                        {% if property.first == "spiffTransactionId" %}
                            <span class='spiff-line-item-image-container' data-spiff-transaction-id="{{ property.last }}">
                            </span>
                            {% assign hasTransactionId = true %}
                        {% endif %}
                        {% if property.first == "previewImage" %}
                            <img src="{{ property.last }}" alt="{{ line_item.title }}" />
                        {% endif %}
                    {% endfor %}
                    {% unless hasTransactionId %}
                        <img class="cart__image{% if line_item.image == null %} hide{% endif %}" src="{{ line_item | img_url: 'x190' }}" alt="{{ line_item.image.alt | escape }}" data-cart-item-image>
                    {% endunless %}