36 lines
780 B
TypeScript
36 lines
780 B
TypeScript
import type { JSX } from "solid-js"
|
|
|
|
type ColumnProps = {
|
|
children?: JSX.Element
|
|
gap?: number
|
|
alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
|
|
justifyContent?:
|
|
| "flex-start"
|
|
| "flex-end"
|
|
| "center"
|
|
| "space-between"
|
|
| "space-around"
|
|
| "space-evenly"
|
|
width?: number | "auto" | `${number}%`
|
|
height?: number | "auto" | `${number}%`
|
|
padding?: number
|
|
}
|
|
|
|
export function Column(props: ColumnProps) {
|
|
return (
|
|
<box
|
|
style={{
|
|
flexDirection: "column",
|
|
gap: props.gap,
|
|
alignItems: props.alignItems,
|
|
justifyContent: props.justifyContent,
|
|
width: props.width,
|
|
height: props.height,
|
|
padding: props.padding,
|
|
}}
|
|
>
|
|
{props.children}
|
|
</box>
|
|
)
|
|
}
|