<Path> Appears to Break Image

[kylanhurt]

Version 12.1.1

When I try to use <g> attributes it seems to work fine but the <path> attribute seems not to work. Also, onError seems not to be triggered. Can anyone figure out why this SVG image won't load correctly?

<?xml version="1.0" encoding="UTF-8"?>
<svg width="331px" height="221px" version="1.1" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 331.22 121.95">
  <defs>
    <style>.cls-1{fill:#010035;}.cls-2{fill:#571aff;}</style>
  </defs>
  <title>telos-logo</title>
  <path class="cls-1" d="M0,33.08H12.53V5.85H26.06V33.08H42.77v11H26.06v56.13q0,4.51,2.25,6.26a10.28,10.28,0,0,0,6.43,1.75,19.55,19.55,0,0,0,4-.42q2-.41,3.17-.75h.5v11.69q-2.34.5-5.09.83a48.13,48.13,0,0,1-5.76.33q-8.36,0-13.7-3.76t-5.35-12.95V44.1H0Z"/>
  <path class="cls-1" d="M88.07,121.78a41.54,41.54,0,0,1-17.62-3.59,38.36,38.36,0,0,1-13.11-9.77A43.3,43.3,0,0,1,49.15,94a53.82,53.82,0,0,1-2.84-17.62,52.48,52.48,0,0,1,2.92-17.62,43.68,43.68,0,0,1,8.35-14.45A40,40,0,0,1,70.53,34.5,38.26,38.26,0,0,1,87.23,30.9a38.92,38.92,0,0,1,17.12,3.59,34.73,34.73,0,0,1,12.45,10,45.19,45.19,0,0,1,7.6,15.37A70.38,70.38,0,0,1,127,79.52H60.17a43,43,0,0,0,2.34,12.2A31.36,31.36,0,0,0,68,101.57a24.52,24.52,0,0,0,8.52,6.52,27,27,0,0,0,11.53,2.34q9.52,0,15.54-4.43T112,92.71h13.2q-3,14-12.7,21.55T88.07,121.78ZM87.23,41.6a26,26,0,0,0-10.69,2.09,22.48,22.48,0,0,0-7.93,5.85,31.78,31.78,0,0,0-5.35,8.85A40.87,40.87,0,0,0,60.5,69.33h52q-.67-13-7.1-20.38T87.23,41.6Z"/>
  <path class="cls-1" d="M139.39,0h13.53V119.44H139.39Z"/>
  <path class="cls-2" d="M207.6,121.78a47.65,47.65,0,0,1-18.94-3.59A42.36,42.36,0,0,1,165.26,94a50.32,50.32,0,0,1,0-35.25,42.36,42.36,0,0,1,23.4-24.22,51.73,51.73,0,0,1,37.88,0,43,43,0,0,1,14.3,9.77,41.94,41.94,0,0,1,9,14.45,51.71,51.71,0,0,1,0,35.25,41.91,41.91,0,0,1-9,14.45,43,43,0,0,1-14.3,9.77A47.65,47.65,0,0,1,207.6,121.78Z"/><path class="cls-1" d="M297.14,121.95q-17.88,0-27.56-7.94T258.89,91.38h13.87a23.69,23.69,0,0,0,2.84,9.35,17.69,17.69,0,0,0,5.43,5.85,21.59,21.59,0,0,0,7.43,3.09,41.88,41.88,0,0,0,9,.92q10.69,0,15.37-4.09a12.91,12.91,0,0,0,4.68-10.11,13.21,13.21,0,0,0-1.25-6.1,10.46,10.46,0,0,0-4-4.09,27.89,27.89,0,0,0-7-2.84Q301,82.19,295,80.85q-6.35-1.33-12.19-2.84a36.46,36.46,0,0,1-10.27-4.26,21.1,21.1,0,0,1-7.1-7.27Q262.73,62,262.73,55q0-10.86,7.94-17.29t23.14-6.43q16.2,0,24.31,7.18t9.61,19.88H313.85q-1-8.52-5.85-12.45t-14.53-3.93q-9.36,0-13.36,3.59a11.34,11.34,0,0,0-4,8.77,10.19,10.19,0,0,0,1.5,5.76,11.35,11.35,0,0,0,4.51,3.76,33.22,33.22,0,0,0,7.35,2.51q4.34,1,9.86,2.17,6.51,1.34,12.28,2.92a35.51,35.51,0,0,1,10.19,4.51,20.71,20.71,0,0,1,6.93,7.6q2.5,4.68,2.51,12.19a24.92,24.92,0,0,1-2.51,11.44,22.6,22.6,0,0,1-7,8.19,32.48,32.48,0,0,1-10.77,4.93A53.48,53.48,0,0,1,297.14,121.95Z"/>
</svg>

[bohdanprog]

I think it isn't a relevant issue. I tried to render your SVG, and everything worked well. Here is an example:

 import {SvgCss} from 'react-native-svg/css';
export default function App() {
  return (
    <SvgCss
      xml={`
        <?xml version="1.0" encoding="UTF-8"?>
        <svg width="331px" height="221px" version="1.1" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 331.22 121.95">
          <defs>
            <style>.cls-1{fill:#010035;}.cls-2{fill:#571aff;}</style>
          </defs>
          <title>telos-logo</title>
          <path class="cls-1" d="M0,33.08H12.53V5.85H26.06V33.08H42.77v11H26.06v56.13q0,4.51,2.25,6.26a10.28,10.28,0,0,0,6.43,1.75,19.55,19.55,0,0,0,4-.42q2-.41,3.17-.75h.5v11.69q-2.34.5-5.09.83a48.13,48.13,0,0,1-5.76.33q-8.36,0-13.7-3.76t-5.35-12.95V44.1H0Z"/>
          <path class="cls-1" d="M88.07,121.78a41.54,41.54,0,0,1-17.62-3.59,38.36,38.36,0,0,1-13.11-9.77A43.3,43.3,0,0,1,49.15,94a53.82,53.82,0,0,1-2.84-17.62,52.48,52.48,0,0,1,2.92-17.62,43.68,43.68,0,0,1,8.35-14.45A40,40,0,0,1,70.53,34.5,38.26,38.26,0,0,1,87.23,30.9a38.92,38.92,0,0,1,17.12,3.59,34.73,34.73,0,0,1,12.45,10,45.19,45.19,0,0,1,7.6,15.37A70.38,70.38,0,0,1,127,79.52H60.17a43,43,0,0,0,2.34,12.2A31.36,31.36,0,0,0,68,101.57a24.52,24.52,0,0,0,8.52,6.52,27,27,0,0,0,11.53,2.34q9.52,0,15.54-4.43T112,92.71h13.2q-3,14-12.7,21.55T88.07,121.78ZM87.23,41.6a26,26,0,0,0-10.69,2.09,22.48,22.48,0,0,0-7.93,5.85,31.78,31.78,0,0,0-5.35,8.85A40.87,40.87,0,0,0,60.5,69.33h52q-.67-13-7.1-20.38T87.23,41.6Z"/>
          <path class="cls-1" d="M139.39,0h13.53V119.44H139.39Z"/>
          <path class="cls-2" d="M207.6,121.78a47.65,47.65,0,0,1-18.94-3.59A42.36,42.36,0,0,1,165.26,94a50.32,50.32,0,0,1,0-35.25,42.36,42.36,0,0,1,23.4-24.22,51.73,51.73,0,0,1,37.88,0,43,43,0,0,1,14.3,9.77,41.94,41.94,0,0,1,9,14.45,51.71,51.71,0,0,1,0,35.25,41.91,41.91,0,0,1-9,14.45,43,43,0,0,1-14.3,9.77A47.65,47.65,0,0,1,207.6,121.78Z"/><path class="cls-1" d="M297.14,121.95q-17.88,0-27.56-7.94T258.89,91.38h13.87a23.69,23.69,0,0,0,2.84,9.35,17.69,17.69,0,0,0,5.43,5.85,21.59,21.59,0,0,0,7.43,3.09,41.88,41.88,0,0,0,9,.92q10.69,0,15.37-4.09a12.91,12.91,0,0,0,4.68-10.11,13.21,13.21,0,0,0-1.25-6.1,10.46,10.46,0,0,0-4-4.09,27.89,27.89,0,0,0-7-2.84Q301,82.19,295,80.85q-6.35-1.33-12.19-2.84a36.46,36.46,0,0,1-10.27-4.26,21.1,21.1,0,0,1-7.1-7.27Q262.73,62,262.73,55q0-10.86,7.94-17.29t23.14-6.43q16.2,0,24.31,7.18t9.61,19.88H313.85q-1-8.52-5.85-12.45t-14.53-3.93q-9.36,0-13.36,3.59a11.34,11.34,0,0,0-4,8.77,10.19,10.19,0,0,0,1.5,5.76,11.35,11.35,0,0,0,4.51,3.76,33.22,33.22,0,0,0,7.35,2.51q4.34,1,9.86,2.17,6.51,1.34,12.28,2.92a35.51,35.51,0,0,1,10.19,4.51,20.71,20.71,0,0,1,6.93,7.6q2.5,4.68,2.51,12.19a24.92,24.92,0,0,1-2.51,11.44,22.6,22.6,0,0,1-7,8.19,32.48,32.48,0,0,1-10.77,4.93A53.48,53.48,0,0,1,297.14,121.95Z"/>
        </svg>
        `}
    />
  );
}

But if you still have any questions, feel free to ask them.