unordered list docs

Author: danharrin

docs-assets/app/app/Livewire/PrimesDemo.php

@@ -236,6 +236,33 @@ public function primes(Schema $schema): Schema
                             ->tooltip('Scan this QR code with your authenticator app')
                             ->alignCenter(),
                     ]),
+                Group::make()
+                    ->id('unorderedList')
+                    ->extraAttributes([
+                        'class' => 'p-16 max-w-xl',
+                    ])
+                    ->schema([
+                        UnorderedList::make([
+                            Text::make('Tables'),
+                            Text::make('Schemas'),
+                            Text::make('Actions'),
+                            Text::make('Notifications'),
+                        ]),
+                    ]),
+                Group::make()
+                    ->id('unorderedListLarge')
+                    ->extraAttributes([
+                        'class' => 'p-16 max-w-xl',
+                    ])
+                    ->schema([
+                        UnorderedList::make([
+                            Text::make('Tables')->size(TextSize::Large),
+                            Text::make('Schemas')->size(TextSize::Large),
+                            Text::make('Actions')->size(TextSize::Large),
+                            Text::make('Notifications')->size(TextSize::Large),
+                        ])
+                            ->size(TextSize::Large),
+                    ]),
             ]);
     }
 

docs-assets/screenshots/images/dark/primes/unordered-list/large.jpg

@@ -1997,6 +1997,24 @@ export default {
             await new Promise((resolve) => setTimeout(resolve, 500))
         },
     },
+    'primes/unordered-list/simple': {
+        url: 'primes',
+        selector: '#unorderedList',
+        viewport: {
+            width: 1920,
+            height: 640,
+            deviceScaleFactor: 3,
+        },
+    },
+    'primes/unordered-list/large': {
+        url: 'primes',
+        selector: '#unorderedListLarge',
+        viewport: {
+            width: 1920,
+            height: 640,
+            deviceScaleFactor: 3,
+        },
+    },
     'tables/example': {
         url: 'tables?table=example',
         selector: 'body',

docs-assets/screenshots/images/dark/primes/unordered-list/simple.jpg

@@ -526,7 +526,7 @@ TextEntry::make('tags')
 
 ## Customizing the text size
 
-Text columns have small font size by default, but you may change this to `TextSize::ExtraSmall`, `TextSize::Medium`, or `TextSize::Large`.
+Text entries have small font size by default, but you may change this to `TextSize::ExtraSmall`, `TextSize::Medium`, or `TextSize::Large`.
 
 For instance, you may make the text larger using `size(TextSize::Large)`:
 

docs-assets/screenshots/images/light/primes/unordered-list/large.jpg

@@ -80,7 +80,7 @@ IconEntry::make('is_featured')
     ->boolean()
 ```
 
-> If this column in the model class is already cast as a `bool` or `boolean`, Filament is able to detect this, and you do not need to use `boolean()` manually.
+> If this attribute in the model class is already cast as a `bool` or `boolean`, Filament is able to detect this, and you do not need to use `boolean()` manually.
 
 <AutoScreenshot name="infolists/entries/icon/boolean" alt="Icon entry to display a boolean" version="4.x" />
 

docs-assets/screenshots/images/light/primes/unordered-list/simple.jpg

@@ -178,7 +178,7 @@ Text::make('Warning')
 
 ### Customizing the text size
 
-Text columns have small font size by default, but you may change this to `TextSize::ExtraSmall`, `TextSize::Medium`, or `TextSize::Large`.
+Text has a small font size by default, but you may change this to `TextSize::ExtraSmall`, `TextSize::Medium`, or `TextSize::Large`.
 
 For instance, you may make the text larger using `size(TextSize::Large)`:
 
@@ -398,3 +398,46 @@ Image::make(
 <UtilityInjection set="schemaComponents" version="4.x">As well as allowing a static value, the `tooltip()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
 
 <AutoScreenshot name="primes/image/tooltip" alt="Image with a tooltip" version="4.x" />
+
+## Unordered list component
+
+Unordered lists can be inserted into a schema using the `UnorderedList` component. The list items, comprised of [text components](#text-component), are passed to the `make()` method:
+
+```php
+use Filament\Schemas\Components\Text;
+use Filament\Schemas\Components\UnorderedList;
+
+UnorderedList::make([
+    Text::make('Tables'),
+    Text::make('Schemas'),
+    Text::make('Actions'),
+    Text::make('Notifications'),
+])
+```
+
+<UtilityInjection set="schemaComponents" 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>
+
+<AutoScreenshot name="primes/unordered-list/simple" alt="Unordered list" version="4.x" />
+
+## Customizing the bullet size
+
+If you are modifying the text size of the list content, you will probably want to adjust the size of the bullets to match. To do this, you can use the `size()` method. Bullets have small font size by default, but you may change this to `TextSize::ExtraSmall`, `TextSize::Medium`, or `TextSize::Large`.
+
+For instance, you may make the bullets larger using `size(TextSize::Large)`:
+
+```php
+use Filament\Schemas\Components\Text;
+use Filament\Schemas\Components\UnorderedList;
+
+UnorderedList::make([
+    Text::make('Tables')->size(TextSize::Large),
+    Text::make('Schemas')->size(TextSize::Large),
+    Text::make('Actions')->size(TextSize::Large),
+    Text::make('Notifications')->size(TextSize::Large),
+])
+    ->size(TextSize::Large)
+```
+
+<UtilityInjection set="schemaComponents" version="4.x">As well as allowing a static value, the `size()` method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.</UtilityInjection>
+
+<AutoScreenshot name="primes/unordered-list/large" alt="Unordered list with large bullets" version="4.x" />

docs-assets/screenshots/schema.js

@@ -66,7 +66,7 @@ IconColumn::make('is_featured')
     ->boolean()
 ```
 
-> If this column in the model class is already cast as a `bool` or `boolean`, Filament is able to detect this, and you do not need to use `boolean()` manually.
+> If this attribute in the model class is already cast as a `bool` or `boolean`, Filament is able to detect this, and you do not need to use `boolean()` manually.
 
 <AutoScreenshot name="tables/columns/icon/boolean" alt="Icon column to display a boolean" version="4.x" />