import { default as emotionStyled , CreateStyled , Interpolation , CSSObject } from '@emotion/styled' ; import { useTheme , EmotionCanvasTheme , ContentDirection } from './index' ; import rtlCSSJS from 'rtl-css-js' ; import { convertToStaticStates } from '../utils/StaticStates' ; const noop = ( styles ) => styles ; type Interpolations = Array < any > ; function styled < Props > ( node ) { return ( ... args ) => { const newArgs = args . map ( interpolation => ( props ) => { props . theme = useTheme ( props . theme ) ; const direction = props . theme . canvas . direction ; const maybeFlip = direction === ContentDirection . RTL ? rtlCSSJS : noop ; const maybeConvert = props . theme . _staticStates ? convertToStaticStates : noop ; try { if ( typeof interpolation === 'function' ) { return maybeFlip ( maybeConvert ( interpolation ( props ) ) as CSSObject ) ; } return maybeFlip ( maybeConvert ( interpolation ) as CSSObject ) ; } catch ( e ) { return maybeConvert ( interpolation ) ; } } ) ; return emotionStyled ( node ) ( newArgs ) ; } ; } export default styled as CreateStyled < EmotionCanvasTheme > ;