Components/HFlow

Default

Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque incidunt esse consectetur suscipit facilis animi, libero enim cum, repellat veniam mollitia totam ex quae impedit numquam consequatur illum! Ea, consequatur?

Story Source

<HFlow
  alignItems="center"
  hSpacing={1}
  justifyContent="flex-start"
>
  <Button
    kind="primary"
    size="medium"
    skin="default"
  >
    Button 1
  </Button>
  <Button
    kind="normal"
    size="medium"
    skin="default"
  >
    Button 2
  </Button>
  <Icon
    icon="infoCircleFilled"
    size={1.5}
  />
  <Text
    component="span"
    variant="main"
  >
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque incidunt esse consectetur suscipit facilis animi, libero enim cum, repellat veniam mollitia totam ex quae impedit numquam consequatur illum! Ea, consequatur?
  </Text>
</HFlow>

Prop Types

"Button" Component

property	propType	required	default
loading	boolean	-	-
block	boolean	-	-
style	Interpolation<undefined>	-	-
skin	oneOf "outline" \| "default" \| "ghost"	-	-
size	oneOf "small" \| "medium" \| "large"	-	-
kind	oneOf "danger" \| "normal" \| "primary"	-	-
onClick	((event: MouseEvent<HTMLButtonElement, MouseEvent>) => void) \| OnClickWithReturn	-	-
innerRef	Ref<HTMLButtonElement>	-	-
component	ElementType<any>	-	-
onLoadingChange	(loading: boolean) => void	-	-

"HFlow" Component

property	propType	required	default
hSpacing	number	-	-
alignItems	oneOf "center" \| "baseline" \| "flex-start" \| "flex-end" \| "stretch"	-	-
justifyContent	oneOf "center" \| "flex-start" \| "flex-end" \| "space-between" \| "space-around" \| "space-evenly"	-	-
style	Interpolation<undefined>	-	-

"Icon" Component

property	propType	required	default
icon	IconImage	yes	-
fill	oneOf "info" \| "success" \| "danger" \| "inherit" \| "none" \| "normal" \| "alert" \| "secondary" \| "disabled" \| "primary"	-	-
stroke	oneOf "info" \| "success" \| "danger" \| "inherit" \| "none" \| "normal" \| "alert" \| "secondary" \| "disabled" \| "primary"	-	-
size	number	-	-
style	Interpolation<undefined>	-	-

"Text" Component

property	propType	required	default
component	ElementType<any>	-	span
variant	oneOf "link" \| "h1" \| "h2" \| "h3" \| "h4" \| "h5" \| "h6" \| "main" \| "secondary" \| "disabled"	-	main
color	oneOf "info" \| "success" \| "danger" \| "inherit" \| "normal" \| "alert" \| "secondary" \| "disabled" \| "primary"	-	-
fontSize	number	-	-
fontWeight	FontWeightProperty	-	-
fontStyle	string	-	-
textDecoration	string	-	-
style	Interpolation<undefined>	-	-

No Preview