Skip to content

Instantly share code, notes, and snippets.

@rorybyrne
Last active March 22, 2020 10:07
Show Gist options
  • Save rorybyrne/597175865bae043d82f42a888fd7661a to your computer and use it in GitHub Desktop.
Save rorybyrne/597175865bae043d82f42a888fd7661a to your computer and use it in GitHub Desktop.
Type definitions for @xstyled/emotion
declare module '@xstyled/emotion' {
import styled_, { StyledComponent } from '@emotion/styled'
export * from '@emotion/core'
/// Theme Type ///
type Theme = object; // Default theme {}
// ** Uncomment to use your custom theme **
// import customTheme from 'path/to/your/theme'
// type Theme = typeof customTheme
/// Style Props ///
interface Breakpoints {
xs: any
sm: any
md: any
lg: any
xl: any
}
type BreakpointObject<ArgType> = {
[Key in keyof Breakpoints]?: ArgType
}
/* Augments a type to be Type | BreakpointObject<Type>,
* in other words, allow a property to be `number | string` or `{ xs: number | string, sm: number | string }`
*/
type WithBreakpointArgs<Props> = {
[Key in keyof Props]?: Props[Key] | BreakpointObject<Props[Key]>
}
interface BoxPropsBase {
/* See props documentation at:
* https://www.smooth-code.com/open-source/smooth-ui/docs/box/#box-2
*/
/* Display */
background: number | string
backgroundColor: number | string
backgroundImage: number | string
backgroundSize: number | string
backgroundPosition: number | string
backgroundRepeat: number | string
opacity: number | string
overflow: number | string
transition: number | string
border: number | string
borderTop: number | string
borderTopColor: number | string
borderRight: number | string
borderRightColor: number | string
borderBottom: number | string
borderBottomColor: number | string
borderLeft: number | string
borderLeftColor: number | string
borderColor: number | string
borderWidth: number | string
borderStyle: number | string
borderRadius: number | string
display: number | string
alignItems: number | string
alignContent: number | string
justifyContent: number | string
justifyItems: number | string
flexWrap: number | string
flexBasis: number | string
flexDirection: number | string
flex: number | string
justifySelf: number | string
alignSelf: number | string
order: number | string
gridGap: number | string
gridColumnGap: number | string
gridRowGap: number | string
gridColumn: number | string
gridRow: number | string
gridAutoFlow: number | string
gridAutoColumns: number | string
gridAutoRows: number | string
gridTemplateColumns: number | string
gridTemplateRows: number | string
gridTemplateAreas: number | string
gridArea: number | string
width: number | string
height: number | string
maxWidth: number | string
maxHeight: number | string
minWidth: number | string
minHeight: number | string
size: number | string
verticalAlign: number | string
position: number | string
zIndex: number | string
top: number | string
right: number | string
bottom: number | string
left: number | string
boxShadow: number | string
textShadow: number | string
margin: number | string
m: number | string
marginTop: number | string
mt: number | string
marginRight: number | string
mr: number | string
marginBottom: number | string
mb: number | string
marginLeft: number | string
ml: number | string
mx: number | string
my: number | string
padding: number | string
p: number | string
paddingTop: number | string
pt: number | string
paddingRight: number | string
pr: number | string
paddingBottom: number | string
pb: number | string
paddingLeft: number | string
pl: number | string
px: number | string
py: number | string
fontFamily: number | string
fontSize: number | string
lineHeight: number | string
fontWeight: number | string
textAlign: number | string
letterSpacing: number | string
color: number | string
textTransform: number | string
row: number | string
col: number | string
}
/* adds support for { xs: arg } and makes all props optional */
export type BoxProps = WithBreakpointArgs<BoxPropsBase>
/// Boxes ///
export const Box: StyledComponent<
React.ComponentPropsWithRef<'div'>,
WithBreakpointArgs<BoxProps>,
Theme
>
// Extend the styled type to include the xxxBox types
// https://github.com/Microsoft/TypeScript/issues/14080#issuecomment-541298101
const styled: typeof styled_ & {
Box: typeof Box,
aBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'a'>,
Theme,
WithBreakpointArgs<BoxProps>
>
abbrBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'abbr'>,
Theme,
WithBreakpointArgs<BoxProps>
>
addressBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'address'>,
Theme,
WithBreakpointArgs<BoxProps>
>
areaBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'area'>,
Theme,
WithBreakpointArgs<BoxProps>
>
articleBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'article'>,
Theme,
WithBreakpointArgs<BoxProps>
>
asideBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'aside'>,
Theme,
WithBreakpointArgs<BoxProps>
>
audioBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'audio'>,
Theme,
WithBreakpointArgs<BoxProps>
>
bBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'b'>,
Theme,
WithBreakpointArgs<BoxProps>
>
baseBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'base'>,
Theme,
WithBreakpointArgs<BoxProps>
>
bdiBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'bdi'>,
Theme,
WithBreakpointArgs<BoxProps>
>
bdoBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'bdo'>,
Theme,
WithBreakpointArgs<BoxProps>
>
bigBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'big'>,
Theme,
WithBreakpointArgs<BoxProps>
>
blockquoteBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'blockquote'>,
Theme,
WithBreakpointArgs<BoxProps>
>
bodyBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'body'>,
Theme,
WithBreakpointArgs<BoxProps>
>
brBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'br'>,
Theme,
WithBreakpointArgs<BoxProps>
>
buttonBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'button'>,
Theme,
WithBreakpointArgs<BoxProps>
>
canvasBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'canvas'>,
Theme,
WithBreakpointArgs<BoxProps>
>
captionBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'caption'>,
Theme,
WithBreakpointArgs<BoxProps>
>
citeBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'cite'>,
Theme,
WithBreakpointArgs<BoxProps>
>
codeBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'code'>,
Theme,
WithBreakpointArgs<BoxProps>
>
colBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'col'>,
Theme,
WithBreakpointArgs<BoxProps>
>
colgroupBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'colgroup'>,
Theme,
WithBreakpointArgs<BoxProps>
>
dataBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'data'>,
Theme,
WithBreakpointArgs<BoxProps>
>
datalistBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'datalist'>,
Theme,
WithBreakpointArgs<BoxProps>
>
ddBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'dd'>,
Theme,
WithBreakpointArgs<BoxProps>
>
delBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'del'>,
Theme,
WithBreakpointArgs<BoxProps>
>
detailsBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'details'>,
Theme,
WithBreakpointArgs<BoxProps>
>
dfnBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'dfn'>,
Theme,
WithBreakpointArgs<BoxProps>
>
dialogBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'dialog'>,
Theme,
WithBreakpointArgs<BoxProps>
>
divBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'div'>,
Theme,
WithBreakpointArgs<BoxProps>
>
dlBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'dl'>,
Theme,
WithBreakpointArgs<BoxProps>
>
dtBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'dt'>,
Theme,
WithBreakpointArgs<BoxProps>
>
emBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'em'>,
Theme,
WithBreakpointArgs<BoxProps>
>
embedBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'embed'>,
Theme,
WithBreakpointArgs<BoxProps>
>
fieldsetBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'fieldset'>,
Theme,
WithBreakpointArgs<BoxProps>
>
figcaptionBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'figcaption'>,
Theme,
WithBreakpointArgs<BoxProps>
>
figureBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'figure'>,
Theme,
WithBreakpointArgs<BoxProps>
>
footerBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'footer'>,
Theme,
WithBreakpointArgs<BoxProps>
>
formBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'form'>,
Theme,
WithBreakpointArgs<BoxProps>
>
h1Box: CreateStyledComponentBase<
React.ComponentPropsWithRef<'h1'>,
Theme,
WithBreakpointArgs<BoxProps>
>
h2Box: CreateStyledComponentBase<
React.ComponentPropsWithRef<'h2'>,
Theme,
WithBreakpointArgs<BoxProps>
>
h3Box: CreateStyledComponentBase<
React.ComponentPropsWithRef<'h3'>,
Theme,
WithBreakpointArgs<BoxProps>
>
h4Box: CreateStyledComponentBase<
React.ComponentPropsWithRef<'h4'>,
Theme,
WithBreakpointArgs<BoxProps>
>
h5Box: CreateStyledComponentBase<
React.ComponentPropsWithRef<'h5'>,
Theme,
WithBreakpointArgs<BoxProps>
>
h6Box: CreateStyledComponentBase<
React.ComponentPropsWithRef<'h6'>,
Theme,
WithBreakpointArgs<BoxProps>
>
headBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'head'>,
Theme,
WithBreakpointArgs<BoxProps>
>
headerBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'header'>,
Theme,
WithBreakpointArgs<BoxProps>
>
hgroupBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'hgroup'>,
Theme,
WithBreakpointArgs<BoxProps>
>
hrBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'hr'>,
Theme,
WithBreakpointArgs<BoxProps>
>
htmlBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'html'>,
Theme,
WithBreakpointArgs<BoxProps>
>
iBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'i'>,
Theme,
WithBreakpointArgs<BoxProps>
>
iframeBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'iframe'>,
Theme,
WithBreakpointArgs<BoxProps>
>
imgBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'img'>,
Theme,
WithBreakpointArgs<BoxProps>
>
inputBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'input'>,
Theme,
WithBreakpointArgs<BoxProps>
>
insBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'ins'>,
Theme,
WithBreakpointArgs<BoxProps>
>
kbdBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'kbd'>,
Theme,
WithBreakpointArgs<BoxProps>
>
keygenBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'keygen'>,
Theme,
WithBreakpointArgs<BoxProps>
>
labelBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'label'>,
Theme,
WithBreakpointArgs<BoxProps>
>
legendBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'legend'>,
Theme,
WithBreakpointArgs<BoxProps>
>
liBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'li'>,
Theme,
WithBreakpointArgs<BoxProps>
>
linkBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'link'>,
Theme,
WithBreakpointArgs<BoxProps>
>
mainBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'main'>,
Theme,
WithBreakpointArgs<BoxProps>
>
mapBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'map'>,
Theme,
WithBreakpointArgs<BoxProps>
>
markBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'mark'>,
Theme,
WithBreakpointArgs<BoxProps>
>
/* This one breaks, it looks like marquee is not supported in JSX.IntrinsicElements */
// marqueeBox: CreateStyledComponentBase<'marquee', Theme, WithBreakpointArgs<BoxProps>>
menuBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'menu'>,
Theme,
WithBreakpointArgs<BoxProps>
>
menuitemBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'menuitem'>,
Theme,
WithBreakpointArgs<BoxProps>
>
metaBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'meta'>,
Theme,
WithBreakpointArgs<BoxProps>
>
meterBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'meter'>,
Theme,
WithBreakpointArgs<BoxProps>
>
navBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'nav'>,
Theme,
WithBreakpointArgs<BoxProps>
>
noscriptBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'noscript'>,
Theme,
WithBreakpointArgs<BoxProps>
>
objectBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'object'>,
Theme,
WithBreakpointArgs<BoxProps>
>
olBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'ol'>,
Theme,
WithBreakpointArgs<BoxProps>
>
optgroupBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'optgroup'>,
Theme,
WithBreakpointArgs<BoxProps>
>
optionBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'option'>,
Theme,
WithBreakpointArgs<BoxProps>
>
outputBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'output'>,
Theme,
WithBreakpointArgs<BoxProps>
>
pBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'p'>,
Theme,
WithBreakpointArgs<BoxProps>
>
paramBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'param'>,
Theme,
WithBreakpointArgs<BoxProps>
>
pictureBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'picture'>,
Theme,
WithBreakpointArgs<BoxProps>
>
preBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'pre'>,
Theme,
WithBreakpointArgs<BoxProps>
>
progressBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'progress'>,
Theme,
WithBreakpointArgs<BoxProps>
>
qBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'q'>,
Theme,
WithBreakpointArgs<BoxProps>
>
rpBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'rp'>,
Theme,
WithBreakpointArgs<BoxProps>
>
rtBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'rt'>,
Theme,
WithBreakpointArgs<BoxProps>
>
rubyBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'ruby'>,
Theme,
WithBreakpointArgs<BoxProps>
>
sBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'s'>,
Theme,
WithBreakpointArgs<BoxProps>
>
sampBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'samp'>,
Theme,
WithBreakpointArgs<BoxProps>
>
scriptBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'script'>,
Theme,
WithBreakpointArgs<BoxProps>
>
sectionBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'section'>,
Theme,
WithBreakpointArgs<BoxProps>
>
selectBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'select'>,
Theme,
WithBreakpointArgs<BoxProps>
>
smallBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'small'>,
Theme,
WithBreakpointArgs<BoxProps>
>
sourceBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'source'>,
Theme,
WithBreakpointArgs<BoxProps>
>
spanBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'span'>,
Theme,
WithBreakpointArgs<BoxProps>
>
strongBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'strong'>,
Theme,
WithBreakpointArgs<BoxProps>
>
styleBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'style'>,
Theme,
WithBreakpointArgs<BoxProps>
>
subBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'sub'>,
Theme,
WithBreakpointArgs<BoxProps>
>
summaryBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'summary'>,
Theme,
WithBreakpointArgs<BoxProps>
>
supBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'sup'>,
Theme,
WithBreakpointArgs<BoxProps>
>
tableBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'table'>,
Theme,
WithBreakpointArgs<BoxProps>
>
tbodyBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'tbody'>,
Theme,
WithBreakpointArgs<BoxProps>
>
tdBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'td'>,
Theme,
WithBreakpointArgs<BoxProps>
>
textareaBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'textarea'>,
Theme,
WithBreakpointArgs<BoxProps>
>
tfootBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'tfoot'>,
Theme,
WithBreakpointArgs<BoxProps>
>
thBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'th'>,
Theme,
WithBreakpointArgs<BoxProps>
>
theadBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'thead'>,
Theme,
WithBreakpointArgs<BoxProps>
>
timeBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'time'>,
Theme,
WithBreakpointArgs<BoxProps>
>
titleBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'title'>,
Theme,
WithBreakpointArgs<BoxProps>
>
trBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'tr'>,
Theme,
WithBreakpointArgs<BoxProps>
>
trackBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'track'>,
Theme,
WithBreakpointArgs<BoxProps>
>
uBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'u'>,
Theme,
WithBreakpointArgs<BoxProps>
>
ulBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'ul'>,
Theme,
WithBreakpointArgs<BoxProps>
>
varBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'var'>,
Theme,
WithBreakpointArgs<BoxProps>
>
videoBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'video'>,
Theme,
WithBreakpointArgs<BoxProps>
>
wbrBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'wbr'>,
Theme,
WithBreakpointArgs<BoxProps>
>
// SVG
circleBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'circle'>,
Theme,
WithBreakpointArgs<BoxProps>
>
clipPathBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'clipPath'>,
Theme,
WithBreakpointArgs<BoxProps>
>
defsBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'defs'>,
Theme,
WithBreakpointArgs<BoxProps>
>
ellipseBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'ellipse'>,
Theme,
WithBreakpointArgs<BoxProps>
>
foreignObjectBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'foreignObject'>,
Theme,
WithBreakpointArgs<BoxProps>
>
gBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'g'>,
Theme,
WithBreakpointArgs<BoxProps>
>
imageBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'image'>,
Theme,
WithBreakpointArgs<BoxProps>
>
lineBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'line'>,
Theme,
WithBreakpointArgs<BoxProps>
>
linearGradientBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'linearGradient'>,
Theme,
WithBreakpointArgs<BoxProps>
>
markerBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'marker'>,
Theme,
WithBreakpointArgs<BoxProps>
>
maskBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'mask'>,
Theme,
WithBreakpointArgs<BoxProps>
>
pathBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'path'>,
Theme,
WithBreakpointArgs<BoxProps>
>
patternBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'pattern'>,
Theme,
WithBreakpointArgs<BoxProps>
>
polygonBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'polygon'>,
Theme,
WithBreakpointArgs<BoxProps>
>
polylineBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'polyline'>,
Theme,
WithBreakpointArgs<BoxProps>
>
radialGradientBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'radialGradient'>,
Theme,
WithBreakpointArgs<BoxProps>
>
rectBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'rect'>,
Theme,
WithBreakpointArgs<BoxProps>
>
stopBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'stop'>,
Theme,
WithBreakpointArgs<BoxProps>
>
svgBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'svg'>,
Theme,
WithBreakpointArgs<BoxProps>
>
textBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'text'>,
Theme,
WithBreakpointArgs<BoxProps>
>
tspanBox: CreateStyledComponentBase<
React.ComponentPropsWithRef<'tspan'>,
Theme,
WithBreakpointArgs<BoxProps>
>
}
export default styled
}
export default styled
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment