How do you do different colors in text controls?

[ericx2x]

Say you have text that looks like this:

How do you go about adding a span to change this color in the control element of storybook? It only allows for string texts and not any actual elements.

{
      control: {
        type: 'text',
        options: ['Find the right fit.', 'Lorem Ipsum'],
      },
      name: 'title',
      description: 'Change title',
      defaultValue: 'Find the <span>right</span> fit.',
      table: {
        defaultValue: { summary: 'Lorem Ipsum' },
      },
    }

[greg-skorupka]

defaultValue: <>Find the <span>right</span> fit.</>, works I believe to render the span correctly but not so much if try to enter/type your own custom code in storybook

Yeah this one is tricky for a CMS

[ericx2x]

this works. Thanks Greg :)

[greg-skorupka]

maybe escapeHTML: false would help?
#8635