import React from 'react';
import MuiSwitch from '@mui/material/Switch';
import type { SwitchProps as MuiSwitchProps } from '@mui/material/Switch';

// ─── Types ───────────────────────────────────────────────────────────────────

/** Props for the FA Switch component */
export type SwitchProps = MuiSwitchProps;

// ─── Component ───────────────────────────────────────────────────────────────

/**
 * Toggle switch for the FA design system.
 *
 * Binary on/off control for enabling add-ons and options in arrangement
 * forms. Wraps MUI Switch with FA brand tokens — warm gold track when
 * active, bordered pill shape when inactive.
 *
 * From Parsons 1.0 Figma "Style One" — bordered variant with brand fill.
 *
 * Usage:
 * - Use for boolean settings ("Include catering", "Add memorial video")
 * - For mutually exclusive options, use Radio instead
 *
 * **Accessibility**: Always wrap in `FormControlLabel` with a `label` prop.
 * A standalone Switch without a visible label is inaccessible — screen
 * readers cannot announce what the toggle controls.
 * ```tsx
 * <FormControlLabel control={<Switch />} label="Include catering" />
 * ```
 */
export const Switch = React.forwardRef<HTMLButtonElement, SwitchProps>((props, ref) => {
  return <MuiSwitch ref={ref} {...props} />;
});

Switch.displayName = 'Switch';
export default Switch;
