You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
By default, text is quite plain and has no background color. You can make it appear as a "badge" instead using the `badge()` method. A great use case for this is with statuses, where may want to display a badge with a [color](#customizing-the-color) that matches the status:
23
-
24
-
```php
25
-
use Filament\Infolists\Components\TextEntry;
26
-
27
-
TextEntry::make('status')
28
-
->badge()
29
-
->color(fn (string $state): string => match ($state) {
30
-
'draft' => 'gray',
31
-
'reviewing' => 'warning',
32
-
'published' => 'success',
33
-
'rejected' => 'danger',
34
-
})
35
-
```
36
-
37
-
<AutoScreenshotname="infolists/entries/text/badge"alt="Text entry as badge"version="4.x" />
38
-
39
-
You may add other things to the badge, like an [icon](#adding-an-icon).
40
-
41
-
Optionally, you may pass a boolean value to control if the text should be in a badge or not:
42
-
43
-
```php
44
-
use Filament\Infolists\Components\TextEntry;
45
-
46
-
TextEntry::make('status')
47
-
->badge(FeatureFlag::active())
48
-
```
49
-
50
-
<UtilityInjectionset="infolistEntries"version="4.x">As well as allowing a static value, the `badge()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
51
-
52
20
## Customizing the color
53
21
54
22
You may set a [color](../../styling/colors) for the text:
@@ -111,6 +79,38 @@ TextEntry::make('email')
111
79
112
80
<AutoScreenshotname="infolists/entries/text/icon-color"alt="Text entry with icon in the primary color"version="4.x" />
113
81
82
+
## Displaying as a "badge"
83
+
84
+
By default, text is quite plain and has no background color. You can make it appear as a "badge" instead using the `badge()` method. A great use case for this is with statuses, where may want to display a badge with a [color](#customizing-the-color) that matches the status:
85
+
86
+
```php
87
+
use Filament\Infolists\Components\TextEntry;
88
+
89
+
TextEntry::make('status')
90
+
->badge()
91
+
->color(fn (string $state): string => match ($state) {
92
+
'draft' => 'gray',
93
+
'reviewing' => 'warning',
94
+
'published' => 'success',
95
+
'rejected' => 'danger',
96
+
})
97
+
```
98
+
99
+
<AutoScreenshotname="infolists/entries/text/badge"alt="Text entry as badge"version="4.x" />
100
+
101
+
You may add other things to the badge, like an [icon](#adding-an-icon).
102
+
103
+
Optionally, you may pass a boolean value to control if the text should be in a badge or not:
104
+
105
+
```php
106
+
use Filament\Infolists\Components\TextEntry;
107
+
108
+
TextEntry::make('status')
109
+
->badge(FeatureFlag::active())
110
+
```
111
+
112
+
<UtilityInjectionset="infolistEntries"version="4.x">As well as allowing a static value, the `badge()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
113
+
114
114
## Formatting
115
115
116
116
When using a text entry, you may want the actual outputted text in the UI to differ from the raw [state](overview#entry-content-state) of the entry, which is often automatically retrieved from an Eloquent model. Formatting the state allows you to preserve the integrity of the raw data while also allowing it to be presented in a more user-friendly way.
Copy file name to clipboardexpand all lines: packages/schemas/docs/05-primes/02-text.md
+43
Original file line number
Diff line number
Diff line change
@@ -43,3 +43,46 @@ Text::make(
43
43
```
44
44
45
45
<UtilityInjectionset="primeComponents"version="4.x">As well as allowing a static value, the `make()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
46
+
47
+
## Customizing the color
48
+
49
+
You may set a [color](../../styling/colors) for the text:
50
+
51
+
```php
52
+
use Filament\Schemas\Components\Text;
53
+
54
+
Text::make('Information')
55
+
->color('info')
56
+
```
57
+
58
+
<UtilityInjectionset="infolistEntries"version="4.x">As well as allowing a static value, the `color()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
59
+
60
+
<AutoScreenshotname="primes/text/color"alt="Text in the info color"version="4.x" />
61
+
62
+
## Displaying as a "badge"
63
+
64
+
By default, text is quite plain and has no background color. You can make it appear as a "badge" instead using the `badge()` method. A great use case for this is with statuses, where may want to display a badge with a [color](#customizing-the-color) that matches the status:
65
+
66
+
```php
67
+
use Filament\Schemas\Components\Text;
68
+
69
+
Text::make('Warning')
70
+
->color('warning')
71
+
->badge()
72
+
```
73
+
74
+
<AutoScreenshotname="primes/text/badge"alt="Text as badge"version="4.x" />
75
+
76
+
You may add other things to the badge, like an [icon](../../styling/icons).
77
+
78
+
Optionally, you may pass a boolean value to control if the text should be in a badge or not:
79
+
80
+
```php
81
+
use Filament\Schemas\Components\Text;
82
+
83
+
Text::make('Warning')
84
+
->color('warning')
85
+
->badge(FeatureFlag::active())
86
+
```
87
+
88
+
<UtilityInjectionset="infolistEntries"version="4.x">As well as allowing a static value, the `badge()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
0 commit comments