(defisland
  ()
  (let
    ((base (signal 1))
      (doubled (computed (fn () (* (deref base) 2))))
      (quadrupled (computed (fn () (* (deref doubled) 2)))))
    (div
      (~tw :tokens "rounded-lg border border-stone-200 p-4 space-y-2")
      (div
        (~tw :tokens "flex items-center gap-3")
        (button
          (~tw :tokens "px-3 py-1 rounded bg-violet-600 text-white text-sm")
          :on-click (fn (e) (swap! base dec))
          "-")
        (span
          (~tw :tokens "text-2xl font-bold text-violet-700 min-w-[3ch] text-center")
          (deref base))
        (button
          (~tw :tokens "px-3 py-1 rounded bg-violet-600 text-white text-sm")
          :on-click (fn (e) (swap! base inc))
          "+"))
      (p
        (~tw :tokens "text-sm text-stone-500")
        (str
          "doubled: "
          (deref doubled)
          "  |  quadrupled: "
          (deref quadrupled))))))
