When setting a custom provider, we can set a

buttonComponent

property. That can introduce misalignments across the buttons. It would be much better if we may set the SVG of the logo, and that be managed like any other logo. If the app was in Javascript I would make a PR for it. I am not a Typescript dev. Anyway, all that needs to be changed is — add a property logo to the provider definition — modify

Provider#getDefaultButton

something like:

getDefaultButton(name?: string): JSX.Element {
        const providerName = name !== undefined ? name : this.name;
        return <ProviderButton logo={this.logo || this.getLogo()} providerName={providerName} displayName={this.name} />;
    }

I opened an issue at