How to use the @polkadot/rpc-provider.WsProvider function in @polkadot/rpc-provider

import { LightApi } from '@polkadot/light-api';
import { WsProvider } from '@polkadot/rpc-provider';
import React from 'react';
import ReactDOM from 'react-dom';
import { switchMap } from 'rxjs/operators';

import App from './App';
import * as serviceWorker from './serviceWorker';
import './index.css';

ReactDOM.render(, document.getElementById('root'));

const lightApi = new LightApi(new WsProvider('ws://localhost:9944')).isReady;

lightApi
  .pipe(switchMap(api => api.light.newHead()))
  .subscribe(header => console.log('Now at ', header.get('number').toJSON()));

lightApi
  .pipe(switchMap(api => api.light.balanceOf('15jd4tmKwLf1mYWzmZxHeCpT38B2mx1GH6aDniXQxBjskkws')))
  .subscribe(b => console.log('Balance of Alice', b.toString()));

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: http://bit.ly/CRA-PWA
serviceWorker.unregister();

constructor (options: ApiOptions, type: ApiTypes, decorateMethod: DecorateMethod) {
    super();

    this.registry = options.registry || new TypeRegistry();

    const thisProvider = options.source
      ? options.source._rpcCore.provider.clone()
      : (options.provider || new WsProvider());

    this.decorateMethod = decorateMethod;
    this._options = options;
    this._type = type;
    this._rpcCore = new RpcCore(this.registry, thisProvider, this._options.rpc);
    this._isConnected = new BehaviorSubject(this._rpcCore.provider.isConnected());
    this._rx.hasSubscriptions = this._rpcCore.provider.hasSubscriptions;
    this._rx.registry = this.registry;
  }

const setApiUrl = (url: string = defaults.WS_URL): void =>
      setApi(new WsProvider(url));

constructor (props: Props) {
    super(props);

    const { queuePayload, queueSetTxStatus, url } = props;
    const provider = new WsProvider(url);
    const signer = new ApiSigner(queuePayload, queueSetTxStatus);

    const setApi = (provider: ProviderInterface): void => {
      api = this.createApi(provider, signer);

      this.setState({ api }, (): void => {
        this.subscribeEvents();
      });
    };
    const setApiUrl = (url: string = defaults.WS_URL): void =>
      setApi(new WsProvider(url));

    api = this.createApi(provider, signer);

    this.state = {
      api,