@jouwomgeving/ui-flex

Flex

$ npm install @jouwomgeving/ui-flex

Usage

import Flex from '@jouwomgeving/ui-flex';
import * as Button from '@jouwomgeving/ui-form';

function Buttons() {
  return (
    <Flex spacing="thin">
      <Button.default label="1" />
      <Button.default label="2" />
      <Button.default label="3" />
      <Button.default label="4" />
      <Button.default label="5" />
      <Button.default label="6" />
    </Flex>
  );
}

export default Buttons;

About

A component which tends to make it easier to keep same margins between all the component within dictator.

The used margins are:

• thin 10px
• wide 20px

Properties

Prop	Values	Default	Required
spacing	false, thin, wide	false	Yes
direction	horizontal, vertical	horizontal	Yes
fill	boolean	false	No
children	ReactElement	undefined	true