Accordion.jsx
1 month ago
Card.jsx
1 month ago
CardSkeleton.jsx
1 month ago
FileUploaderField.jsx
1 month ago
SearchComboBox.jsx
1 month ago
Card.jsx
44 lines
| 1 | import { clsx } from '@admin/utils'; |
| 2 | |
| 3 | export function Card( { className, children } ) { |
| 4 | return ( |
| 5 | <div |
| 6 | className={ clsx( |
| 7 | 'border border-border rounded p-6 mb-8 bg-white', |
| 8 | className |
| 9 | ) } |
| 10 | > |
| 11 | { children } |
| 12 | </div> |
| 13 | ); |
| 14 | } |
| 15 | |
| 16 | Card.Header = function Header( { className, children } ) { |
| 17 | return <div className={ clsx( className ) }>{ children }</div>; |
| 18 | }; |
| 19 | |
| 20 | Card.HeaderTitle = function HeaderTitle( { className, children } ) { |
| 21 | return ( |
| 22 | <h3 className={ clsx( 'text-base font-medium', className ) }> |
| 23 | { children } |
| 24 | </h3> |
| 25 | ); |
| 26 | }; |
| 27 | |
| 28 | Card.HeaderIcon = function HeaderIcon( { |
| 29 | className, |
| 30 | size = 'size-6', |
| 31 | children, |
| 32 | } ) { |
| 33 | return ( |
| 34 | <div |
| 35 | className={ clsx( |
| 36 | 'bg-gray-200 rounded p-3 inline-flex items-center justify-center', |
| 37 | className |
| 38 | ) } |
| 39 | > |
| 40 | <div className={ clsx( size ) }>{ children }</div> |
| 41 | </div> |
| 42 | ); |
| 43 | }; |
| 44 |