#Text Component

#Introduction

The text component provides a simple and consistent way to display text content with proper styling and theme support, and serves as a foundational text element for consistent typography across your application.

#Installation

Use the fluxtor artisan command to install the text component easily:

php artisan fluxtor:install text

#Basic Usage

<x-ui.text>
    This is a basic text component with default styling.
</x-ui.text>

#Text Variations

#Default Text

<x-ui.text>
    Standard text with default small size and neutral colors.
</x-ui.text>

#Custom Sized Text

<x-ui.text class="text-xs">Extra small text content</x-ui.text>
<x-ui.text>Default small text content</x-ui.text>
<x-ui.text class="text-base">Base sized text content</x-ui.text>
<x-ui.text class="text-lg">Large text content</x-ui.text>
<x-ui.text class="text-xl">Extra large text content</x-ui.text>

#Styling Variations

#Muted Text

<x-ui.text>Regular text content</x-ui.text>
<x-ui.text class="opacity-75">Slightly muted text content</x-ui.text>
<x-ui.text class="opacity-50">More muted text content</x-ui.text>

#Emphasized Text

<x-ui.text class="font-medium">Medium weight text</x-ui.text>
<x-ui.text class="font-semibold">Semibold text</x-ui.text>
<x-ui.text class="italic">Italic text</x-ui.text>
<x-ui.text class="uppercase tracking-wide">Uppercase text</x-ui.text>

#Component Props

#Default Styles

The text component comes with these default styles:

• Color: text-neutral-950 (dark) / text-neutral-50 (light mode)
• Size: text-sm (small text)