Building a custom Google Sign-In web button using apis.google.com/js/api:client.js

Question

I am building a Google Sign-In button and have switched to (what I believe to be) the new API, now using https://accounts.google.com/gsi/client

Previously there was a guide on how to build a custom Google Sign-In button. https://developers.google.com/identity/sign-in/web/build-button (using API https://apis.google.com/js/api:client.js) This API shows deprecation warnings, hence the switch.

Using the code below, I have made a Google Sign-In button that works.

Unfortunately there are a few caveats that I cannot seem to figure out how to remedy:

1. No apparent method to customise the look (remove the button border, change the font, etc.)
2. No apparent method to make an entirely custom styled button
3. Poor locale support (the button loads the 'en_US' locale, blinks and then shows the selected 'sv_SE' locale)

CODE:

useEffect(() => {
    // I have checked that this call returns a valid google-client-id
    const googleClientId = Config.get('google-client-id');

    const startApp = () => {
      const handleClientLoad = () => {
        (window as any).google.accounts.id.initialize({
          callback: handleCredentialResponse,
          client_id: googleClientId,
        });
        renderButton();
      };

      const handleCredentialResponse = (response: any) => {
        // Code to handle response
      };

      const renderButton = () => {
        (window as any).google.accounts.id.renderButton(
          document.getElementById('google-signin-btn'),
          {
            height: '40px',
            locale: 'sv_SE',
            shape: 'rectangular',
            size: 'large',
            text: 'sign_in_with',
            theme: 'outline_white',
            type: 'short',
            width: '150px',
          },
        );
      };

      // Make sure the API is loaded before rendering the button
      if (
        typeof (window as any).google !== 'undefined' &&
        (window as any).google.accounts
      ) {
        handleClientLoad();
      } else {
        // Make sure to load the API
        const script = document.createElement('script');
        script.src = 'https://accounts.google.com/gsi/client';
        script.async = true;
        script.onload = handleClientLoad;
        document.body.appendChild(script);
      }
    };

    startApp();
  }, []);

   return(
      <div id="google-signin-btn"></div>
   )

Unfortunately the documentation I have found is very sparse (lacks code examples) and does not explain how to adjust the styling, and/or how to create a custom design sign in button.

Any help much appreciated! :D /K