@emotion/react
Version:
> Simple styling in React.
33 lines (27 loc) • 924 B
text/typescript
import * as ReactJSXRuntime from 'react/jsx-runtime'
import Emotion, { createEmotionProps } from './emotion-element'
import { hasOwn } from './utils'
import { Interpolation } from '@emotion/serialize'
import { Theme } from './theming'
export type { EmotionJSX as JSX } from './jsx-namespace'
export const Fragment = ReactJSXRuntime.Fragment
export const jsx: typeof ReactJSXRuntime.jsx = (type, props, key) => {
if (!hasOwn.call(props, 'css')) {
return ReactJSXRuntime.jsx(type, props, key)
}
return ReactJSXRuntime.jsx(
Emotion,
createEmotionProps(type, props as { css: Interpolation<Theme> }),
key
)
}
export const jsxs: typeof ReactJSXRuntime.jsxs = (type, props, key) => {
if (!hasOwn.call(props, 'css')) {
return ReactJSXRuntime.jsxs(type, props, key)
}
return ReactJSXRuntime.jsxs(
Emotion,
createEmotionProps(type, props as { css: Interpolation<Theme> }),
key
)
}