xref: /MusicFree/src/components/base/divider.tsx (revision 9fa6839149774f0c1a66d49740e36b51597860db)
1e650bfb3S猫头猫import React from 'react';
2*9fa68391S猫头猫import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native';
3e650bfb3S猫头猫import useColors from '@/hooks/useColors';
4e650bfb3S猫头猫
5e650bfb3S猫头猫interface IDividerProps {
6e650bfb3S猫头猫    vertical?: boolean;
7*9fa68391S猫头猫    style?: StyleProp<ViewStyle>;
8e650bfb3S猫头猫}
9e650bfb3S猫头猫export default function Divider(props: IDividerProps) {
10e650bfb3S猫头猫    const {vertical, style} = props;
11e650bfb3S猫头猫    const colors = useColors();
12e650bfb3S猫头猫
13e650bfb3S猫头猫    return (
14e650bfb3S猫头猫        <View
15e650bfb3S猫头猫            style={[
16e650bfb3S猫头猫                vertical ? css.dividerVertical : css.divider,
17e650bfb3S猫头猫                {
18e650bfb3S猫头猫                    backgroundColor: colors.divider ?? '#999999',
19e650bfb3S猫头猫                },
20e650bfb3S猫头猫                style,
21e650bfb3S猫头猫            ]}
22e650bfb3S猫头猫        />
23e650bfb3S猫头猫    );
24e650bfb3S猫头猫}
25e650bfb3S猫头猫
26e650bfb3S猫头猫const css = StyleSheet.create({
27e650bfb3S猫头猫    divider: {
28e650bfb3S猫头猫        width: '100%',
29e650bfb3S猫头猫        height: 1,
30e650bfb3S猫头猫    },
31e650bfb3S猫头猫    dividerVertical: {
32e650bfb3S猫头猫        height: '100%',
33e650bfb3S猫头猫        width: 1,
34e650bfb3S猫头猫    },
35e650bfb3S猫头猫});
36