Floating Action Button

import { Settings } from 'lucide-react'
import { FloatingActionButton, Switch } from '@otfdashkit/ui'

export function Example() {
  return (
    <div className="relative w-full h-[400px] bg-background flex items-center justify-center">
      <div className="text-center space-y-1">
        <p className="text-sm font-semibold text-foreground">FloatingActionButton</p>
        <p className="text-xs text-muted-foreground">Generic FAB — any icon, any sections</p>
      </div>
      <FloatingActionButton
        icon={<Settings className="h-[18px] w-[18px]" />}
        label="Open settings"
        title="Quick Settings"
        position="bottom-right"
        sections={[
          {
            label: 'Notifications',
            content: (
              <div className="space-y-2">
                {['Email alerts', 'Push', 'Digest'].map(item => (
                  <div key={item} className="flex items-center justify-between">
                    <span className="text-xs text-foreground">{item}</span>
                    <Switch />
                  </div>
                ))}
              </div>
            ),
          },
        ]}
      />
    </div>
  )
}