@stacksjs/defaults 0.75.38 → 0.75.40

package/resources/components/Dashboard/Marketing/RecoveryCampaignDialog.stx

@@ -1,6 +1,7 @@
 <script client>
 import type { AbandonedCartRecord } from '../../../../app/Actions/Dashboard/Marketing/abandoned-cart-records'
 import { reachOf } from '../../../../app/Actions/Dashboard/Marketing/abandoned-cart-records'
+import { formatCurrency, moneyInputError, moneyInputStep, parseMoneyInput } from '@stacksjs/commerce/money'
 
 const open = useReactiveProp('open', false)
 const records = useReactiveProp('records', [] as AbandonedCartRecord[])
@@ -16,7 +17,9 @@ const text = state('')
 const fromName = state('')
 const fromAddress = state('')
 const idleHours = state(4)
-const minimumValue = state(0)
+// The threshold as typed, in major units. Carts and the stored rule hold
+// integer minor units (stacksjs/stacks#2851).
+const minimumValue = state('0')
 const scheduledAt = state('')
 let hydrated = false
 
@@ -34,7 +37,7 @@ effect(() => {
   fromName.set('')
   fromAddress.set('')
   idleHours.set(defaultIdleHours())
-  minimumValue.set(0)
+  minimumValue.set('0')
   scheduledAt.set('')
 })
 
@@ -46,22 +49,30 @@ effect(() => {
  * still choosing it, not after they have scheduled a send to an empty room.
  */
 function reach(): { carts: number, value: number } {
-  return reachOf(records(), Number(idleHours()) || 0, Number(minimumValue()) || 0)
+  return reachOf(records(), Number(idleHours()) || 0, minimumMinor())
+}
+
+function minimumError(): string {
+  return moneyInputError(minimumValue(), defaultCurrency(), { required: false })
+}
+
+/** The typed threshold in minor units, or 0 while it is empty or unreadable. */
+function minimumMinor(): number {
+  if (minimumError())
+    return 0
+  return parseMoneyInput(minimumValue(), defaultCurrency(), { required: false }) ?? 0
 }
 
 function money(value: number): string {
-  try {
-    return new Intl.NumberFormat(undefined, { style: 'currency', currency: defaultCurrency() || 'USD' }).format(value)
-  }
-  catch {
-    return `${value.toFixed(2)} ${defaultCurrency()}`
-  }
+  return formatCurrency(value, defaultCurrency())
 }
 
 function submit(): void {
   const when = scheduledAt() ? new Date(scheduledAt()) : null
   if (when && !Number.isFinite(when.getTime()))
     return
+  if (minimumError())
+    return
 
   emit('submit', {
     name: name(),
@@ -70,7 +81,7 @@ function submit(): void {
     fromName: fromName(),
     fromAddress: fromAddress(),
     idleHours: Number(idleHours()) || 0,
-    minimumValue: Number(minimumValue()) || 0,
+    minimumValue: minimumMinor(),
     scheduledAt: when ? when.toISOString() : null,
     currency: defaultCurrency(),
   })
@@ -101,8 +112,9 @@ function submit(): void {
       </label>
       <label class="block">
         <span class="font-medium text-gray-700 text-sm dark:text-neutral-200">Minimum cart value</span>
-        <input x-model="minimumValue" type="number" min="0" step="1" class="mt-1 px-3 py-2 w-full text-gray-900 text-sm dark:text-white bg-white dark:bg-neutral-900 border border-gray-300 rounded-md dark:border-neutral-700" />
-        <span class="block mt-1 text-gray-500 text-xs dark:text-neutral-400">Leave at zero to chase every cart.</span>
+        <input x-model="minimumValue" type="number" min="0" :step="moneyInputStep(defaultCurrency())" class="mt-1 px-3 py-2 w-full text-gray-900 text-sm dark:text-white bg-white dark:bg-neutral-900 border border-gray-300 rounded-md dark:border-neutral-700" />
+        <span :if="minimumError()" class="block mt-1 text-red-600 text-xs dark:text-red-400">{{ minimumError() }}</span>
+        <span :if="!minimumError()" class="block mt-1 text-gray-500 text-xs dark:text-neutral-400">Leave at zero to chase every cart.</span>
       </label>
     </div>
 
@@ -139,7 +151,7 @@ function submit(): void {
   <template #footer>
     <div class="flex gap-2 justify-end w-full">
       <Button :disabled="busy()" variant="secondary" @click="emit('close')">Close</Button>
-      <Button :disabled="busy() || !name() || !subject()" :loading="busy()" @click="submit()">{{ scheduledAt() ? 'Schedule campaign' : 'Save as draft' }}</Button>
+      <Button :disabled="busy() || !name() || !subject() || !!minimumError()" :loading="busy()" @click="submit()">{{ scheduledAt() ? 'Schedule campaign' : 'Save as draft' }}</Button>
     </div>
   </template>
 </Modal>

package/resources/components/Dashboard/Transaction/index.stx

@@ -1,4 +1,6 @@
 <script server>
+import { formatCurrency } from '@stacksjs/commerce/money'
+
 interface indexProps {
   transactionHistory?: any[]
 }
@@ -15,8 +17,9 @@ function formatTimestampDate(timestamp: number) {
     return lineData?.[0]?.plan?.interval || ''
   }
 
-  function getUnitPrice(lineData: Array<{ price?: { unit_amount?: number | string } }> | undefined) {
-    return (Number(lineData?.[0]?.price?.unit_amount || 0) / 100).toFixed(2)
+  // Stripe reports `unit_amount` in the currency's minor unit.
+  function getUnitPrice(lineData: Array<{ price?: { unit_amount?: number | string, currency?: string } }> | undefined) {
+    return formatCurrency(lineData?.[0]?.price?.unit_amount || 0, lineData?.[0]?.price?.currency || 'USD')
   }
 
   function getLastDigits(paymentIntent: { payment_method?: { card?: { last4?: string } } } | undefined) {
@@ -66,7 +69,7 @@ function formatTimestampDate(timestamp: number) {
                   {{ formatTimestampDate(transaction.created_at) }}
                 </td>
                 <td class="px-3 py-4 text-gray-500 text-sm whitespace-nowrap">
-                  ${{ getUnitPrice(transaction.unit_price) }}
+                  {{ getUnitPrice(transaction.unit_price) }}
                 </td>
                 <td class="flex items-center px-3 py-4 space-x-2 text-gray-500 text-sm whitespace-nowrap">
                   <slot name="cardBrand" />

package/resources/components/Storefront/CartDrawer.stx

@@ -143,7 +143,11 @@
     return String(s ?? '').replace(/[&<>"']/g, c => entities[c] ?? c)
   }
 
-  const render = (items: Array<{ slug?: string, name?: string, image?: string, qty?: number | string, price?: number | string, lineTotal?: number | string }> | null | undefined, subtotal: number | string) => {
+  // Amounts arrive from /api/cart already formatted (`priceLabel`,
+  // `lineTotalLabel`, `subtotalLabel`): the stored values are integer minor
+  // units of the cart's currency, and only the server formats them, through
+  // @stacksjs/commerce/money.
+  const render = (items: Array<{ slug?: string, name?: string, image?: string, qty?: number | string, priceLabel?: string, lineTotalLabel?: string }> | null | undefined, subtotalLabel: string) => {
     if (!list || !empty || !footer) return
     if (!items || items.length === 0) {
       list.classList.add('hidden')
@@ -159,8 +163,8 @@
       const name = escapeHtml(it.name || '')
       const image = escapeHtml(it.image || '')
       const qty = Number(it.qty) || 0
-      const price = Number(it.price) || 0
-      const lineTotal = Number(it.lineTotal) || 0
+      const priceLabel = escapeHtml(it.priceLabel || '')
+      const lineTotalLabel = escapeHtml(it.lineTotalLabel || '')
       return [
         '<li class="flex gap-3 items-start">',
         '  <a href="/products/' + slug + '" class="block overflow-hidden flex-shrink-0 h-16 w-16 bg-stone-200 rounded-xl">',
@@ -168,13 +172,13 @@
         '  </a>',
         '  <div class="flex-1 min-w-0">',
         '    <p class="font-semibold text-sm text-stone-900 truncate">' + name + '</p>',
-        '    <p class="mt-0.5 text-stone-500 text-xs">Qty ' + qty + ' · $' + price.toFixed(2) + '</p>',
+        '    <p class="mt-0.5 text-stone-500 text-xs">Qty ' + qty + ' · ' + priceLabel + '</p>',
         '  </div>',
-        '  <p class="font-semibold text-sm text-stone-900">$' + lineTotal.toFixed(2) + '</p>',
+        '  <p class="font-semibold text-sm text-stone-900">' + lineTotalLabel + '</p>',
         '</li>',
       ].join('')
     }).join('')
-    if (subtotalEl) subtotalEl.textContent = '$' + (Number(subtotal) || 0).toFixed(2)
+    if (subtotalEl) subtotalEl.textContent = subtotalLabel
   }
 
   let inflightRefresh: Promise<void> | null = null
@@ -193,7 +197,7 @@
         })
         if (!res.ok) return
         const data = await res.json()
-        render(data.items || [], data.subtotal || 0)
+        render(data.items || [], data.subtotalLabel || '')
         const badge = document.querySelector('[data-stx-cart-count]')
         if (badge) {
           const total = (data.items || []).reduce((sum: number, item: { qty?: number | string }) => sum + (Number(item.qty) || 0), 0)

package/resources/views/cart.stx

@@ -15,15 +15,17 @@ interface CartItemRow {
   weight_grams: number | null
 }
 
-// The column of `carts` this page reads. The query selects `*`.
+// The columns of `carts` this page reads. The query selects `*`.
 interface CartRow {
   id: number
+  currency: string | null
 }
 
 interface StorefrontLineItem { lineTotal: number }
 
 const { verifyCartCookie } = require('../../app/Storefront/CartCookie')
 const { readStorefront } = require('../../app/Storefront/StorefrontDatabase')
+const { storefrontCurrency, storefrontMoney, storefrontSummary } = require('../../app/Storefront/StorefrontMoney')
 
 // Signed by the storefront actions as the token, a dot and its HMAC. An
 // unsigned or tampered cookie is no cart, and is never looked up.
@@ -35,6 +37,8 @@ const found = token
       if (!row)
         return { cart: null, items: [] }
 
+      // Every amount below is integer minor units of the cart's currency.
+      const currency = storefrontCurrency(row.currency)
       const lines = db.query<CartItemRow, [number]>(`
         SELECT ci.id, ci.quantity, ci.unit_price, ci.total_price, ci.product_name,
               ci.product_image, ci.product_sku, p.weight_grams
@@ -52,9 +56,9 @@ const found = token
           name: line.product_name,
           weight: line.weight_grams ? `${line.weight_grams}g` : '',
           qty,
-          priceLabel: `$${price.toFixed(2)}`,
+          priceLabel: storefrontMoney(price, currency),
           lineTotal,
-          lineTotalLabel: `$${lineTotal.toFixed(2)}`,
+          lineTotalLabel: storefrontMoney(lineTotal, currency),
           image: line.product_image,
         }
       })
@@ -66,27 +70,19 @@ const found = token
 const cart = found.cart
 const items = found.items
 
-// Mirror the rule used by PlaceOrderAction so the price the shopper
-// sees in their cart matches the total they're actually charged. Both
-// sides read STOREFRONT_FREE_SHIPPING_THRESHOLD / STOREFRONT_FLAT_SHIPPING
-// from the environment with the same defaults — keep them in sync via
-// app/Actions/Storefront/_shipping.ts when changing.
-const FREE_SHIPPING_THRESHOLD = Number(process.env.STOREFRONT_FREE_SHIPPING_THRESHOLD ?? 40) || 40
-const FLAT_SHIPPING = Number(process.env.STOREFRONT_FLAT_SHIPPING ?? 5) || 5
+// The same shipping rule PlaceOrderAction charges with
+// (app/Actions/Storefront/_shipping.ts), in minor units, so the price the
+// shopper sees in their cart matches the total they're actually charged.
 const subtotal = items.reduce((sum: number, i: StorefrontLineItem) => sum + i.lineTotal, 0)
-const shipping = subtotal <= 0 ? 0 : (subtotal >= FREE_SHIPPING_THRESHOLD ? 0 : FLAT_SHIPPING)
-const total = subtotal + shipping
-const remainingForFree = Math.max(0, FREE_SHIPPING_THRESHOLD - subtotal)
-
-// Pre-format every numeric so the OrderSummary component template doesn't
-// have to call .toFixed() on a defineProps local — STX's SSR pass doesn't
-// reliably expose those locals, so callers do the formatting.
-const subtotalLabel = `$${subtotal.toFixed(2)}`
-const shippingLabel = shipping === 0 ? 'Free' : `$${shipping.toFixed(2)}`
-const totalLabel = `$${total.toFixed(2)}`
-const freeShippingNote = (shipping > 0 && remainingForFree > 0)
-  ? `Add $${remainingForFree.toFixed(2)} more for free shipping.`
-  : ''
+
+// Pre-format every amount so the OrderSummary component template doesn't
+// have to format a defineProps local — STX's SSR pass doesn't reliably
+// expose those locals, so callers do the formatting.
+const summary = storefrontSummary(subtotal, storefrontCurrency(cart?.currency))
+const subtotalLabel = summary.subtotalLabel
+const shippingLabel = summary.shippingLabel
+const totalLabel = summary.totalLabel
+const freeShippingNote = summary.freeShippingNote
 </script>
 
 @section('content')

package/resources/views/checkout/contact.stx

@@ -14,6 +14,7 @@ interface CartSummaryRow {
 // migration creates any but `id` (see app/Storefront/StorefrontDatabase.ts).
 interface CartRow {
   id: number
+  currency: string | null
   email: string | null
 }
 
@@ -21,6 +22,7 @@ interface StorefrontLineItem { lineTotal: number }
 
 const { verifyCartCookie } = require('../../../app/Storefront/CartCookie')
 const { readStorefront } = require('../../../app/Storefront/StorefrontDatabase')
+const { storefrontCurrency, storefrontMoney, storefrontSummary } = require('../../../app/Storefront/StorefrontMoney')
 
 // Signed by the storefront actions as the token, a dot and its HMAC. An
 // unsigned or tampered cookie is no cart, and is never looked up.
@@ -32,6 +34,8 @@ const found = token
       if (!row)
         return { cart: null, items: [] }
 
+      // Every amount below is integer minor units of the cart's currency.
+      const currency = storefrontCurrency(row.currency)
       const lines = db.query<CartSummaryRow, [number]>(`
         SELECT product_name, quantity, total_price
         FROM cart_items WHERE cart_id = ?1 ORDER BY id ASC
@@ -42,7 +46,7 @@ const found = token
           name: line.product_name,
           qty,
           lineTotal,
-          lineTotalLabel: `$${lineTotal.toFixed(2)}`,
+          lineTotalLabel: storefrontMoney(lineTotal, currency),
         }
       })
 
@@ -53,21 +57,15 @@ const found = token
 const cart = found.cart
 const items = found.items
 
-// Mirror the rule in PlaceOrderAction's _shipping helper so the running
+// The same shipping rule PlaceOrderAction charges with
+// (app/Actions/Storefront/_shipping.ts), in minor units, so the running
 // totals on every checkout step match what gets charged.
-const FREE_SHIPPING_THRESHOLD = Number(process.env.STOREFRONT_FREE_SHIPPING_THRESHOLD ?? 40) || 40
-const FLAT_SHIPPING = Number(process.env.STOREFRONT_FLAT_SHIPPING ?? 5) || 5
 const subtotal = items.reduce((s: number, i: StorefrontLineItem) => s + i.lineTotal, 0)
-const shipping = subtotal <= 0 ? 0 : (subtotal >= FREE_SHIPPING_THRESHOLD ? 0 : FLAT_SHIPPING)
-const total = subtotal + shipping
-const remainingForFree = Math.max(0, FREE_SHIPPING_THRESHOLD - subtotal)
-
-const subtotalLabel = `$${subtotal.toFixed(2)}`
-const shippingLabel = shipping === 0 ? 'Free' : `$${shipping.toFixed(2)}`
-const totalLabel = `$${total.toFixed(2)}`
-const freeShippingNote = (shipping > 0 && remainingForFree > 0)
-  ? `Add $${remainingForFree.toFixed(2)} more for free shipping.`
-  : ''
+const summary = storefrontSummary(subtotal, storefrontCurrency(cart?.currency))
+const subtotalLabel = summary.subtotalLabel
+const shippingLabel = summary.shippingLabel
+const totalLabel = summary.totalLabel
+const freeShippingNote = summary.freeShippingNote
 
 const prefilledEmail = cart?.email || ''
 </script>

package/resources/views/checkout/payment.stx

@@ -14,6 +14,7 @@ interface CartSummaryRow {
 // migration creates any but `id` (see app/Storefront/StorefrontDatabase.ts).
 interface CartRow {
   id: number
+  currency: string | null
   email: string | null
   shipping_name: string | null
   shipping_address: string | null
@@ -26,6 +27,7 @@ interface StorefrontLineItem { lineTotal: number }
 
 const { verifyCartCookie } = require('../../../app/Storefront/CartCookie')
 const { readStorefront } = require('../../../app/Storefront/StorefrontDatabase')
+const { storefrontCurrency, storefrontMoney, storefrontSummary } = require('../../../app/Storefront/StorefrontMoney')
 
 // Signed by the storefront actions as the token, a dot and its HMAC. An
 // unsigned or tampered cookie is no cart, and is never looked up.
@@ -37,6 +39,8 @@ const found = token
       if (!row)
         return { cart: null, items: [] }
 
+      // Every amount below is integer minor units of the cart's currency.
+      const currency = storefrontCurrency(row.currency)
       const lines = db.query<CartSummaryRow, [number]>(`
         SELECT product_name, quantity, total_price
         FROM cart_items WHERE cart_id = ?1 ORDER BY id ASC
@@ -47,7 +51,7 @@ const found = token
           name: line.product_name,
           qty,
           lineTotal,
-          lineTotalLabel: `$${lineTotal.toFixed(2)}`,
+          lineTotalLabel: storefrontMoney(lineTotal, currency),
         }
       })
 
@@ -58,19 +62,15 @@ const found = token
 const cart = found.cart
 const items = found.items
 
-const FREE_SHIPPING_THRESHOLD = Number(process.env.STOREFRONT_FREE_SHIPPING_THRESHOLD ?? 40) || 40
-const FLAT_SHIPPING = Number(process.env.STOREFRONT_FLAT_SHIPPING ?? 5) || 5
+// The same shipping rule PlaceOrderAction charges with
+// (app/Actions/Storefront/_shipping.ts), in minor units, so the running
+// totals on every checkout step match what gets charged.
 const subtotal = items.reduce((s: number, i: StorefrontLineItem) => s + i.lineTotal, 0)
-const shipping = subtotal <= 0 ? 0 : (subtotal >= FREE_SHIPPING_THRESHOLD ? 0 : FLAT_SHIPPING)
-const total = subtotal + shipping
-const remainingForFree = Math.max(0, FREE_SHIPPING_THRESHOLD - subtotal)
-
-const subtotalLabel = `$${subtotal.toFixed(2)}`
-const shippingLabel = shipping === 0 ? 'Free' : `$${shipping.toFixed(2)}`
-const totalLabel = `$${total.toFixed(2)}`
-const freeShippingNote = (shipping > 0 && remainingForFree > 0)
-  ? `Add $${remainingForFree.toFixed(2)} more for free shipping.`
-  : ''
+const summary = storefrontSummary(subtotal, storefrontCurrency(cart?.currency))
+const subtotalLabel = summary.subtotalLabel
+const shippingLabel = summary.shippingLabel
+const totalLabel = summary.totalLabel
+const freeShippingNote = summary.freeShippingNote
 
 const ready = !!cart?.email && !!cart?.shipping_name && !!cart?.shipping_address
 </script>

package/resources/views/checkout/shipping.stx

@@ -14,6 +14,7 @@ interface CartSummaryRow {
 // migration creates any but `id` (see app/Storefront/StorefrontDatabase.ts).
 interface CartRow {
   id: number
+  currency: string | null
   email: string | null
   shipping_name: string | null
   shipping_address: string | null
@@ -26,6 +27,7 @@ interface StorefrontLineItem { lineTotal: number }
 
 const { verifyCartCookie } = require('../../../app/Storefront/CartCookie')
 const { readStorefront } = require('../../../app/Storefront/StorefrontDatabase')
+const { storefrontCurrency, storefrontMoney, storefrontSummary } = require('../../../app/Storefront/StorefrontMoney')
 
 // Signed by the storefront actions as the token, a dot and its HMAC. An
 // unsigned or tampered cookie is no cart, and is never looked up.
@@ -37,6 +39,8 @@ const found = token
       if (!row)
         return { cart: null, items: [] }
 
+      // Every amount below is integer minor units of the cart's currency.
+      const currency = storefrontCurrency(row.currency)
       const lines = db.query<CartSummaryRow, [number]>(`
         SELECT product_name, quantity, total_price
         FROM cart_items WHERE cart_id = ?1 ORDER BY id ASC
@@ -47,7 +51,7 @@ const found = token
           name: line.product_name,
           qty,
           lineTotal,
-          lineTotalLabel: `$${lineTotal.toFixed(2)}`,
+          lineTotalLabel: storefrontMoney(lineTotal, currency),
         }
       })
 
@@ -58,19 +62,15 @@ const found = token
 const cart = found.cart
 const items = found.items
 
-const FREE_SHIPPING_THRESHOLD = Number(process.env.STOREFRONT_FREE_SHIPPING_THRESHOLD ?? 40) || 40
-const FLAT_SHIPPING = Number(process.env.STOREFRONT_FLAT_SHIPPING ?? 5) || 5
+// The same shipping rule PlaceOrderAction charges with
+// (app/Actions/Storefront/_shipping.ts), in minor units, so the running
+// totals on every checkout step match what gets charged.
 const subtotal = items.reduce((s: number, i: StorefrontLineItem) => s + i.lineTotal, 0)
-const shipping = subtotal <= 0 ? 0 : (subtotal >= FREE_SHIPPING_THRESHOLD ? 0 : FLAT_SHIPPING)
-const total = subtotal + shipping
-const remainingForFree = Math.max(0, FREE_SHIPPING_THRESHOLD - subtotal)
-
-const subtotalLabel = `$${subtotal.toFixed(2)}`
-const shippingLabel = shipping === 0 ? 'Free' : `$${shipping.toFixed(2)}`
-const totalLabel = `$${total.toFixed(2)}`
-const freeShippingNote = (shipping > 0 && remainingForFree > 0)
-  ? `Add $${remainingForFree.toFixed(2)} more for free shipping.`
-  : ''
+const summary = storefrontSummary(subtotal, storefrontCurrency(cart?.currency))
+const subtotalLabel = summary.subtotalLabel
+const shippingLabel = summary.shippingLabel
+const totalLabel = summary.totalLabel
+const freeShippingNote = summary.freeShippingNote
 
 const ship = {
   name: cart?.shipping_name || '',

package/resources/views/cms/blocks/form.stx

@@ -8,6 +8,7 @@
 <div class="cms-form mx-auto max-w-xl px-6 py-8" data-form-uuid="{{ props.formUuid }}">
   <script client>
   import type { PublicFormDefinition, PublicFormField, SubmissionErrors } from '@stacksjs/forms'
+  import { moneyInputError, moneyInputStep, parseMoneyInput } from '@stacksjs/commerce/money'
 
   // `_form` carries a whole-form failure; the rest are keyed by field name.
   type FormErrors = SubmissionErrors & { _form?: string }
@@ -114,6 +115,54 @@
     }
   }
 
+  /**
+   * The currency a `currency` field is typed in: the form's payment currency,
+   * or USD, which is what the server's public definition defaults to.
+   */
+  function formCurrency(): string {
+    return definition()?.payment?.currency ?? 'USD'
+  }
+
+  /** What a text-like input records: the typed text, or minor units for a `currency` field. */
+  function setInput(field: PublicFormField, raw: string): void {
+    if (field.type === 'currency')
+      setAmount(field, raw)
+    else
+      values[field.name] = raw
+  }
+
+  /**
+   * Record what was typed into a `currency` field as integer minor units.
+   *
+   * The server takes a currency field as a whole number of minor units
+   * (`"19.99"` in USD is `1999`). This used to multiply the typed float by
+   * a hundred and round, which is float math (`1.005` came out as 100 cents,
+   * not 101), assumed two decimals for every currency, and turned an empty
+   * field into 0. The conversion is `@stacksjs/commerce/money`'s, at the
+   * form currency's precision.
+   *
+   * An amount the currency cannot hold (`19.999` in USD) is kept as typed and
+   * shown as an error, rather than rounded into a different amount, and the
+   * server rejects it on submit as well.
+   */
+  function setAmount(field: PublicFormField, raw: string): void {
+    const currency = formCurrency()
+    const error = moneyInputError(raw, currency, { required: false })
+    if (error) {
+      values[field.name] = raw
+      errors.set({ ...errors(), [field.name]: error })
+      return
+    }
+
+    const minor = parseMoneyInput(raw, currency, { required: false })
+    if (minor === null)
+      delete values[field.name]
+    else
+      values[field.name] = minor
+    if (errors()[field.name])
+      errors.set({ ...errors(), [field.name]: '' })
+  }
+
   /**
    * The `accept` attribute for a field's picker.
    *
@@ -210,7 +259,7 @@
                 <p :if="uploading[field.name]" class="mt-1.5 text-[13px] text-gray-500">Uploading...</p>
                 <p :else-if="attached[field.name]" class="mt-1.5 text-[13px] text-green-700">Attached {{ attached[field.name] }}</p>
               </div>
-              <input :else type="{{ field.type === 'email' ? 'email' : (field.type === 'phone' ? 'tel' : (field.type === 'date' ? 'date' : (field.type === 'currency' ? 'number' : 'text'))) }}" :required="field.required" placeholder="{{ field.options.placeholder ?? '' }}" @input="values[field.name] = field.type === 'currency' ? Math.round(Number($event.target.value) * 100) : $event.target.value" class="mt-1.5 w-full rounded-lg border border-gray-300 px-3.5 py-2.5 text-[15px]">
+              <input :else type="{{ field.type === 'email' ? 'email' : (field.type === 'phone' ? 'tel' : (field.type === 'date' ? 'date' : (field.type === 'currency' ? 'number' : 'text'))) }}" :required="field.required" placeholder="{{ field.options.placeholder ?? '' }}" :step="field.type === 'currency' ? moneyInputStep(formCurrency()) : null" @input="setInput(field, $event.target.value)" class="mt-1.5 w-full rounded-lg border border-gray-300 px-3.5 py-2.5 text-[15px]">
               <p :if="errors()[field.name]" class="mt-1.5 text-[13px] text-red-600">{{ errors()[field.name] }}</p>
             </template>
           </div>

package/resources/views/orders/[id].stx

@@ -18,6 +18,7 @@ interface StorefrontLineItem { lineTotal: number }
 
 const Database = require('bun:sqlite').Database
 const path = require('path')
+const { storefrontCurrency, storefrontMoney } = require('../../../app/Storefront/StorefrontMoney')
 
 const dbPath = path.resolve(process.cwd(), process.env.DB_DATABASE_PATH || 'database/stacks.sqlite')
 const db = new Database(dbPath, { readonly: true })
@@ -36,6 +37,10 @@ const order = orderId
     `).get(orderId)
   : null
 
+// Every amount is integer minor units of the order's currency (1999 is
+// $19.99): `order_items.price`, `orders.delivery_fee` and `orders.total_amount`.
+const currency = storefrontCurrency(order?.currency)
+
 const items = order
   ? db.query(`
       SELECT oi.quantity, oi.price, p.name, p.image_url, p.slug, p.weight_grams
@@ -51,12 +56,16 @@ const items = order
       qty: Number(row.quantity),
       price: Number(row.price),
       lineTotal: Number(row.quantity) * Number(row.price),
+      lineTotalLabel: storefrontMoney(Number(row.quantity) * Number(row.price), currency),
     }))
   : []
 
 const subtotal = items.reduce((s: number, i: StorefrontLineItem) => s + i.lineTotal, 0)
 const shipping = order ? Number(order.delivery_fee || 0) : 0
 const total = order ? Number(order.total_amount || 0) : 0
+const subtotalLabel = storefrontMoney(subtotal, currency)
+const shippingLabel = shipping === 0 ? 'Free' : storefrontMoney(shipping, currency)
+const totalLabel = storefrontMoney(total, currency)
 </script>
 
 @section('content')
@@ -90,7 +99,7 @@ const total = order ? Number(order.total_amount || 0) : 0
                 <p class="font-semibold text-stone-900">{{ item.name }}</p>
                 <p class="text-stone-500 text-xs">{{ item.weight }} · qty {{ item.qty }}</p>
               </div>
-              <p class="font-semibold text-stone-900">${{ item.lineTotal.toFixed(2) }}</p>
+              <p class="font-semibold text-stone-900">{{ item.lineTotalLabel }}</p>
             </li>
           @endforeach
         </ul>
@@ -98,9 +107,9 @@ const total = order ? Number(order.total_amount || 0) : 0
         <hr class="my-6 border-stone-200">
 
         <dl class="space-y-2 text-sm">
-          <div class="flex justify-between"><dt class="text-stone-600">Subtotal</dt><dd class="font-semibold text-stone-900">${{ subtotal.toFixed(2) }}</dd></div>
-          <div class="flex justify-between"><dt class="text-stone-600">Shipping</dt><dd class="font-semibold text-stone-900">{{ shipping === 0 ? 'Free' : `$${shipping.toFixed(2)}` }}</dd></div>
-          <div class="flex justify-between pt-2 text-base border-stone-200 border-t"><dt class="font-semibold text-stone-900">Total</dt><dd class="font-bold text-stone-900">${{ total.toFixed(2) }}</dd></div>
+          <div class="flex justify-between"><dt class="text-stone-600">Subtotal</dt><dd class="font-semibold text-stone-900">{{ subtotalLabel }}</dd></div>
+          <div class="flex justify-between"><dt class="text-stone-600">Shipping</dt><dd class="font-semibold text-stone-900">{{ shippingLabel }}</dd></div>
+          <div class="flex justify-between pt-2 text-base border-stone-200 border-t"><dt class="font-semibold text-stone-900">Total</dt><dd class="font-bold text-stone-900">{{ totalLabel }}</dd></div>
         </dl>
 
         <div class="mt-6 p-4 text-sm bg-stone-100 rounded-xl">

package/vcs/github/workflows/buddy-bot.yml

@@ -83,9 +83,9 @@ jobs:
           persist-credentials: true
 
       - name: Setup Pantry
-        uses: pantry-pm/pantry/packages/action@fa35547da630b14beda5b26a2625490864d5c963 # v0.11.60
+        uses: pantry-pm/pantry/packages/action@bc2f37441f1a7ed160c201bbe6e0552b81ca931e # v0.11.65
         with:
-          version: '0.11.60'
+          version: '0.11.65'
           install: 'false'
 
       - name: Install Dependencies
@@ -98,12 +98,12 @@ jobs:
 
       - name: Open and refresh update pull requests
         if: ${{ github.event.schedule == '0 */2 * * *' || (github.event_name == 'workflow_dispatch' && contains(fromJSON('["all", "update"]'), inputs.job)) }}
-        run: bunx buddy-bot update --strategy "${{ inputs.strategy || 'patch' }}" ${{ inputs.dry_run && '--dry-run' || '' }}
+        run: bunx @buddysh/buddy update --strategy "${{ inputs.strategy || 'patch' }}" ${{ inputs.dry_run && '--dry-run' || '' }}
 
       - name: Update the dependency dashboard
         if: ${{ github.event.schedule == '15 */2 * * *' || (github.event_name == 'workflow_dispatch' && contains(fromJSON('["all", "dashboard"]'), inputs.job)) }}
-        run: bunx buddy-bot dashboard ${{ inputs.dry_run && '--dry-run' || '' }}
+        run: bunx @buddysh/buddy dashboard ${{ inputs.dry_run && '--dry-run' || '' }}
 
       - name: Close landed pull requests and clean up branches
         if: ${{ github.event.schedule == '0 4 * * *' || (github.event_name == 'workflow_dispatch' && contains(fromJSON('["all", "check"]'), inputs.job)) }}
-        run: bunx buddy-bot update-check ${{ inputs.dry_run && '--dry-run' || '' }}
+        run: bunx @buddysh/buddy update-check ${{ inputs.dry_run && '--dry-run' || '' }}

package/vcs/github/workflows/ci.yml

@@ -30,7 +30,7 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Setup Pantry
-        uses: pantry-pm/pantry/packages/action@fa35547da630b14beda5b26a2625490864d5c963 # v0.11.60
+        uses: pantry-pm/pantry/packages/action@bc2f37441f1a7ed160c201bbe6e0552b81ca931e # v0.11.65
         with:
           install: 'false'
 
@@ -63,7 +63,7 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Setup Pantry
-        uses: pantry-pm/pantry/packages/action@fa35547da630b14beda5b26a2625490864d5c963 # v0.11.60
+        uses: pantry-pm/pantry/packages/action@bc2f37441f1a7ed160c201bbe6e0552b81ca931e # v0.11.65
         with:
           install: 'false'
 
@@ -99,7 +99,7 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Setup Pantry
-        uses: pantry-pm/pantry/packages/action@fa35547da630b14beda5b26a2625490864d5c963 # v0.11.60
+        uses: pantry-pm/pantry/packages/action@bc2f37441f1a7ed160c201bbe6e0552b81ca931e # v0.11.65
         with:
           install: 'false'
 

package/vcs/github/workflows/release.yml

@@ -21,7 +21,7 @@ jobs:
           fetch-depth: 0
 
       - name: Setup Pantry
-        uses: pantry-pm/pantry/packages/action@fa35547da630b14beda5b26a2625490864d5c963 # v0.11.60
+        uses: pantry-pm/pantry/packages/action@bc2f37441f1a7ed160c201bbe6e0552b81ca931e # v0.11.65
         with:
           install: 'false'