module import { extend } from 'typestyle' ; import { BoxAlignProperty , AlignItemsProperty , GlobalsNumber , JustifyContentProperty , FlexWrapProperty } from 'csstype' ; import * as types from 'typestyle/lib/types' ; declare module 'typestyle/lib/types' { interface CSSProperties { '-ms-flex-align' ? : BoxAlignProperty ; '-ms-flex-item-align' ? : AlignItemsProperty ; '-ms-flex-wrap' ? : FlexWrapProperty ; '-ms-flex-negative' ? : GlobalsNumber ; '-ms-flex-pack' ? : JustifyContentProperty ; } } /**
 * If you have more than one child prefer horizontal,vertical
 */ export var flexRoot = { display : [ '-ms-flexbox' , '-webkit-flex' , 'flex' , ] } ; /**
 * A general grouping component that has no impact on the parent flexbox properties e.g.
 * <vertical>
 *    <pass>
 *       <content/>
 *    </pass>
 * </vertical>
 */ export var pass = { display : 'inherit' , '-ms-flex-direction' : 'inherit' , '-webkit-flex-direction' : 'inherit' , flexDirection : 'inherit' , '-ms-flex-positive' : 1 , '-webkit-flex-grow' : 1 , flexGrow : 1 , } ; export var inlineRoot = { display : [ '-ms-inline-flexbox' , '-webkit-inline-flex' , 'inline-flex' ] } ; export const horizontal = extend ( flexRoot , { '-ms-flex-direction' : 'row' , '-webkit-flex-direction' : 'row' , flexDirection : 'row' } ) ; export const vertical = extend ( flexRoot , { '-ms-flex-direction' : 'column' , '-webkit-flex-direction' : 'column' , flexDirection : 'column' } ) ; export var wrap = { '-ms-flex-wrap' : 'wrap' , '-webkit-flex-wrap' : 'wrap' , flexWrap : 'wrap' } ; /**
 * If you want items to be sized automatically by their children use this
 * This is because of a bug in various flexbox implementations: http://philipwalton.com/articles/normalizing-cross-browser-flexbox-bugs/
 * Specifically bug 1 : https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored
 */ export var content = { '-ms-flex-negative' : 0 , '-webkit-flex-shrink' : 0 , flexShrink : 0 , flexBasis : 'auto' , } ; export var flex = { '-ms-flex' : 1 , '-webkit-flex' : 1 , flex : 1 } ; export var flex1 = flex ; export var flex2 = { '-ms-flex' : 2 , '-webkit-flex' : 2 , flex : 2 } ; export var flex3 = { '-ms-flex' : 3 , '-webkit-flex' : 3 , flex : 3 } ; export var flex4 = { '-ms-flex' : 4 , '-webkit-flex' : 4 , flex : 4 } ; export var flex5 = { '-ms-flex' : 5 , '-webkit-flex' : 5 , flex : 5 } ; export var flex6 = { '-ms-flex' : 6 , '-webkit-flex' : 6 , flex : 6 } ; export var flex7 = { '-ms-flex' : 7 , '-webkit-flex' : 7 , flex : 7 } ; export var flex8 = { '-ms-flex' : 8 , '-webkit-flex' : 8 , flex : 8 } ; export var flex9 = { '-ms-flex' : 9 , '-webkit-flex' : 9 , flex : 9 } ; export var flex10 = { '-ms-flex' : 10 , '-webkit-flex' : 10 , flex : 10 } ; export var flex11 = { '-ms-flex' : 11 , '-webkit-flex' : 11 , flex : 11 } ; export var flex12 = { '-ms-flex' : 12 , '-webkit-flex' : 12 , flex : 12 } ; export var start = { '-ms-flex-align' : 'start' , '-webkit-align-items' : 'flex-start' , alignItems : 'flex-start' } ; export var center = { '-ms-flex-align' : 'center' , '-webkit-align-items' : 'center' , alignItems : 'center' } ; export var end = { '-ms-flex-align' : 'end' , '-webkit-align-items' : 'flex-end' , alignItems : 'flex-end' } ; export var startJustified = { '-ms-flex-pack' : 'start' , '-webkit-justify-content' : 'flex-start' , justifyContent : 'flex-start' } ; export var centerJustified = { '-ms-flex-pack' : 'center' , '-webkit-justify-content' : 'center' , justifyContent : 'center' } ; export var endJustified = { '-ms-flex-pack' : 'end' , '-webkit-justify-content' : 'flex-end' , justifyContent : 'flex-end' } ; export var aroundJustified = { '-ms-flex-pack' : 'distribute' , '-webkit-justify-content' : 'space-around' , justifyContent : 'space-around' } ; export var betweenJustified = { '-ms-flex-pack' : 'justify' , '-webkit-justify-content' : 'space-between' , justifyContent : 'space-between' } ; export var centerCenter = extend ( flexRoot , center , centerJustified ) ; export var selfStart = { '-ms-flex-item-align' : 'start' , '-webkit-align-self' : 'flex-start' , alignSelf : 'flex-start' } ; export var selfCenter = { '-ms-flex-item-align' : 'center' , '-webkit-align-self' : 'center' , alignSelf : 'center' } ; export var selfEnd = { '-ms-flex-item-align' : 'end' , '-webkit-align-self' : 'flex-end' , alignSelf : 'flex-end' } ; export var selfStretch = { '-ms-flex-item-align' : 'stretch' , '-webkit-align-self' : 'stretch' , alignSelf : 'stretch' , } ;