import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch";


const SuccessDangerSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
	className,
	knobClassName,
	disabled,
	...props
}, ref ) => {
	return (
		<MattrixwvSwitch
			{...props}
			className={clsx(
				className,
				{
					"bg-danger data-checked:bg-success": !disabled,
					"bg-danger-light/80 data-checked:bg-success-light/80": disabled
				}
			)}
			knobClassName={clsx(
				knobClassName,
				{
					"bg-white": !disabled,
					"bg-neutral-light": disabled
				}
			)}
			disabled={disabled}
			ref={ref}
		/>
	);
});

SuccessDangerSwitch.displayName = "SuccessDangerSwitch";

export default SuccessDangerSwitch;