// components/Swap.js
import { h } from "sigpro";
import { ui, val } from "../utils.js";

/**
 * Swap component
 * 
 * daisyUI classes used:
 * - swap, swap-on, swap-off, swap-active
 * - swap-rotate, swap-flip, swap-indeterminate
 */
export const Swap = (props) => {
  const { class: className, value, on, off, ...rest } = props;

  return h("label", { ...rest, class: ui('swap', className) }, [
    h("input", {
      type: "checkbox",
      checked: () => val(value),
      onclick: (e) => {
        if (typeof value === "function") {
          value(e.target.checked);
        }
      }
    }),
    h("div", { class: "swap-on" }, on),
    h("div", { class: "swap-off" }, off),
  ]);
};