checkout process - start

resources/js/checkout/bbk-checkout-form-controller.js

@@ -0,0 +1,46 @@
+import { Controller } from '@hotwired/stimulus'
+
+// Static, client-only interactivity for the checkout page's address form — no
+// fetch, no cart mutation, just show/hide. Nothing here talks to the server;
+// CheckoutController::saveAddress() is what actually persists anything.
+export default class extends Controller {
+    static targets = [
+        'guestTab', 'loginTab', 'guestPanel', 'loginPanel',
+        'sameAsBilling', 'shippingFields',
+    ]
+
+    connect() {
+        // Reflect whatever the server rendered (old input on a validation
+        // redisplay, or the default) before any click happens.
+        if (this.hasSameAsBillingTarget) this.syncShippingFields()
+    }
+
+    showGuest() {
+        this.guestPanelTarget.hidden = false
+        this.loginPanelTarget.hidden = true
+        this.guestTabTarget.setAttribute('aria-selected', 'true')
+        this.loginTabTarget.setAttribute('aria-selected', 'false')
+    }
+
+    showLogin() {
+        this.guestPanelTarget.hidden = true
+        this.loginPanelTarget.hidden = false
+        this.guestTabTarget.setAttribute('aria-selected', 'false')
+        this.loginTabTarget.setAttribute('aria-selected', 'true')
+    }
+
+    toggleSameAsBilling() {
+        this.syncShippingFields()
+    }
+
+    // Disabled fields are simply never submitted by the browser — the server
+    // never sees stale shipping values while "same as billing" is checked.
+    syncShippingFields() {
+        const sameAsBilling = this.sameAsBillingTarget.checked
+
+        this.shippingFieldsTarget.hidden = sameAsBilling
+        this.shippingFieldsTarget.querySelectorAll('input, select, textarea').forEach((field) => {
+            field.disabled = sameAsBilling
+        })
+    }
+}

resources/js/checkout/index.js

@@ -1,5 +1,6 @@
 import BbkAddToCartController from './bbk-add-to-cart-controller'
 import BbkCartController from './bbk-cart-controller'
+import BbkCheckoutFormController from './bbk-checkout-form-controller'
 
 // Registers the checkout module's Stimulus controllers onto the host app's
 // Stimulus application. Call once from the host's JS entry point:
@@ -12,4 +13,5 @@ import BbkCartController from './bbk-cart-controller'
 export function registerCheckout(application) {
     application.register('bbk-add-to-cart', BbkAddToCartController)
     application.register('bbk-cart', BbkCartController)
+    application.register('bbk-checkout-form', BbkCheckoutFormController)
 }