feat(components): 添加分割线组件

- 实现了一个通用的分割线组件,支持水平和垂直方向
- 添加了淡入淡出效果的可选属性
- 组件使用 SolidJS 进行构建
This commit is contained in:
Vixalie
2025-08-13 22:37:07 +08:00
parent 42d5c7d28f
commit 867e5f03f1

View File

@@ -0,0 +1,29 @@
import cx from 'clsx';
import { Component, mergeProps } from 'solid-js';
interface DividerProps {
direction?: 'horizontal' | 'vertical';
faded?: boolean;
}
const Divider: Component<DividerProps> = (props) => {
const mProps = mergeProps<DividerProps[]>(
{
direction: 'horizontal',
faded: false,
},
props,
);
return (
<hr
class={cx(
'border-solid',
mProps.direction === 'horizontal' ? 'w-full border-t' : 'h-full border-l',
mProps.faded ? 'border-outline/38' : 'border-outline',
)}
/>
);
};
export default Divider;