I am recently using Motion Canvas for my animations. I want to avoid whitespace collapsing in Txt component. I have looked for solution like change the style of whitespace to pre but this is not even an option. This is what I want to do.
interface TextNodeProps {
text: string;
color: string;
}
interface ColorNodeProps {
text: string;
}
const Red = ({text}: ColorNodeProps) => <TextNode text={text} color='#ff0000'/>
const Green = ({text}: ColorNodeProps) => <TextNode text={text} color='#00ff00'/>
const TextNode = ({text, color}: TextNodeProps) => <Txt text={text} fill={color}/>
When I use like this
<Red text='Hello World'/>
It only renders
Hello World
*whitespace collapsed
Rather I want this
Hello world
Any help is appreciated.