Los controles con estado siguen el modelo controlado o no controlado de React.

• Usa value, checked u open cuando la aplicación gestione el estado.
• Usa defaultValue, defaultChecked o defaultOpen para que el componente inicialice y gestione su propio estado.
• Atiende el callback correspondiente para observar o aceptar los cambios.

import { useState } from "react"
import { Toggle } from "@liquidify/react"

export function NotificationsSetting() {
  const [enabled, setEnabled] = useState(false)
  return (
    <Toggle
      aria-label="Notifications"
      checked={enabled}
      onChange={setEnabled}
    />
  )
}

No cambies un componente montado de controlado a no controlado, ni al revés. En aplicaciones con renderizado en servidor, usa el mismo valor inicial en el servidor y en el primer renderizado del cliente.

Los callbacks notifican los cambios solicitados por el usuario. La prop controlada sigue determinando el estado: actualízala para aceptar el cambio. Consulta los nombres de callbacks y los tipos de valores en la página de cada componente.