Skip to content

Commit bff8fc2

Browse files
committed
Add test for Base UI components
1 parent 574b388 commit bff8fc2

File tree

2 files changed

+322
-0
lines changed

2 files changed

+322
-0
lines changed

test/base-ui-component/input.tsx

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import * as React from 'react';
2+
3+
export const BaseUIComponent = React.forwardRef(function BaseUIComponent(
4+
props: BaseUIComponent.Props,
5+
ref: React.ForwardedRef<HTMLDivElement>,
6+
) {
7+
return <div ref={ref} />;
8+
});
9+
10+
export namespace BaseUIComponent {
11+
export interface Props extends BaseUIComponentProps<'div', State> {
12+
value?: string;
13+
onValueChange?: (value: string) => void;
14+
actionsRef?: React.RefObject<Actions>;
15+
}
16+
17+
export interface State {
18+
state: string;
19+
}
20+
21+
export interface Actions {
22+
ping: () => void;
23+
}
24+
}
25+
26+
type BaseUIComponentProps<
27+
ElementType extends React.ElementType,
28+
State,
29+
RenderFunctionProps = GenericHTMLProps,
30+
> = Omit<WithBaseUIEvent<React.ComponentPropsWithoutRef<ElementType>>, 'className'> & {
31+
/**
32+
* CSS class applied to the element, or a function that
33+
* returns a class based on the component’s state.
34+
*/
35+
className?: string | ((state: State) => string);
36+
/**
37+
* Allows you to replace the component’s HTML element
38+
* with a different tag, or compose it with another component.
39+
*
40+
* Accepts a `ReactElement` or a function that returns the element to render.
41+
*/
42+
render?:
43+
| ComponentRenderFn<RenderFunctionProps, State>
44+
| React.ReactElement<Record<string, unknown>>;
45+
};
46+
47+
type ComponentRenderFn<Props, State> = (props: Props, state: State) => React.ReactElement<unknown>;
48+
49+
type WithBaseUIEvent<T> = {
50+
[K in keyof T]: WithPreventBaseUIHandler<T[K]>;
51+
};
52+
53+
export type GenericHTMLProps = React.HTMLAttributes<any> & { ref?: React.Ref<any> | undefined };
54+
55+
export type BaseUIEvent<E extends React.SyntheticEvent<Element, Event>> = E & {
56+
preventBaseUIHandler: () => void;
57+
readonly baseUIHandlerPrevented?: boolean;
58+
};
59+
60+
type WithPreventBaseUIHandler<T> = T extends (event: infer E) => any
61+
? E extends React.SyntheticEvent<Element, Event>
62+
? (event: BaseUIEvent<E>) => ReturnType<T>
63+
: T
64+
: T extends undefined
65+
? undefined
66+
: T;

test/base-ui-component/output.json

Lines changed: 256 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,256 @@
1+
{
2+
"name": "test/base-ui-component/input",
3+
"exports": [
4+
{
5+
"name": "BaseUIComponent",
6+
"type": {
7+
"kind": "component",
8+
"name": "ForwardRefExoticComponent",
9+
"props": [
10+
{
11+
"name": "value",
12+
"type": {
13+
"kind": "union",
14+
"types": [
15+
{
16+
"kind": "intrinsic",
17+
"name": "string"
18+
},
19+
{
20+
"kind": "intrinsic",
21+
"name": "undefined"
22+
}
23+
]
24+
},
25+
"optional": true
26+
},
27+
{
28+
"name": "onValueChange",
29+
"type": {
30+
"kind": "union",
31+
"types": [
32+
{
33+
"kind": "function",
34+
"callSignatures": [
35+
{
36+
"parameters": [
37+
{
38+
"nodeType": "parameter",
39+
"name": "value",
40+
"type": {
41+
"kind": "intrinsic",
42+
"name": "string"
43+
}
44+
}
45+
],
46+
"returnValueType": {
47+
"kind": "intrinsic",
48+
"name": "void"
49+
}
50+
}
51+
]
52+
},
53+
{
54+
"kind": "intrinsic",
55+
"name": "undefined"
56+
}
57+
]
58+
},
59+
"optional": true
60+
},
61+
{
62+
"name": "actionsRef",
63+
"type": {
64+
"kind": "union",
65+
"types": [
66+
{
67+
"kind": "reference",
68+
"name": "RefObject<Actions>"
69+
},
70+
{
71+
"kind": "intrinsic",
72+
"name": "undefined"
73+
}
74+
]
75+
},
76+
"optional": true
77+
},
78+
{
79+
"name": "className",
80+
"type": {
81+
"kind": "union",
82+
"types": [
83+
{
84+
"kind": "intrinsic",
85+
"name": "string"
86+
},
87+
{
88+
"kind": "function",
89+
"callSignatures": [
90+
{
91+
"parameters": [
92+
{
93+
"nodeType": "parameter",
94+
"name": "state",
95+
"type": {
96+
"kind": "object",
97+
"name": "State",
98+
"properties": [
99+
{
100+
"name": "state",
101+
"type": {
102+
"kind": "intrinsic",
103+
"name": "string"
104+
},
105+
"optional": false
106+
}
107+
]
108+
}
109+
}
110+
],
111+
"returnValueType": {
112+
"kind": "intrinsic",
113+
"name": "string"
114+
}
115+
}
116+
]
117+
},
118+
{
119+
"kind": "intrinsic",
120+
"name": "undefined"
121+
}
122+
]
123+
},
124+
"documentation": {
125+
"description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state."
126+
},
127+
"optional": true
128+
},
129+
{
130+
"name": "render",
131+
"type": {
132+
"kind": "union",
133+
"types": [
134+
{
135+
"kind": "reference",
136+
"name": "ReactElement<Record<string, unknown>, string | JSXElementConstructor<any>>"
137+
},
138+
{
139+
"kind": "function",
140+
"name": "ComponentRenderFn",
141+
"callSignatures": [
142+
{
143+
"parameters": [
144+
{
145+
"nodeType": "parameter",
146+
"name": "props",
147+
"type": {
148+
"kind": "intersection",
149+
"name": "GenericHTMLProps",
150+
"types": [
151+
{
152+
"kind": "reference",
153+
"name": "HTMLAttributes<any>"
154+
},
155+
{
156+
"kind": "object",
157+
"properties": [
158+
{
159+
"name": "ref",
160+
"type": {
161+
"kind": "union",
162+
"types": [
163+
{
164+
"kind": "reference",
165+
"name": "RefCallback"
166+
},
167+
{
168+
"kind": "reference",
169+
"name": "RefObject<any>"
170+
},
171+
{
172+
"kind": "intrinsic",
173+
"name": "null"
174+
},
175+
{
176+
"kind": "intrinsic",
177+
"name": "undefined"
178+
}
179+
]
180+
},
181+
"optional": true
182+
}
183+
]
184+
}
185+
],
186+
"properties": [
187+
{
188+
"name": "ref",
189+
"type": {
190+
"kind": "union",
191+
"types": [
192+
{
193+
"kind": "reference",
194+
"name": "RefCallback"
195+
},
196+
{
197+
"kind": "reference",
198+
"name": "RefObject<any>"
199+
},
200+
{
201+
"kind": "intrinsic",
202+
"name": "null"
203+
},
204+
{
205+
"kind": "intrinsic",
206+
"name": "undefined"
207+
}
208+
]
209+
},
210+
"optional": true
211+
}
212+
]
213+
}
214+
},
215+
{
216+
"nodeType": "parameter",
217+
"name": "state",
218+
"type": {
219+
"kind": "object",
220+
"name": "State",
221+
"properties": [
222+
{
223+
"name": "state",
224+
"type": {
225+
"kind": "intrinsic",
226+
"name": "string"
227+
},
228+
"optional": false
229+
}
230+
]
231+
}
232+
}
233+
],
234+
"returnValueType": {
235+
"kind": "reference",
236+
"name": "ReactElement<unknown, string | JSXElementConstructor<any>>"
237+
}
238+
}
239+
]
240+
},
241+
{
242+
"kind": "intrinsic",
243+
"name": "undefined"
244+
}
245+
]
246+
},
247+
"documentation": {
248+
"description": "Allows you to replace the component’s HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
249+
},
250+
"optional": true
251+
}
252+
]
253+
}
254+
}
255+
]
256+
}

0 commit comments

Comments
 (0)