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

40 lines
779 B
TypeScript

import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch";
const TertiarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
className,
knobClassName,
disabled,
...props
}, ref ) => {
return (
<MattrixwvSwitch
className={clsx(
"bg-gray-400",
className,
{
"data-checked:bg-tertiary": !disabled,
"data-checked:bg-tertiary-light/80": disabled
}
)}
knobClassName={clsx(
knobClassName,
{
"bg-white": !disabled,
"bg-neutral-light": disabled
}
)}
disabled={disabled}
ref={ref}
{...props}
/>
);
});
TertiarySwitch.displayName = "TertiarySwitch";
export default TertiarySwitch;