Files
MattrixwvReactComponents/lib/component/input/switch/SuccessDangerSwitch.tsx

39 lines
807 B
TypeScript

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
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}
{...props}
/>
);
});
SuccessDangerSwitch.displayName = "SuccessDangerSwitch";
export default SuccessDangerSwitch;