Skip to content

Commit 91e35cd

Browse files
johurul-pimjojohurul-pimjo
authored
Merge pull request #130 from TailGrids/fix/misc
fix(misc): update component styles
2 parents 3d9e242 + c6ed6e9 commit 91e35cd

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+234
-173
lines changed

‎apps/docs/content/components/accordion.mdx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -158,7 +158,7 @@ Wraps all accordion items and controls the overall layout and style.
158158

159159
| Prop | Type | Default | Description |
160160
| ----------- | ----------------------------------------------------------------------------- | ------------- | -------------------------------------- |
161-
| `variant` | `'style_one'`, `'style_two'`, `'style_three'`, `'style_four'`, `'style_five'` | `'style_one'` | Visual style variant for the accordion |
161+
| `variant` | `'style_one' \| 'style_two' \| 'style_three' \| 'style_four' \| 'style_five'` | `'style_one'` | Visual style variant for the accordion |
162162
| `className` | `string` | - | Additional CSS classes |
163163
| `children` | `React.ReactNode` | - | Accordion items |
164164

@@ -173,7 +173,7 @@ A single accordion item that groups a trigger and its content.
173173

174174
| Data Attribute | Values | Description |
175175
| :------------- | :------------------- | :--------------------------------------------------- |
176-
| `data-state` | `"open"`, `"closed"` | Indicates whether the item is expanded or collapsed. |
176+
| `data-state` | `"open" \| "closed"` | Indicates whether the item is expanded or collapsed. |
177177

178178
### AccordionTrigger
179179

@@ -186,7 +186,7 @@ Toggles the visibility of the accordion content.
186186

187187
| Data Attribute | Values | Description |
188188
| :------------- | :------------------- | :--------------------------------------------------- |
189-
| `data-state` | `"open"`, `"closed"` | Indicates whether the item is expanded or collapsed. |
189+
| `data-state` | `"open" \| "closed"` | Indicates whether the item is expanded or collapsed. |
190190

191191
### AccordionContent
192192

@@ -199,7 +199,7 @@ Holds the collapsible content for an accordion item.
199199

200200
| Data Attribute | Values | Description |
201201
| :------------- | :------------------- | :--------------------------------------------------- |
202-
| `data-state` | `"open"`, `"closed"` | Indicates whether the item is expanded or collapsed. |
202+
| `data-state` | `"open" \| "closed"` | Indicates whether the item is expanded or collapsed. |
203203

204204
## Accessibility
205205

‎apps/docs/content/components/alert.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ The `title` prop is optional. When omitted, the message takes precedence and adj
114114

115115
| Prop | Type | Default | Description |
116116
| :------------------ | :------------------------------------------------------- | :---------- | :----------------------------------------- |
117-
| `variant` | `'success'`, `'danger'`, `'info'`, `'warning'`, `'gray'` | `'success'` | Sets the alert style |
117+
| `variant` | `'success' \| 'danger' \| 'info' \| 'warning' \| 'gray'` | `'success'` | Sets the alert style |
118118
| `title` | `string` | - | Optional heading for the alert |
119119
| `message` | `string` | - | Main Alert message (required) |
120120
| `icon` | `ReactNode` | - | The icon to render |

‎apps/docs/content/components/aspect-ratio.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -116,8 +116,8 @@ The AspectRatio component works seamlessly with responsive images. Use `object-c
116116

117117
| Prop | Type | Default | Description |
118118
| :------------ | :---------------------------------------------------------------------------- | :-------- | :------------------------------------------------------------------------------ |
119-
| `ratio` | `'square'`, `'video'`, `'4/3'`, `'3/4'`, `'21/9'`, `'9/16'`, `'3/2'`, `'2/3'` | `'video'` | Predefined aspect ratio variant based on Tailwind CSS classes |
120-
| `customRatio` | `number` | - | Custom aspect ratio value (e.g., `16/9`, `2.35`). Takes precedence over `ratio` |
119+
| `ratio` | `'square' \| 'video' \| '4/3' \| '3/4' \| '21/9' \| '9/16' \| '3/2' \| '2/3'` | `'video'` | Predefined aspect ratio variant based on Tailwind CSS classes |
120+
| `customRatio` | `number` | - | Custom aspect ratio value (e.g., `16/9 \| 2.35`). Takes precedence over `ratio` |
121121
| `className` | `string` | - | Additional CSS classes to apply to the container |
122122
| `children` | `React.ReactNode` | - | Content to display within the aspect ratio container **Required** |
123123

‎apps/docs/content/components/avatar.mdx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -136,19 +136,19 @@ Note: The `AvatarGroup` component implements an overlapping effect using negativ
136136

137137
| Prop | Type | Default | Description |
138138
| :---------- | :---------------------------------------------- | :------- | :------------------------------------------------------------------------- |
139-
| `size` | `'xs'`, `'sm'`, `'md'`, `'lg'`, `'xl'`, `'xxl'` | `'md'` | Sets the size of the avatar |
139+
| `size` | `'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl'` | `'md'` | Sets the size of the avatar |
140140
| `src` | `string` | - | Image URL. If not provided, the fallback is shown |
141141
| `alt` | `string` | - | Image alt text for accessibility |
142142
| `fallback` | `string` | - | Initials or short text shown when `src` is not provided **Required**. |
143-
| `status` | `'none'`, `'online'`, `'offline'`, `'busy'` | `'none'` | Displays a status indicator at the bottom-right corner |
143+
| `status` | `'none' \| 'online' \| 'offline' \| 'busy'` | `'none'` | Displays a status indicator at the bottom-right corner |
144144
| `label` | `{ title: string, subtitle: string }` | - | Optional object containing title and subtitle displayed next to the avatar |
145145
| `className` | `string` | - | Additional CSS classes to apply to the avatar |
146146

147147
### AvatarGroup
148148

149149
| Prop | Type | Default | Description |
150150
| :---------- | :------------------------------------ | :------ | :----------------------------------------------------- |
151-
| `size` | `'xs'`, `'sm'`, `'md'` | `'md'` | Sets the size of avatars in the group |
151+
| `size` | `'xs' \| 'sm' \| 'md'` | `'md'` | Sets the size of avatars in the group |
152152
| `data` | `Array<{ src: string, alt: string }>` | - | Array of avatar data objects to display |
153153
| `className` | `string` | - | Additional CSS classes to apply to the group container |
154154

‎apps/docs/content/components/badge.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -114,8 +114,8 @@ Extends `span` element props.
114114

115115
| Prop | Type | Default | Description |
116116
| ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | ---------------------- |
117-
| `size` | `'sm'`, `'md'`, `'lg'` | `'sm'` | Sets the badge size |
118-
| `color` | `'gray'`, `'primary'`, `'error'`, `'warning'`, `'success'`, `'cyan'`, `'sky'`, `'blue'`, `'violet'`, `'purple'`, `'pink'`, `'rose'`, `'orange'` | `'primary'` | Sets the color scheme |
117+
| `size` | `'sm' \| 'md' \| 'lg'` | `'sm'` | Sets the badge size |
118+
| `color` | `'gray' \| 'primary' \| 'error' \| 'warning' \| 'success' \| 'cyan' \| 'sky' \| 'blue' \| 'violet' \| 'purple' \| 'pink' \| 'rose' \| 'orange'` | `'primary'` | Sets the color scheme |
119119
| `prefixIcon` | `React.ReactNode` | - | Icon before the text |
120120
| `suffixIcon` | `React.ReactNode` | - | Icon after the text |
121121
| `className` | `string` | - | Additional CSS classes |

‎apps/docs/content/components/breadcrumbs.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ Note: The last item in the breadcrumb trail is automatically styled with darker
107107
| Prop | Type | Default | Description |
108108
| :------------ | :------------------------------ | :-------- | :----------------------------------- |
109109
| `items` | `BreadcrumbItem[]` | - | Array of breadcrumb items (required) |
110-
| `dividerType` | `'slash'`, `'chevron'`, `'dot'` | `'slash'` | Style of divider between items |
110+
| `dividerType` | `'slash' \| 'chevron' \| 'dot'` | `'slash'` | Style of divider between items |
111111

112112
`BreadcrumbItem`
113113

‎apps/docs/content/components/button-group.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ Extends `div` element props.
115115

116116
| Prop | Type | Default | Description |
117117
| ----------- | -------------------------- | ----------- | ---------------------- |
118-
| `variant` | `'primary'`, `'secondary'` | `'primary'` | Visual style variant |
119-
| `size` | `'sm'`, `'md'`, `'lg'` | `'md'` | Button group size |
118+
| `variant` | `'primary' \| 'secondary'` | `'primary'` | Visual style variant |
119+
| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Button group size |
120120
| `className` | `string` | - | Additional CSS classes |
121121
| `children` | `React.ReactNode` | - | Button elements |

‎apps/docs/content/components/button.mdx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -152,9 +152,9 @@ Extends `button` element props.
152152

153153
| Prop | Type | Default | Description |
154154
| :----------- | :---------------------------------------------- | :---------- | :------------------------------- |
155-
| `variant` | `'primary'`, `'danger'`, `'success'`, `'ghost'` | `'primary'` | Visual style variant |
156-
| `appearance` | `'fill'`, `'outline'` | `'fill'` | Filled or outlined style |
157-
| `size` | `'xs'`, `'sm'`, `'md'`, `'lg'` | `'md'` | Button size |
155+
| `variant` | `'primary' \| 'danger' \| 'success' \| 'ghost'` | `'primary'` | Visual style variant |
156+
| `appearance` | `'fill' \| 'outline'` | `'fill'` | Filled or outlined style |
157+
| `size` | `'xs' \| 'sm' \| 'md' \| 'lg'` | `'md'` | Button size |
158158
| `iconOnly` | `boolean` | `false` | Icon-only button (square aspect) |
159159
| `className` | `string` | - | Additional CSS classes |
160160
| `children` | `React.ReactNode` | - | Button content |

‎apps/docs/content/components/checkbox.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ Extends `input` element props.
116116

117117
| Prop | Type | Default | Description |
118118
| ---------------- | -------------------------- | ------- | ------------------------------------------------ |
119-
| `size` | `'sm'`, `'md'` | `'sm'` | Checkbox size |
119+
| `size` | `'sm' \| 'md'` | `'sm'` | Checkbox size |
120120
| `label` | `string` | - | Label text next to checkbox |
121121
| `id` | `string` | - | Custom input ID (auto-generated if not provided) |
122122
| `disabled` | `boolean` | `false` | Disable checkbox interaction |

0 commit comments

Comments
 (0)