Почему не отображается иконка спрайта SVG?

Question

[Валентин Попов]

У меня есть спрайт следующего вида:

<div id="sprite" style="display: none">
     <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
          <symbol id="arrow-main-slider" viewBox="0 0 26 39">
                <g opacity="0.3" filter="url(#filter0_d)">
                <path d="M4 17.4999C4 16.9444 4.21608 16.3889 4.64734 15.9653L18.225 2.63594C19.0888 1.78802 20.4891 1.78802 21.3525 2.63594C22.2158 3.48352 22.2158 4.858 21.3525 5.70599L9.33817 17.4999L21.3521 29.294C22.2154 30.1419 22.2154 31.5162 21.3521 32.3637C20.4887 33.2121 19.0883 33.2121 18.2246 32.3637L4.64693 19.0346C4.21559 18.6108 4 18.0553 4 17.4999Z"/>
                </g>
                <defs>
                <filter id="filter0_d" x="0" y="0" width="26" height="39" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"/>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
                <feOffset dy="2"/>
                <feGaussianBlur stdDeviation="2"/>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0"/>
                <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
                <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
                </filter>
                </defs>
                </symbol>
          </svg>
    </div>

Вывожу иконку из спрайта следующим видом:

<svg class="icon-svg">
     <use xlink:href="#arrow-main-slider"></use>
 </svg>

Иконка не отображается. Я подозреваю, что это из-за фильтра который встроен в спрайт
<g opacity="0.3" filter="url(#filter0_d)">
Помогите решить проблему, из-за чего не отображается иконка из спрайта.