karusic/front/src/ui/VStack.tsx

25 lines
651 B
TypeScript

import { ReactNode, CSSProperties } from "react";
import { Div } from "./Div";
export type VStackProps = {
children: ReactNode;
spacing?: CSSProperties['gap'];
align?: CSSProperties['alignItems'];
style?: Omit<CSSProperties, "gap" | "alignItems">;
};
export const VStack = ({ children, spacing = '8px', align = 'flex-start', style }: VStackProps) => {
return (
<Div
style={{
display: 'flex',
flexDirection: 'row',
alignItems: align,
gap: spacing,
...style,
}}
>
{children}
</Div>
);
};