;; Market header components

(defcomp ~market-post-label-image (&key src)
  (img :src src :class "h-8 w-8 rounded-full object-cover border border-stone-300 flex-shrink-0"))

(defcomp ~market-post-label-title (&key title)
  (span title))

(defcomp ~market-post-cart-badge (&key href count)
  (a :href href :class "relative inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border border-emerald-300 bg-emerald-50 text-emerald-800 hover:bg-emerald-100 transition"
    (i :class "fa fa-shopping-cart" :aria-hidden "true")
    (span count)))

(defcomp ~market-shop-label (&key title top-slug sub-div-html)
  (div :class "font-bold text-xl flex-shrink-0 flex gap-2 items-center"
    (div (i :class "fa fa-shop") " " title)
    (div :class "flex flex-col md:flex-row md:gap-2 text-xs"
      (div top-slug) (raw! sub-div-html))))

(defcomp ~market-sub-slug (&key sub)
  (div sub))

(defcomp ~market-product-label (&key title)
  (<> (i :class "fa fa-shopping-bag" :aria-hidden "true") (div title)))

(defcomp ~market-admin-link (&key href hx-select)
  (a :href href :hx-get href :hx-target "#main-panel"
     :hx-select hx-select :hx-swap "outerHTML" :hx-push-url "true"
     :class "px-2 py-1 text-stone-500 hover:text-stone-700"
     (i :class "fa fa-cog" :aria-hidden "true")))

(defcomp ~market-oob-header (&key parent-id child-id row-html)
  (div :id parent-id :hx-swap-oob "outerHTML" :class "w-full"
    (div :class "w-full" (raw! row-html)
      (div :id child-id))))

(defcomp ~market-header-child (&key inner-html)
  (div :id "root-header-child" :class "w-full" (raw! inner-html)))