Skip to content

Commit e8a2f04

Browse files
committed
minor #2728 [Toolkit] Improve descriptions of Shadcn components (Kocal)
This PR was squashed before being merged into the 2.x branch. Discussion ---------- [Toolkit] Improve descriptions of Shadcn components | Q | A | ------------- | --- | Bug fix? | no | New feature? | no <!-- please update src/**/CHANGELOG.md files --> | Docs? | no <!-- required for new features --> | Issues | Fix #... <!-- prefix each issue number with "Fix #", no need to create an issue if none exist, explain below instead --> | License | MIT <!-- Replace this notice by a description of your feature/bugfix. This will help reviewers and should be a good start for the documentation. Additionally (see https://symfony.com/releases): - Always add tests and ensure they pass. - For new features, provide some code snippets to help understand usage. - Features and deprecations must be submitted against branch main. - Update/add documentation as required (we can help!) - Changelog entry should follow https://symfony.com/doc/current/contributing/code/conventions.html#writing-a-changelog-entry - Never break backward compatibility (see https://symfony.com/bc). --> Commits ------- e3e5e90 [Toolkit] Improve descriptions of Shadcn components
2 parents eb9d397 + e3e5e90 commit e8a2f04

17 files changed

+39
-39
lines changed

src/Toolkit/kits/shadcn/docs/components/Alert.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Alert
22

3-
Displays a callout for user attention.
3+
A notification component that displays important messages with an icon, title, and description.
44

55
```twig {"preview":true}
66
<twig:Alert class="max-w-lg">
@@ -44,4 +44,4 @@ Displays a callout for user attention.
4444
Your session has expired. Please log in again.
4545
</twig:Alert:Description>
4646
</twig:Alert>
47-
```
47+
```

src/Toolkit/kits/shadcn/docs/components/AspectRatio.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
# AspectRatio
22

3-
The AspectRatio component is a component that allows you to display an element with a specific aspect ratio.
3+
A container that maintains a specific width-to-height ratio for its content.
44

55
```twig {"preview":true,"height":"400px"}
66
<twig:AspectRatio ratio="1 / 1" class="max-w-[300px]">
7-
<img
8-
src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&amp;dpr=2&amp;q=80"
7+
<img
8+
src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&amp;dpr=2&amp;q=80"
99
alt="Landscape photograph by Tobias Tullius"
1010
class="h-full w-full rounded-md object-cover"
1111
/>
@@ -26,8 +26,8 @@ The AspectRatio component is a component that allows you to display an element w
2626

2727
```twig {"preview":true,"height":"400px"}
2828
<twig:AspectRatio ratio="1 / 1" class="max-w-[350px]">
29-
<img
30-
src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&amp;dpr=2&amp;q=80"
29+
<img
30+
src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&amp;dpr=2&amp;q=80"
3131
alt="Landscape photograph by Tobias Tullius"
3232
class="h-full w-full rounded-md object-cover"
3333
/>
@@ -38,8 +38,8 @@ The AspectRatio component is a component that allows you to display an element w
3838

3939
```twig {"preview":true,"height":"400px"}
4040
<twig:AspectRatio ratio="16 / 9" class="max-w-[350px]">
41-
<img
42-
src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&amp;dpr=2&amp;q=80"
41+
<img
42+
src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&amp;dpr=2&amp;q=80"
4343
alt="Landscape photograph by Tobias Tullius"
4444
class="h-full w-full rounded-md object-cover"
4545
/>

src/Toolkit/kits/shadcn/docs/components/Avatar.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Avatar
22

3-
A component for displaying user profile images with a fallback for when the image is not available.
3+
A circular element that displays a user's profile image or initials as a fallback.
44

55
```twig {"preview":true}
66
<twig:Avatar>
@@ -53,4 +53,4 @@ A component for displaying user profile images with a fallback for when the imag
5353
<twig:Avatar:Text class="bg-red-500 text-red-50">FP</twig:Avatar:Text>
5454
</twig:Avatar>
5555
</div>
56-
```
56+
```

src/Toolkit/kits/shadcn/docs/components/Badge.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Badge
22

3-
A component for displaying short pieces of information, such as counts, labels, or status indicators.
3+
A small element that displays status, counts, or labels with optional icons.
44

55
```twig {"preview":true}
66
<twig:Badge>Badge</twig:Badge>
@@ -53,4 +53,4 @@ A component for displaying short pieces of information, such as counts, labels,
5353
<twig:ux:icon name="lucide:check" class="mr-1 h-3 w-3" />
5454
Verified
5555
</twig:Badge>
56-
```
56+
```

src/Toolkit/kits/shadcn/docs/components/Breadcrumb.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Breadcrumb
22

3-
A navigation component that displays the current page's location within a website's hierarchy.
3+
A navigation element that shows the current page's location in the site hierarchy with clickable links.
44

55
```twig {"preview":true}
66
<twig:Breadcrumb>

src/Toolkit/kits/shadcn/docs/components/Button.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Button
22

3-
A button component that can be used to trigger actions or events.
3+
A clickable element that triggers actions or events, supporting various styles and states.
44

55
```twig {"preview":true}
66
<twig:Button>
@@ -30,58 +30,58 @@ A button component that can be used to trigger actions or events.
3030

3131
```twig {"preview":true}
3232
<twig:Button>Button</twig:Button>
33-
```
33+
```
3434

3535
### Secondary
3636

3737
```twig {"preview":true}
3838
<twig:Button variant="outline">Outline</twig:Button>
39-
```
39+
```
4040

4141
### Destructive
4242

4343
```twig {"preview":true}
4444
<twig:Button variant="destructive">Destructive</twig:Button>
45-
```
45+
```
4646

4747
### Outline
4848

4949
```twig {"preview":true}
5050
<twig:Button variant="outline">Outline</twig:Button>
51-
```
51+
```
5252

5353
### Ghost
5454

5555
```twig {"preview":true}
5656
<twig:Button variant="ghost">Ghost</twig:Button>
57-
```
57+
```
5858

5959
### Link
6060

6161
```twig {"preview":true}
6262
<twig:Button variant="link">Link</twig:Button>
63-
```
63+
```
6464

6565
### Icon
6666

6767
```twig {"preview":true}
6868
<twig:Button variant="outline" size="icon">
6969
<twig:ux:icon name="lucide:chevron-right" />
7070
</twig:Button>
71-
```
71+
```
7272

7373
### With Icon
7474

7575
```twig {"preview":true}
7676
<twig:Button>
7777
<twig:ux:icon name="lucide:mail" /> Login with Email
7878
</twig:Button>
79-
```
79+
```
8080

8181
### Loading
8282

8383
```twig {"preview":true}
8484
<twig:Button disabled>
8585
<twig:ux:icon name="lucide:loader-2" class="animate-spin" /> Please wait
8686
</twig:Button>
87-
```
87+
```

src/Toolkit/kits/shadcn/docs/components/Card.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Card
22

3-
A container component for displaying content in a clear, structured format with optional header, content, and footer sections.
3+
A container that groups related content and actions into a box with optional header, content, and footer sections.
44

55
```twig {"preview":true,"height":"300px"}
66
<twig:Card class="w-[350px]">
@@ -71,14 +71,14 @@ A container component for displaying content in a clear, structured format with
7171
{{ notification.description }}
7272
</p>
7373
</div>
74-
</div>
74+
</div>
7575
{%- endfor -%}
7676
</twig:Card:Content>
7777
<twig:Card:Footer>
7878
<twig:Button class="w-full">
79-
<twig:ux:icon name="lucide:check" />
79+
<twig:ux:icon name="lucide:check" />
8080
Mark all as read
8181
</twig:Button>
8282
</twig:Card:Footer>
8383
</twig:Card>
84-
```
84+
```

src/Toolkit/kits/shadcn/docs/components/Input.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Input
22

3-
A form input component for text, email, password, and other input types.
3+
A form control that allows users to enter text, numbers, or select files.
44

55
```twig {"preview":true}
66
<twig:Input type="email" placeholder="Email" class="max-w-sm" />

src/Toolkit/kits/shadcn/docs/components/Label.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Label
22

3-
A component for labeling form elements and other content.
3+
A text element that identifies form controls and other content.
44

55
```twig {"preview":true}
66
<div class="flex items-center space-x-2">

src/Toolkit/kits/shadcn/docs/components/Pagination.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Pagination
22

3-
A component for navigating through paginated content with page numbers and navigation controls.
3+
A navigation component that displays page numbers and controls for moving between pages.
44

55
```twig {"preview":true}
66
<twig:Pagination>

src/Toolkit/kits/shadcn/docs/components/Progress.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Progress
22

3-
A component for displaying progress of a task or operation.
3+
A visual indicator that shows the completion status of a task or operation.
44

55
```twig {"preview":true}
66
<twig:Progress value="33" />

src/Toolkit/kits/shadcn/docs/components/Select.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Select
22

3-
A form component for selecting an option from a dropdown list.
3+
A dropdown control that allows users to choose from a list of options.
44

55
```twig {"preview":true}
66
<twig:Select class="max-w-sm">

src/Toolkit/kits/shadcn/docs/components/Separator.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Separator
22

3-
A component for creating visual separators between content.
3+
A visual divider that creates space between content elements, available in horizontal and vertical orientations.
44

55
```twig {"preview":true}
66
<div class="max-w-sm">

src/Toolkit/kits/shadcn/docs/components/Skeleton.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Skeleton
22

3-
A component for displaying a loading state with a placeholder animation.
3+
A placeholder element that displays a loading state with an animated background.
44

55
```twig {"preview":true}
66
<div class="flex items-center space-x-4">

src/Toolkit/kits/shadcn/docs/components/Switch.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Switch
22

3-
A toggle switch component for boolean input.
3+
A toggle control that switches between on and off states.
44

55
```twig {"preview":true}
66
<div class="flex items-center space-x-2">

src/Toolkit/kits/shadcn/docs/components/Table.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Table
22

3-
A component for displaying structured data in rows and columns with support for headers, captions, and customizable styling.
3+
A structured grid element that organizes data into rows and columns, supporting headers, captions, and footers.
44

55
```twig {"preview":true,"height":"400px"}
66
{%- set invoices = [
@@ -80,4 +80,4 @@ A component for displaying structured data in rows and columns with support for
8080
</twig:Table:Row>
8181
</twig:Table:Footer>
8282
</twig:Table>
83-
```
83+
```

src/Toolkit/kits/shadcn/docs/components/Textarea.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Textarea
22

3-
A multi-line text input component for longer text content.
3+
A form control for entering multiple lines of text.
44

55
```twig {"preview":true}
66
<twig:Textarea placeholder="Type your message here." class="max-w-sm" />

0 commit comments

Comments
 (0)