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

40 lines
757 B
TypeScript

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