import { forwardRef } from "react";

/**
 * Range
 *
 * variant: "secondary" | "accent" | "info" | "success" | "warning" | "danger" | (default)
 */
const Range = forwardRef(function Range(
  { variant, className = "", ...props },
  ref
) {
  const classes = [
    "prs-range",
    variant && variant !== "default" && `prs-range-${variant}`,
    className,
  ]
    .filter(Boolean)
    .join(" ");

  return <input type="range" ref={ref} className={classes} {...props} />;
});

export default Range;
