1 |
|
2 |
|
3 |
|
4 | import * as React from 'react'
|
5 | import { ComponentSelector, Interpolation } from '@emotion/serialize'
|
6 | import { PropsOf, Theme } from '@emotion/react'
|
7 |
|
8 | export {
|
9 | ArrayInterpolation,
|
10 | CSSObject,
|
11 | FunctionInterpolation
|
12 | } from '@emotion/serialize'
|
13 |
|
14 | export { ComponentSelector, Interpolation }
|
15 |
|
16 |
|
17 | export interface FilteringStyledOptions<
|
18 | Props = Record<string, any>,
|
19 | ForwardedProps extends keyof Props & string = keyof Props & string
|
20 | > {
|
21 | label?: string
|
22 | shouldForwardProp?: (propName: string) => propName is ForwardedProps
|
23 | target?: string
|
24 | }
|
25 |
|
26 | export interface StyledOptions<Props = Record<string, any>> {
|
27 | label?: string
|
28 | shouldForwardProp?: (propName: string) => boolean
|
29 | target?: string
|
30 | }
|
31 |
|
32 |
|
33 |
|
34 |
|
35 |
|
36 | export interface StyledComponent<
|
37 | ComponentProps extends {},
|
38 | SpecificComponentProps extends {} = {},
|
39 | JSXProps extends {} = {}
|
40 | > extends React.FC<ComponentProps & SpecificComponentProps & JSXProps>,
|
41 | ComponentSelector {
|
42 | withComponent<C extends React.ComponentClass<React.ComponentProps<C>>>(
|
43 | component: C
|
44 | ): StyledComponent<
|
45 | ComponentProps & PropsOf<C>,
|
46 | {},
|
47 | { ref?: React.Ref<InstanceType<C>> }
|
48 | >
|
49 | withComponent<C extends React.ComponentType<React.ComponentProps<C>>>(
|
50 | component: C
|
51 | ): StyledComponent<ComponentProps & PropsOf<C>>
|
52 | withComponent<Tag extends keyof JSX.IntrinsicElements>(
|
53 | tag: Tag
|
54 | ): StyledComponent<ComponentProps, JSX.IntrinsicElements[Tag]>
|
55 | }
|
56 |
|
57 |
|
58 |
|
59 |
|
60 |
|
61 | export interface CreateStyledComponent<
|
62 | ComponentProps extends {},
|
63 | SpecificComponentProps extends {} = {},
|
64 | JSXProps extends {} = {}
|
65 | > {
|
66 | |
67 |
|
68 |
|
69 | <AdditionalProps extends {} = {}>(
|
70 | ...styles: Array<
|
71 | Interpolation<
|
72 | ComponentProps &
|
73 | SpecificComponentProps &
|
74 | AdditionalProps & { theme: Theme }
|
75 | >
|
76 | >
|
77 | ): StyledComponent<
|
78 | ComponentProps & AdditionalProps,
|
79 | SpecificComponentProps,
|
80 | JSXProps
|
81 | >
|
82 |
|
83 | (
|
84 | template: TemplateStringsArray,
|
85 | ...styles: Array<
|
86 | Interpolation<ComponentProps & SpecificComponentProps & { theme: Theme }>
|
87 | >
|
88 | ): StyledComponent<ComponentProps, SpecificComponentProps, JSXProps>
|
89 |
|
90 | |
91 |
|
92 |
|
93 | <AdditionalProps extends {}>(
|
94 | template: TemplateStringsArray,
|
95 | ...styles: Array<
|
96 | Interpolation<
|
97 | ComponentProps &
|
98 | SpecificComponentProps &
|
99 | AdditionalProps & { theme: Theme }
|
100 | >
|
101 | >
|
102 | ): StyledComponent<
|
103 | ComponentProps & AdditionalProps,
|
104 | SpecificComponentProps,
|
105 | JSXProps
|
106 | >
|
107 | }
|
108 |
|
109 |
|
110 |
|
111 |
|
112 |
|
113 |
|
114 |
|
115 |
|
116 |
|
117 |
|
118 | export interface CreateStyled {
|
119 | <
|
120 | C extends React.ComponentClass<React.ComponentProps<C>>,
|
121 | ForwardedProps extends keyof React.ComponentProps<C> &
|
122 | string = keyof React.ComponentProps<C> & string
|
123 | >(
|
124 | component: C,
|
125 | options: FilteringStyledOptions<React.ComponentProps<C>, ForwardedProps>
|
126 | ): CreateStyledComponent<
|
127 | Pick<PropsOf<C>, ForwardedProps> & {
|
128 | theme?: Theme
|
129 | },
|
130 | {},
|
131 | {
|
132 | ref?: React.Ref<InstanceType<C>>
|
133 | }
|
134 | >
|
135 |
|
136 | <C extends React.ComponentClass<React.ComponentProps<C>>>(
|
137 | component: C,
|
138 | options?: StyledOptions<React.ComponentProps<C>>
|
139 | ): CreateStyledComponent<
|
140 | PropsOf<C> & {
|
141 | theme?: Theme
|
142 | },
|
143 | {},
|
144 | {
|
145 | ref?: React.Ref<InstanceType<C>>
|
146 | }
|
147 | >
|
148 |
|
149 | <
|
150 | C extends React.ComponentType<React.ComponentProps<C>>,
|
151 | ForwardedProps extends keyof React.ComponentProps<C> &
|
152 | string = keyof React.ComponentProps<C> & string
|
153 | >(
|
154 | component: C,
|
155 | options: FilteringStyledOptions<React.ComponentProps<C>, ForwardedProps>
|
156 | ): CreateStyledComponent<
|
157 | Pick<PropsOf<C>, ForwardedProps> & {
|
158 | theme?: Theme
|
159 | }
|
160 | >
|
161 |
|
162 | <C extends React.ComponentType<React.ComponentProps<C>>>(
|
163 | component: C,
|
164 | options?: StyledOptions<React.ComponentProps<C>>
|
165 | ): CreateStyledComponent<
|
166 | PropsOf<C> & {
|
167 | theme?: Theme
|
168 | }
|
169 | >
|
170 |
|
171 | <
|
172 | Tag extends keyof JSX.IntrinsicElements,
|
173 | ForwardedProps extends keyof JSX.IntrinsicElements[Tag] &
|
174 | string = keyof JSX.IntrinsicElements[Tag] & string
|
175 | >(
|
176 | tag: Tag,
|
177 | options: FilteringStyledOptions<JSX.IntrinsicElements[Tag], ForwardedProps>
|
178 | ): CreateStyledComponent<
|
179 | { theme?: Theme; as?: React.ElementType },
|
180 | Pick<JSX.IntrinsicElements[Tag], ForwardedProps>
|
181 | >
|
182 |
|
183 | <Tag extends keyof JSX.IntrinsicElements>(
|
184 | tag: Tag,
|
185 | options?: StyledOptions<JSX.IntrinsicElements[Tag]>
|
186 | ): CreateStyledComponent<
|
187 | { theme?: Theme; as?: React.ElementType },
|
188 | JSX.IntrinsicElements[Tag]
|
189 | >
|
190 | }
|
191 |
|
192 | declare const styled: CreateStyled
|
193 | export default styled
|