Skip to content

RichTextDisplayField: Support inline icon rendering in value array #139

Description

@pglevy

Summary

Current Behavior

The value prop only supports strings and RichTextItem objects (bold, italic, etc.). Inserting an icon requires breaking out of the component entirely and using raw Lucide JSX alongside it.

Desired Behavior

<RichTextDisplayField
  value={[
    { icon: CheckCircle, color: "POSITIVE", size: "STANDARD" },
    " Task completed successfully"
  ]}
/>

Props for inline icon item

  • icon — Lucide icon component
  • color — semantic color (POSITIVE, NEGATIVE, ACCENT, etc.)
  • sizeSMALL / STANDARD / MEDIUM / LARGE
  • altText — for accessibility

SAIL Reference

Notes

  • Icon should be vertically aligned with surrounding text
  • Should work inline within paragraphs and alongside other rich text items

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    Status
    Backlog

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions