Svg Icons component

This Vue component is designed to handle SVG icons in a Vue application. It uses the SVG symbol element to define reusable icons and leverages Vue’s reactivity system to dynamically generate these symbols while applying seo tags.

Props

| Name | Type | Description | |:-------------|:---------|:-----------------------------------------------------------------------------------------------| | data-icons | object | Required. Icons in object format with paths as keys and html content as value | | data-seo | object | Object containing title and description that will be applied as tags inside the symbol element |

Usage/Examples

icons = { "../icons/icon-close.svg": "<svg\n viewBox="0 0 24 24"\n xmlns="http://www.w3.org/2000/svg"\n fill="currentColor"\n>\n <path\n d="M18.71,17.29a1,1,0,0,1,0,1.42,1,1,0,0,1-1.42,0L12,13.41l-5.29,5.3a1,1,0,0,1-1.42,0,1,1,0,0,1,0-1.42L10.59,12,5.29,6.71A1,1,0,0,1,6.71,5.29L12,10.59l5.29-5.3a1,1,0,1,1,1.42,1.42L13.41,12Z"\n />\n\n", }

<svg-icons-cmp :data-icons="icons" :data-seo="seo" />