import { Form, Switch } from '@fluid-design/fluid-ui'; import { motion } from 'framer-motion'; import { useState } from 'react'; import { defaultFormClassName } from '@/components/form'; import { CodeFrameComponentWrap } from '@/components/framework/CodeFrameComponentWrap'; import clsxm from '@/lib/clsxm'; import { useToast } from '@/lib/useToast'; const SwitchDemo = ({ className = '' }) => { const [present] = useToast(); const [isNotificationDisabled, setIsNotificationDisabled] = useState(false); return (
null} initialValues={{ notifications: true, notificationOptions: { email: true, sms: true, push: false, }, }} > { setIsNotificationDisabled(!value); present({ title: 'Notifications', message: value ? 'Enabled' : 'Disabled', }); }} />
present({ title: 'Email Notifications', message: value ? 'Enabled' : 'Disabled', }) } /> present({ title: 'SMS Notifications', message: value ? 'Enabled' : 'Disabled', }) } />
); }; const CustomBG = () => { const [present] = useToast(); return (
null} initialValues={{ email: true, }} > present({ title: 'Email Notifications', message: value ? 'Enabled' : 'Disabled', }) } />
); }; const Advanced = () => { const [present] = useToast(); return (
null} initialValues={{ sms: true, }} > present({ title: 'SMS Notifications', message: value ? 'Enabled' : 'Disabled', }) } />
); }; SwitchDemo.displayName = 'SwitchDemo'; CustomBG.displayName = 'CustomBG'; Advanced.displayName = 'Advanced'; export const SwitchExamples = Object.assign( {}, { Demo: SwitchDemo, CustomBG, Advanced } );