import normalizeColor from './normalizeColor' ; const NUMBER_REG = /^[-+]?\d*\.?\d+$/ ; function convertUnit ( val ) { if ( NUMBER_REG . test ( val ) ) { return parseFloat ( val ) ; } return val ; } function measure ( value , key ) { let direction = [ ] ; if ( typeof value === 'number' ) { direction = [ value , value , value , value ] ; } else if ( typeof value === 'string' ) { direction = value . split ( /\s+/ ) ; switch ( direction . length ) { case 2 : direction [ 2 ] = direction [ 0 ] ; direction [ 3 ] = direction [ 1 ] ; break ; case 3 : direction [ 3 ] = direction [ 1 ] ; break ; case 4 : break ; default : return { } ; } } const topKey = `${ key }Top` ; const rightKey = `${ key }Right` ; const bottomKey = `${ key }Bottom` ; const leftKey = `${ key }Left` ; const result = { isDeleted : true , } ; result [ topKey ] = convertUnit ( direction [ 0 ] ) ; result [ rightKey ] = convertUnit ( direction [ 1 ] ) ; result [ bottomKey ] = convertUnit ( direction [ 2 ] ) ; result [ leftKey ] = convertUnit ( direction [ 3 ] ) ; return result ; } const border = function ( key , value ) { const result = { isDeleted : true , } ; const direction = value && value . split ( ' ' ) ; result [ `${ key }Width` ] = direction && convertUnit ( direction [ 0 ] ) ; result [ `${ key }Style` ] = direction && direction [ 1 ] ; result [ `${ key }Color` ] = direction && normalizeColor ( direction [ 2 ] ) ; return result ; } ; const toMs = function ( value ) { if ( typeof value === 'string' ) { if ( /^\./ . test ( value ) ) value = `0${ value }` ; if ( /s$/ . test ( value ) && ! /ms$/ . test ( value ) ) { value = parseFloat ( value ) * 1000 ; } else { value = parseFloat ( value ) ; } } return `${ value || 0 }ms` ; } ; const transitionProperty = function ( value ) { if ( value === 'all' ) { value = 'width,height,top,bottom,left,right,backgroundColor,opacity,transform' ; } else if ( value === 'none' || ! value ) { return { isDeleted : true } ; } return { transitionProperty : value . replace ( 'background-color' , 'backgroundColor' ) , } ; } ; const transition = function ( value ) { const result = { isDeleted : true , } ; const options = ( value || '' ) . trim ( ) . replace ( /cubic-bezier\(.*\)/g , ( $0 ) => $0 . replace ( /\s+/g , '' ) ) . split ( /\s+/ ) ; const property = transitionProperty ( options [ 0 ] || 'all' ) ; if ( ! property . isDeleted ) result . transitionProperty = property . transitionProperty ; result . transitionTimingFunction = ( options [ 2 ] || 'ease' ) . replace ( /\s+/g , '' ) ; result . transitionDuration = toMs ( options [ 1 ] ) ; result . transitionDelay = toMs ( options [ 3 ] ) ; return result ; } ; export default { border : ( value ) => { return border ( 'border' , value ) ; } , borderTop : ( value ) => { return border ( 'borderTop' , value ) ; } , borderRight : ( value ) => { return border ( 'borderRight' , value ) ; } , borderBottom : ( value ) => { return border ( 'borderBottom' , value ) ; } , borderLeft : ( value ) => { return border ( 'borderLeft' , value ) ; } , padding : ( value ) => { return measure ( value , 'padding' ) ; } , margin : ( value ) => { return measure ( value , 'margin' ) ; } , lineHeight : ( value ) => { return { lineHeight : value , } ; } , fontWeight : ( value ) => { return { fontWeight : value . toString ( ) , } ; } , transition : ( value ) => { return transition ( value ) ; } , transitionProperty : ( value ) => { return transitionProperty ( value ) ; } , transitionDuration : ( value ) => { return { transitionDuration : toMs ( value ) , } ; } , transitionDelay : ( value ) => { return { transitionDelay : toMs ( value ) , } ; } , transitionTimingFunction : ( value ) => { return { transitionTimingFunction : value . replace ( /\s+/g , '' ) , } ; } , } ;