No form-control like styling to autocomplete component on dy

Expected behavior

Autocomplete component shows as it does in the docs AND I am able to change the filter on the instance to something else.

The image below is when I use new mdb.Input(formOutline).init()

Actual behavior

Here I am using: new mdb.Autocomplete(formOutline, { filter: () => [] });. Here I cannot specify the actual options as they are dependant on the data in the td beside it (the options are set on a different event)

Resources (screenshots, code snippets etc.)

If I init the autocompletes as shown in the snippet below:

// init form outlines when appended
$(document).on('formOutlineAppend', function() {

    document.querySelectorAll('.form-outline').forEach((formOutline) => {
        new mdb.Autocomplete(formOutline, {
            filter: () => [],
        });
    });

});

The autocomplete shows like:

but I would still like to change this filter to different values in later code:

console.log(node);
// Output (Node, not string):
// <div class="rateCell form-outline" id="fo_95QMV">
//   <input class="form-control rateInput" type="text" id="ri_95QMV">
//   <label class="form-label" for="ri_95QMV">Enter Rate..</label>
// </div>

// change the data in the option
let inst = mdb.Autocomplete.getInstance(node);

console.log(inst);
// Output: null

inst.dispose();

// TypeError: Cannot read properties of null (reading 'dispose')
// at appendRates (update-sub-project:617:7)
// at addEmployeeRow (update-sub-project:696:3)
// at update-sub-project:871:6
// at Array.forEach (<anonymous>)
// at fillForm (update-sub-project:870:24)
// at fetchSubproject (update-sub-project:487:2)

let dataFilter = (value) => fetchedData.filter(obj => obj.startsWith(value));
new mdb.Autocomplete(node, {
    filter: dataFilter,
});

Another question is with Autocompletes getOrCreateInstance() method, where do I specify the options if it is to create a new instance? how do I change the options on an existing instance?

I have created a snippet, where I can solve the appending new options problem (is there a nicer way to do this?) but the styling problem still exists.

https://mdbootstrap.com/snippets/standard/jps_mack/3689274