ConceptPortal-public/rsconcept/frontend/src/components/ui/Divider.tsx

33 lines
740 B
TypeScript
Raw Normal View History

import clsx from 'clsx';
2024-05-27 20:42:34 +03:00
import { CProps } from '@/components/props';
export interface DividerProps extends CProps.Styling {
/** Indicates whether the divider is vertical. */
2023-12-28 14:04:44 +03:00
vertical?: boolean;
/** Margins to apply to the divider `classNames`. */
2023-12-28 14:04:44 +03:00
margins?: string;
2023-07-20 17:11:03 +03:00
}
/**
* Divider component that renders a horizontal or vertical divider with customizable margins and styling.
*/
2024-05-27 20:42:34 +03:00
function Divider({ vertical, margins = 'mx-2', className, ...restProps }: DividerProps) {
2023-07-18 14:55:40 +03:00
return (
2023-12-28 14:04:44 +03:00
<div
2024-05-27 20:42:34 +03:00
className={clsx(
margins, //prettier: split-lines
className,
{
'border-x': vertical,
'border-y': !vertical
}
)}
{...restProps}
2023-12-28 14:04:44 +03:00
/>
);
2023-07-18 14:55:40 +03:00
}
2023-12-28 14:04:44 +03:00
export default Divider;