Having default values for the style prop

[trm217]

I am migrating away from a react icon-library and I am trying to align the API of our icon-components which we generate with SVGR all the while trying to provide a almost identical API for the icon as used in the mentioned library.

Now I have the issue, that I'd like to always have the verticalAlign: "middle" style set, even when a custom style object is being passed. There for I set the following value for the svgProps.style {{ verticalAlign: "middle", ...props.style }}

As you can see in the snippet of my SVGR-config below, I am attempting to merge the style object passed from the props. Unfortunately, that doesn't seem to be working, as I get the following error while running svgr-cli:

: TypeError: Cannot assign to read only property 'message' of object 'SyntaxError: Unexpected token (2:27)
@org/icons:build:   1 | /* @babel/template */;
@org/icons:build: > 2 | { verticalAlign: "middle", ...props.style }

Based on this error I assume that the spread-operator is not allowed.
Is there any specific reason for this behaviour?
I find it rather limiting.

Below you can see a partial of my SVGR-config.

svgProps: {
    fill: "currentColor",
    style: '{{ verticalAlign: "middle", ...props.style }}',
    width: '{props.width || props.size || "1em"}',
    height: '{props.height || props.size || "1em"}',
  },
  indexTemplate: require("./lib/icon-template.cjs"),
  template: (variables, { tpl }) => {
    return tpl`
      ${variables.imports};
      ${variables.interfaces};
      const ${variables.componentName} = (
        props: 
          SVGProps<SVGSVGElement> & 
          {
            // Applies to both the width & height prop
            size?: number | string 
          } 
      ) => (
        ${variables.jsx}
      );

      ${variables.componentName}.displayName = "${variables.componentName}";
      ${variables.exports};
    `
  },