;; Market cart components (defcomp ~cart/add-empty (&key cart-id action csrf) (div :id cart-id (form :action action :method "post" :sx-post action :sx-target "#cart-mini" :sx-swap "outerHTML" :class "rounded flex items-center" (input :type "hidden" :name "csrf_token" :value csrf) (input :type "hidden" :name "count" :value "1") (button :type "submit" :class "relative inline-flex items-center justify-center text-sm font-medium text-stone-500 hover:bg-emerald-50" (span :class "relative inline-flex items-center justify-center" (i :class "fa fa-cart-plus text-4xl" :aria-hidden "true")))))) (defcomp ~cart/add-quantity (&key cart-id action csrf minus-val plus-val quantity cart-href) (div :id cart-id (div :class "rounded flex items-center gap-2" (form :action action :method "post" :sx-post action :sx-target "#cart-mini" :sx-swap "outerHTML" (input :type "hidden" :name "csrf_token" :value csrf) (input :type "hidden" :name "count" :value minus-val) (button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "-")) (a :class "relative inline-flex items-center justify-center text-emerald-700" :href cart-href (span :class "relative inline-flex items-center justify-center" (i :class "fa-solid fa-shopping-cart text-2xl" :aria-hidden "true") (span :class "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none" (span :class "flex items-center justify-center bg-black text-white rounded-full w-4 h-4 text-xs font-bold" quantity)))) (form :action action :method "post" :sx-post action :sx-target "#cart-mini" :sx-swap "outerHTML" (input :type "hidden" :name "csrf_token" :value csrf) (input :type "hidden" :name "count" :value plus-val) (button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "+"))))) (defcomp ~cart/mini-count (&key href count) (div :id "cart-mini" :sx-swap-oob "outerHTML" (a :href href :class "relative inline-flex items-center justify-center" (span :class "relative inline-flex items-center justify-center" (i :class "fa-solid fa-shopping-cart text-xl" :aria-hidden "true") (span :class "absolute -top-1.5 -right-2 pointer-events-none" (span :class "flex items-center justify-center bg-emerald-500 text-white rounded-full min-w-[1.25rem] h-5 text-xs font-bold px-1" count)))))) (defcomp ~cart/mini-empty (&key href logo) (div :id "cart-mini" :sx-swap-oob "outerHTML" (a :href href :class "relative inline-flex items-center justify-center" (img :src logo :class "h-8 w-8 rounded-full object-cover border border-stone-300" :alt "")))) (defcomp ~cart/add-oob (&key id content inner) (div :id id :sx-swap-oob "outerHTML" (if content content (when inner inner)))) ;; Cart added response — composes cart mini + add/remove OOB in sx (defcomp ~cart/added-response (&key has-count cart-href blog-href logo slug action csrf quantity minus-val plus-val) (<> (if has-count (~cart/mini-count :href cart-href :count (str has-count)) (~cart/mini-empty :href blog-href :logo logo)) (~cart/add-oob :id (str "cart-add-" slug) :inner (if (= (or quantity "0") "0") (~cart/add-empty :cart-id (str "cart-" slug) :action action :csrf csrf) (~cart/add-quantity :cart-id (str "cart-" slug) :action action :csrf csrf :minus-val minus-val :plus-val plus-val :quantity quantity :cart-href cart-href)))))