Best practice maintaining Angular project with Angular Elements

Question

I maintain Angular project, which is a kind of component library / framework, with components that will be reused by other projects. All projects now are written in Angular, but my team's components must be available also for other platforms (eg. React / .NET / plain HTML).

We export components as web agnostic components with Angular Elements. In HTML web components, one can only set string to attributes, so when I need to give array in Angular as input, I would do this:

const dropdownOptions: string[] = ["one", "two"];
...
<app-custom-component [dropdownOptions]="dropdownOptions"></app-custom-component>

In web component I need to pass string like this:

<custom-component dropdown-options='["one", "two"]'></custom-component>

So this is in my component

@Input() public dropdownOptions: Array<string>;                   //for native Angular
@Input('dropdown-options') public dropdownOptionsString: string;  //for other platforms

ngOnInit(): void {
  if (this.dropdownOptionsString) {
    this.dropdownOptions = JSON.parse(this.dropdownOptionsString);
  }
}

What is best practice here? We considered having separate project for Angular and Web Components, but maintaining two separate code bases is problematic.