How to use @emotion/primitives-core - 4 common examples

// @flow
import { StyleSheet, Text, View, Image } from 'react-primitives'
import { createCss } from '@emotion/primitives-core'

import { styled as createStyled } from './styled'

const css = createCss(StyleSheet)

const assignPrimitives = styled => {
  createStyled.Text = createStyled(Text)
  createStyled.View = createStyled(View)
  createStyled.Image = createStyled(Image)

  return styled
}

export { css }

export default /* #__PURE__ */ assignPrimitives(createStyled)

import * as reactNative from 'react-native'
import { createCss } from '@emotion/primitives-core'

import { styled } from './styled'

const css = createCss(reactNative.StyleSheet)

const components = [
  'ActivityIndicator',
  'ActivityIndicatorIOS',
  'ART',
  'Button',
  'DatePickerIOS',
  'DrawerLayoutAndroid',
  'Image',
  'ImageBackground',
  'ImageEditor',
  'ImageStore',
  'KeyboardAvoidingView',
  'ListView',
  'MapView',
  'Modal',

import { StyleSheet } from 'react-native'
import { createStyled } from '@emotion/primitives-core'

/**
 * a function that returns a styled component which render styles in React Native
 */
let styled = createStyled(StyleSheet)

export { styled }

/**
 * a function that returns a styled component which render styles on multiple targets with same code
 */

type CreateStyledComponent = (...styles: any) => React.ElementType

type BaseStyled = (tag: React.ElementType) => CreateStyledComponent

export type Styled = BaseStyled & {
  View: CreateStyledComponent,
  Text: CreateStyledComponent,
  Image: CreateStyledComponent
}

let styled: Styled = createStyled(StyleSheet, { getShouldForwardProp })

export { styled }