Function component rendered inside BaseApplicationCustomizer

[Nevinia210]

Hello,
may i ask, is it possible to render function component inside application customizer?
node version used: 16.15.0
Spfx version used: 1.16.1
also i went thru whole this example which explains how to do this exact thing, but its not working in my environment, maybe the fact that there is used different version of spfx does the trick?

Generated class component XXXApplicationCustomizer.ts:

export default class XXXPageFeedbackApplicationCustomizer
  extends BaseApplicationCustomizer<IXXXPageFeedbackApplicationCustomizerProperties> {

  private _bottomPlaceholder: PlaceholderContent | undefined;

  public onInit(): Promise<void> {
    this.context.placeholderProvider.changedEvent.add(this, this._renderPlaceHolder);
    return Promise.resolve();
  }

  private _renderPlaceHolder(): void {

    if (!this._bottomPlaceholder) {
      this._bottomPlaceholder = this.context.placeholderProvider.tryCreateContent(PlaceholderName.Bottom);
    }

    if (this._bottomPlaceholder) {
      const element: React.ReactElement<IPageFeedbackProps> = React.createElement(PageFeedback, {

      });

      ReactDom.render(element, this._bottomPlaceholder.domElement);
    }
  }
}

Function component PageFeedback:

export const PageFeedback: React.FunctionComponent = () => {

  return (
    <div>test text</div>
  );
};

im getting an error:
Error: Failed to create application customizer 'ClientSideExtension.ApplicationCustomizer.0b92db1e-c234-4ec3-8d71-7bca9513b0b7'. Error information is 'Extension failed to load for componentId "0b92db1e-c234-4ec3-8d71-7bca9513b0b7".'.