Svgr: Add titleProp option

Created on 12 May 2018  ·  2Comments  ·  Source: gregberge/svgr

As mentioned in #75, it would be nice to be able to specify a title using props. To do it, my proposition is to add a boolean option "titleProp" defaulting to false. When activated, user would be able to specify the title of the SVG using props.

Usage in command line

svgr --title-prop

Usage in Node / Webpack

transform("...", { titleProp: true })

Usage in React, when the option is activated

import SvgrComponent from './SvgrComponent'

<SvgrComponent title="This is a title" />
// The output will be:
// <svg><title>This is a title</title></svg>
// Instead of:
// <svg title="This is a title" />

Most helpful comment

Yes I think it is a good idea, why not in future.

All 2 comments

@neoziro, instead of this can we just pass as below, this will support ARIA as well -

<SvgrComponent aria-labelledby='fancy-svg-id'>
    <title id='fancy-svg-id'> Title goes here </title>
</SvgrComponent>

Yes I think it is a good idea, why not in future.

Was this page helpful?
0 / 5 - 0 ratings