Move from using renderer.ts in electron to preload.ts for electron-find

Question

So I'm trying to use the electron-find package to implement "Cmd+F" find function in my electron-react application. The example the author shows for usage requires me using "require" and "remote" in the renderer but I want to be able to use preload.ts and not use remote instead as thats the recommended security practice. Would anyone be able to provide some guidance? code examples would be appreciated as well.

The following is main.js (what I do in my main.ts)

    const electron = require('electron')
    const { app, BrowserWindow, globalShortcut } = electron
    const path = require('path')
    let win
    const winURL = 'file://' + path.normalize(`${__dirname}/index.html`)

    function createWindow () {   
      win = new BrowserWindow({ 
        width: 1280,
        height: 1040,
        center: false,
        webPreferences: {
          nodeIntegration: true,
          plugins: true,
          } 
      })
      win.loadURL(winURL)
      //win.webContents.openDevTools()
      win.on('closed', () => {
        win = null
      })

      win.on('focus', () => {
        globalShortcut.register('CommandOrControl+F', function () {
          if (win && win.webContents) {
            win.webContents.send('on-find', '')
          }
        })
      })
      win.on('blur', () => {
        globalShortcut.unregister('CommandOrControl+F')
      })
      
    }
      
    app.on('ready', createWindow)
    app.on('window-all-closed', () => {
      if (process.platform !== 'darwin') {
        app.quit()
      }
      globalShortcut.unregister('CommandOrControl+F')
    })

    app.on('activate', () => {
      if (win === null) createWindow()
    })

This is whats in example.js(what I would normally do in renderer.ts but don't want to)

    const { remote, ipcRenderer } = require('electron')
    const { FindInPage } = require('../src/index.js')


    let findInPage = new FindInPage(remote.getCurrentWebContents(), {
      preload: true,
      offsetTop: 6,
      offsetRight: 10
    })

    ipcRenderer.on('on-find', (e, args) => {
      findInPage.openFindWindow()
    })