VSinerva/freesewing
1
0
Fork 0
Code Activity

fix(components): Uniform handling of whitespace in text

Browse source
This commit is contained in:
Joost De Cock 2022-01-16 17:34:51 +01:00
parent 3732f9ea50
commit d4ac7f5b32
2 changed files with 13 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

9
packages/components/src/Draft/Text/index.js
View file

@ -15,7 +15,7 @@ const Text = (props) => {
if (translated.indexOf('\n') !== -1) { if (translated.indexOf('\n') !== -1) {
let key = 0 let key = 0
let lines = translated.split('\n') let lines = translated.split('\n')
text.push(<tspan key={'tspan-' + key}>{lines.shift()}</tspan>) text.push(<tspan key={'tspan-' + key} dangerouslySetInnerHTML={{ __html: lines.shift()}} />)
let lineHeight = (props.point.attributes.get('data-text-lineheight') || 12) * (props.scale || 1) let lineHeight = (props.point.attributes.get('data-text-lineheight') || 12) * (props.scale || 1)
for (let line of lines) { for (let line of lines) {
key++ key++
@ -24,12 +24,11 @@ const Text = (props) => {
key={'tspan-' + key} key={'tspan-' + key}
x={props.point.x} x={props.point.x}
dy={lineHeight} dy={lineHeight}
> dangerouslySetInnerHTML={{ __html: line.toString().replace(/&quot;/g, '"')}}
{line.toString().replace(/&quot;/g, '"')} />
</tspan>
) )
} }
} else text.push(<tspan key="tspan-1">{translated}</tspan>) } else text.push(<tspan key="tspan-1" dangerouslySetInnerHTML={{ __html: translated}} />)
return ( return (
<text <text

10
packages/components/src/Draft/TextOnPath/index.js
View file

@ -19,10 +19,18 @@ const TextOnPath = (props) => {
if (align && align.indexOf('center') > -1) textPathProps.startOffset = '50%' if (align && align.indexOf('center') > -1) textPathProps.startOffset = '50%'
else if (align && align.indexOf('right') > -1) textPathProps.startOffset = '100%' else if (align && align.indexOf('right') > -1) textPathProps.startOffset = '100%'
/*
* We need dangerouslySetInnerHTML here to make sure we have a way to
* add whitespace that works both in the browser as in SVG.
* Whitespace = &#160;
*/
return ( return (
<text> <text>
<textPath {...textPathProps}> <textPath {...textPathProps}>
<tspan {...props.path.attributes.asPropsIfPrefixIs('data-text-')}>{translated}</tspan> <tspan
{...props.path.attributes.asPropsIfPrefixIs('data-text-')}
dangerouslySetInnerHTML={{ __html: translated }}
/>
</textPath> </textPath>
</text> </text>
) )