You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

45 lines
891 B

/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the CC-BY-4.0 license found
* in the LICENSE file in the root directory of this source tree.
*
* @emails react-core
*/
'use strict';
import {createElement} from 'glamor/react';
/**
* Convenience component for declaring a flexbox layout.
*/
const Flex = ({
basis = 'auto',
children,
direction = 'row',
grow = 0,
halign = 'flex-start',
shrink = 1,
type = 'div',
valign = 'flex-start',
...rest
}) =>
createElement(
type,
{
css: {
display: 'flex',
flexDirection: direction,
flexGrow: grow,
flexShrink: shrink,
flexBasis: basis,
justifyContent: direction === 'row' ? halign : valign,
alignItems: direction === 'row' ? valign : halign,
},
...rest,
},
children,
);
export default Flex;