| 
									
										
										
										
											2023-05-15 08:51:32 +08:00
										 |  |  | import type { CSSProperties, FC } from 'react' | 
					
						
							|  |  |  | import React from 'react' | 
					
						
							| 
									
										
										
										
											2024-11-22 15:44:42 +08:00
										 |  |  | import { type VariantProps, cva } from 'class-variance-authority' | 
					
						
							|  |  |  | import classNames from '@/utils/classnames' | 
					
						
							| 
									
										
										
										
											2023-05-15 08:51:32 +08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2024-11-26 17:44:56 +08:00
										 |  |  | const dividerVariants = cva('', | 
					
						
							| 
									
										
										
										
											2024-11-22 15:44:42 +08:00
										 |  |  |   { | 
					
						
							|  |  |  |     variants: { | 
					
						
							|  |  |  |       type: { | 
					
						
							| 
									
										
										
										
											2024-11-26 17:44:56 +08:00
										 |  |  |         horizontal: 'w-full h-[0.5px] my-2 ', | 
					
						
							| 
									
										
										
										
											2024-11-22 15:44:42 +08:00
										 |  |  |         vertical: 'w-[1px] h-full mx-2', | 
					
						
							|  |  |  |       }, | 
					
						
							| 
									
										
										
										
											2024-11-26 17:44:56 +08:00
										 |  |  |       bgStyle: { | 
					
						
							|  |  |  |         gradient: 'bg-gradient-to-r from-divider-regular to-background-gradient-mask-transparent', | 
					
						
							|  |  |  |         solid: 'bg-divider-regular', | 
					
						
							|  |  |  |       }, | 
					
						
							| 
									
										
										
										
											2024-11-22 15:44:42 +08:00
										 |  |  |     }, | 
					
						
							|  |  |  |     defaultVariants: { | 
					
						
							|  |  |  |       type: 'horizontal', | 
					
						
							| 
									
										
										
										
											2024-11-26 17:44:56 +08:00
										 |  |  |       bgStyle: 'solid', | 
					
						
							| 
									
										
										
										
											2024-11-22 15:44:42 +08:00
										 |  |  |     }, | 
					
						
							|  |  |  |   }, | 
					
						
							|  |  |  | ) | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2024-12-26 12:01:51 +08:00
										 |  |  | export type DividerProps = { | 
					
						
							| 
									
										
										
										
											2023-05-15 08:51:32 +08:00
										 |  |  |   className?: string | 
					
						
							|  |  |  |   style?: CSSProperties | 
					
						
							| 
									
										
										
										
											2024-11-22 15:44:42 +08:00
										 |  |  | } & VariantProps<typeof dividerVariants> | 
					
						
							| 
									
										
										
										
											2023-05-15 08:51:32 +08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2024-11-26 17:44:56 +08:00
										 |  |  | const Divider: FC<DividerProps> = ({ type, bgStyle, className = '', style }) => { | 
					
						
							| 
									
										
										
										
											2023-05-15 08:51:32 +08:00
										 |  |  |   return ( | 
					
						
							| 
									
										
										
										
											2024-11-26 17:44:56 +08:00
										 |  |  |     <div className={classNames(dividerVariants({ type, bgStyle }), className)} style={style}></div> | 
					
						
							| 
									
										
										
										
											2023-05-15 08:51:32 +08:00
										 |  |  |   ) | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | export default Divider |