ObjectUIComponentsBasic
Span (Deprecated)
Inline container - use Badge or text components instead
⚠️ Deprecated Component
The Span component is deprecated. Please use Shadcn components instead:
- For badges/labels: use
badgecomponent - For inline text emphasis: use
textcomponent with appropriate className
The Span component is an inline container. It is now deprecated in favor of semantic Shadcn-based components that provide better accessibility and design system integration.
Migration Guide
Instead of using span, use these Shadcn alternatives:
For Badges → Use badge
Default Badge
Secondary Badge
For Status Indicators → Use badge with variants
Status Badges
For Inline Text → Use text with className
Text Component
Old Examples (Deprecated)
Below are the old span examples. Please migrate to the alternatives shown above.
Schema
// ⚠️ DEPRECATED - Use Badge or Text components instead
interface SpanSchema {
type: 'span';
// Content
value?: string; // Text content
children?: SchemaNode | SchemaNode[]; // Child components
body?: SchemaNode | SchemaNode[]; // Alternative content prop
// Styling
className?: string; // Tailwind CSS classes
// Base properties
id?: string;
visible?: boolean | string;
testId?: string;
}