ReactJS не поддерживает фильтры svg?

Question

Написала фильтр внутренней тени, но, к сожалению, дает ошибку()

export function InnerShadow(props:InnerShadowProps):ReactElement<any> { 
    return (
     <defs> 
      <filter id="inner-shadow" x="-50%" y="-50%" width="200%" height="200%"> 
       <feComponentTransfer in=SourceAlpha> // : error TS1005: '{' expected. 
        <feFuncA type="table" tableValues="1 0"/> 
       </feComponentTransfer> // : error TS1005: '}' expected. 
       <feGaussianBlur stdDeviation="5"/> 
       <feOffset dx="0" dy="0" result="offsetblur"/> 
       <feFlood flood-color="rgb(0, 0, 0)" result="color"/> 
       <feComposite in2="offsetblur" operator="in"/> 
       <feComposite in2="SourceAlpha" operator="in" /> 
       <feMerge> 
        <feMergeNode in="SourceGraphic" /><feMergeNode /> 
       </feMerge> 
      </filter> 
     </defs> 
    ); 
} 

И в documentation из я не нашел.

Вопрос: я что-то пропустил или ReactJS не поддерживает фильтры, и мой фильтр никогда не будет работать?

Answer 1

Вы забыли указать атрибут in в компоненте feComponentTransfer.

Компонент должен выглядеть следующим образом

<feComponentTransfer in="SourceAlpha"> 

Вместо

<feComponentTransfer in=SourceAlpha>