Skip to content

Commit 70efa0d

Browse files
authored
fix: update useTransition docs to show correct tooltips for the enter, update, and leave props. (#2239)
1 parent 86e452e commit 70efa0d

File tree

3 files changed

+20
-633
lines changed

3 files changed

+20
-633
lines changed

docs/app/data/fixtures.tsx

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -606,7 +606,12 @@ export const TRANSITION_CONFIG_DATA: CellData[][] = [
606606
[
607607
{
608608
label: 'enter',
609-
content: ToContent,
609+
content: (
610+
<p>
611+
The <code>enter</code> prop is used to pass styles to the animation
612+
when the transition is entering.
613+
</p>
614+
),
610615
},
611616
{
612617
label: 'object | object[] | function',
@@ -619,7 +624,12 @@ export const TRANSITION_CONFIG_DATA: CellData[][] = [
619624
[
620625
{
621626
label: 'update',
622-
content: ToContent,
627+
content: (
628+
<p>
629+
The <code>update</code> prop is used to pass styles to the animation
630+
when the transition is updating.
631+
</p>
632+
),
623633
},
624634
{
625635
label: 'object | object[] | function',
@@ -632,7 +642,12 @@ export const TRANSITION_CONFIG_DATA: CellData[][] = [
632642
[
633643
{
634644
label: 'leave',
635-
content: ToContent,
645+
content: (
646+
<p>
647+
The <code>leave</code> prop is used to pass styles to the animation
648+
when the transition is leaving.
649+
</p>
650+
),
636651
},
637652
{
638653
label: 'object | object[] | function',
Lines changed: 1 addition & 307 deletions
Original file line numberDiff line numberDiff line change
@@ -1,307 +1 @@
1-
[
2-
{
3-
"href": "/docs",
4-
"id": "index",
5-
"title": "Overview",
6-
"sidebarPosition": 1,
7-
"children": []
8-
},
9-
{
10-
"href": "/docs/getting-started",
11-
"id": "getting-started",
12-
"title": "Getting started",
13-
"sidebarPosition": 2,
14-
"children": []
15-
},
16-
{
17-
"href": "/docs/concepts",
18-
"id": "concepts",
19-
"noPage": true,
20-
"isNew": false,
21-
"children": [
22-
{
23-
"id": "animated-elements",
24-
"title": "Animated Elements",
25-
"sidebarPosition": 1,
26-
"children": [],
27-
"href": "/docs/concepts/animated-elements",
28-
"noPage": false,
29-
"isNew": false
30-
},
31-
{
32-
"id": "controllers-and-springs",
33-
"title": "Controllers & Springs",
34-
"sidebarPosition": 2,
35-
"children": [],
36-
"href": "/docs/concepts/controllers-and-springs",
37-
"noPage": false,
38-
"isNew": false
39-
},
40-
{
41-
"id": "imperative-api",
42-
"title": "Imperative API",
43-
"sidebarPosition": 3,
44-
"children": [],
45-
"href": "/docs/concepts/imperative-api",
46-
"noPage": false,
47-
"isNew": false
48-
},
49-
{
50-
"id": "targets",
51-
"title": "Targets",
52-
"sidebarPosition": 4,
53-
"children": [],
54-
"href": "/docs/concepts/targets",
55-
"noPage": false,
56-
"isNew": false
57-
}
58-
],
59-
"sidebarPosition": 3,
60-
"title": "Concepts"
61-
},
62-
{
63-
"href": "/docs/components",
64-
"id": "components",
65-
"noPage": false,
66-
"isNew": false,
67-
"children": [
68-
{
69-
"id": "use-spring",
70-
"title": "useSpring",
71-
"sidebarPosition": 1,
72-
"children": [],
73-
"href": "/docs/components/use-spring",
74-
"noPage": false,
75-
"isNew": false
76-
},
77-
{
78-
"id": "use-springs",
79-
"title": "useSprings",
80-
"sidebarPosition": 2,
81-
"children": [],
82-
"href": "/docs/components/use-springs",
83-
"noPage": false,
84-
"isNew": false
85-
},
86-
{
87-
"id": "use-spring-value",
88-
"title": "useSpringValue",
89-
"sidebarPosition": 3,
90-
"children": [],
91-
"href": "/docs/components/use-spring-value",
92-
"noPage": false,
93-
"isNew": true
94-
},
95-
{
96-
"id": "use-transition",
97-
"title": "useTransition",
98-
"sidebarPosition": 4,
99-
"children": [],
100-
"href": "/docs/components/use-transition",
101-
"noPage": false,
102-
"isNew": false
103-
},
104-
{
105-
"id": "use-chain",
106-
"title": "useChain",
107-
"sidebarPosition": 5,
108-
"children": [],
109-
"href": "/docs/components/use-chain",
110-
"noPage": false,
111-
"isNew": false
112-
},
113-
{
114-
"id": "use-trail",
115-
"title": "useTrail",
116-
"sidebarPosition": 6,
117-
"children": [],
118-
"href": "/docs/components/use-trail",
119-
"noPage": false,
120-
"isNew": false
121-
},
122-
{
123-
"id": "parallax",
124-
"title": "Parallax",
125-
"sidebarPosition": 7,
126-
"children": [],
127-
"href": "/docs/components/parallax",
128-
"noPage": false,
129-
"isNew": false
130-
},
131-
{
132-
"id": "parallax-layer",
133-
"title": "Parallax Layer",
134-
"sidebarPosition": 8,
135-
"children": [],
136-
"href": "/docs/components/parallax-layer",
137-
"noPage": false,
138-
"isNew": false
139-
}
140-
],
141-
"sidebarPosition": 4,
142-
"title": "Components"
143-
},
144-
{
145-
"href": "/docs/advanced",
146-
"id": "advanced",
147-
"noPage": true,
148-
"isNew": false,
149-
"children": [
150-
{
151-
"id": "config",
152-
"title": "Spring Configs",
153-
"sidebarPosition": 1,
154-
"children": [],
155-
"href": "/docs/advanced/config",
156-
"noPage": false,
157-
"isNew": false
158-
},
159-
{
160-
"id": "events",
161-
"title": "Events",
162-
"sidebarPosition": 2,
163-
"children": [],
164-
"href": "/docs/advanced/events",
165-
"noPage": false,
166-
"isNew": false
167-
},
168-
{
169-
"id": "controller",
170-
"title": "Controller",
171-
"sidebarPosition": 3,
172-
"children": [],
173-
"href": "/docs/advanced/controller",
174-
"noPage": false,
175-
"isNew": false
176-
},
177-
{
178-
"id": "spring-value",
179-
"title": "SpringValue",
180-
"sidebarPosition": 4,
181-
"children": [],
182-
"href": "/docs/advanced/spring-value",
183-
"noPage": false,
184-
"isNew": false
185-
},
186-
{
187-
"id": "spring-ref",
188-
"title": "SpringRef",
189-
"sidebarPosition": 5,
190-
"children": [],
191-
"href": "/docs/advanced/spring-ref",
192-
"noPage": false,
193-
"isNew": false
194-
},
195-
{
196-
"id": "interpolation",
197-
"title": "Interpolation",
198-
"sidebarPosition": 6,
199-
"children": [],
200-
"href": "/docs/advanced/interpolation",
201-
"noPage": false,
202-
"isNew": false
203-
},
204-
{
205-
"id": "async-animations",
206-
"title": "Async Animations",
207-
"sidebarPosition": 7,
208-
"children": [],
209-
"href": "/docs/advanced/async-animations",
210-
"noPage": false,
211-
"isNew": false
212-
}
213-
],
214-
"sidebarPosition": 5,
215-
"title": "Advanced API"
216-
},
217-
{
218-
"href": "/docs/guides",
219-
"id": "guides",
220-
"noPage": true,
221-
"isNew": false,
222-
"children": [
223-
{
224-
"id": "react-three-fiber",
225-
"title": "React Three Fiber",
226-
"sidebarPosition": 1,
227-
"children": [],
228-
"href": "/docs/guides/react-three-fiber",
229-
"noPage": false,
230-
"isNew": false
231-
},
232-
{
233-
"id": "testing",
234-
"title": "Testing",
235-
"sidebarPosition": 2,
236-
"children": [],
237-
"href": "/docs/guides/testing",
238-
"noPage": false,
239-
"isNew": false
240-
}
241-
],
242-
"sidebarPosition": 6,
243-
"title": "Guides"
244-
},
245-
{
246-
"href": "/docs/utilities",
247-
"id": "utilities",
248-
"noPage": true,
249-
"isNew": false,
250-
"children": [
251-
{
252-
"id": "use-isomorphic-layout-effect",
253-
"title": "useIsomorphicLayout",
254-
"sidebarPosition": 1,
255-
"children": [],
256-
"href": "/docs/utilities/use-isomorphic-layout-effect",
257-
"noPage": false,
258-
"isNew": false
259-
},
260-
{
261-
"id": "use-reduced-motion",
262-
"title": "useReducedMotion",
263-
"sidebarPosition": 2,
264-
"children": [],
265-
"href": "/docs/utilities/use-reduced-motion",
266-
"noPage": false,
267-
"isNew": false
268-
},
269-
{
270-
"id": "use-scroll",
271-
"title": "useScroll",
272-
"sidebarPosition": 3,
273-
"children": [],
274-
"href": "/docs/utilities/use-scroll",
275-
"noPage": false,
276-
"isNew": true
277-
},
278-
{
279-
"id": "use-resize",
280-
"title": "useResize",
281-
"sidebarPosition": 4,
282-
"children": [],
283-
"href": "/docs/utilities/use-resize",
284-
"noPage": false,
285-
"isNew": true
286-
},
287-
{
288-
"id": "use-in-view",
289-
"title": "useInView",
290-
"sidebarPosition": 5,
291-
"children": [],
292-
"href": "/docs/utilities/use-in-view",
293-
"noPage": false,
294-
"isNew": true
295-
}
296-
],
297-
"sidebarPosition": 7,
298-
"title": "Utilities"
299-
},
300-
{
301-
"href": "/docs/typescript",
302-
"id": "typescript",
303-
"title": "Typescript",
304-
"sidebarPosition": 8,
305-
"children": []
306-
}
307-
]
1+
[{"href":"/docs","id":"index","title":"Overview","sidebarPosition":1,"children":[]},{"href":"/docs/getting-started","id":"getting-started","title":"Getting started","sidebarPosition":2,"children":[]},{"href":"/docs/concepts","id":"concepts","noPage":true,"isNew":false,"children":[{"id":"animated-elements","title":"Animated Elements","sidebarPosition":1,"children":[],"href":"/docs/concepts/animated-elements","noPage":false,"isNew":false},{"id":"controllers-and-springs","title":"Controllers & Springs","sidebarPosition":2,"children":[],"href":"/docs/concepts/controllers-and-springs","noPage":false,"isNew":false},{"id":"imperative-api","title":"Imperative API","sidebarPosition":3,"children":[],"href":"/docs/concepts/imperative-api","noPage":false,"isNew":false},{"id":"targets","title":"Targets","sidebarPosition":4,"children":[],"href":"/docs/concepts/targets","noPage":false,"isNew":false}],"sidebarPosition":3,"title":"Concepts"},{"href":"/docs/components","id":"components","noPage":false,"isNew":false,"children":[{"id":"use-spring","title":"useSpring","sidebarPosition":1,"children":[],"href":"/docs/components/use-spring","noPage":false,"isNew":false},{"id":"use-springs","title":"useSprings","sidebarPosition":2,"children":[],"href":"/docs/components/use-springs","noPage":false,"isNew":false},{"id":"use-spring-value","title":"useSpringValue","sidebarPosition":3,"children":[],"href":"/docs/components/use-spring-value","noPage":false,"isNew":true},{"id":"use-transition","title":"useTransition","sidebarPosition":4,"children":[],"href":"/docs/components/use-transition","noPage":false,"isNew":false},{"id":"use-chain","title":"useChain","sidebarPosition":5,"children":[],"href":"/docs/components/use-chain","noPage":false,"isNew":false},{"id":"use-trail","title":"useTrail","sidebarPosition":6,"children":[],"href":"/docs/components/use-trail","noPage":false,"isNew":false},{"id":"parallax","title":"Parallax","sidebarPosition":7,"children":[],"href":"/docs/components/parallax","noPage":false,"isNew":false},{"id":"parallax-layer","title":"Parallax Layer","sidebarPosition":8,"children":[],"href":"/docs/components/parallax-layer","noPage":false,"isNew":false}],"sidebarPosition":4,"title":"Components"},{"href":"/docs/advanced","id":"advanced","noPage":true,"isNew":false,"children":[{"id":"config","title":"Spring Configs","sidebarPosition":1,"children":[],"href":"/docs/advanced/config","noPage":false,"isNew":false},{"id":"events","title":"Events","sidebarPosition":2,"children":[],"href":"/docs/advanced/events","noPage":false,"isNew":false},{"id":"controller","title":"Controller","sidebarPosition":3,"children":[],"href":"/docs/advanced/controller","noPage":false,"isNew":false},{"id":"spring-value","title":"SpringValue","sidebarPosition":4,"children":[],"href":"/docs/advanced/spring-value","noPage":false,"isNew":false},{"id":"spring-ref","title":"SpringRef","sidebarPosition":5,"children":[],"href":"/docs/advanced/spring-ref","noPage":false,"isNew":false},{"id":"interpolation","title":"Interpolation","sidebarPosition":6,"children":[],"href":"/docs/advanced/interpolation","noPage":false,"isNew":false},{"id":"async-animations","title":"Async Animations","sidebarPosition":7,"children":[],"href":"/docs/advanced/async-animations","noPage":false,"isNew":false}],"sidebarPosition":5,"title":"Advanced API"},{"href":"/docs/guides","id":"guides","noPage":true,"isNew":false,"children":[{"id":"react-three-fiber","title":"React Three Fiber","sidebarPosition":1,"children":[],"href":"/docs/guides/react-three-fiber","noPage":false,"isNew":false},{"id":"testing","title":"Testing","sidebarPosition":2,"children":[],"href":"/docs/guides/testing","noPage":false,"isNew":false}],"sidebarPosition":6,"title":"Guides"},{"href":"/docs/utilities","id":"utilities","noPage":true,"isNew":false,"children":[{"id":"use-isomorphic-layout-effect","title":"useIsomorphicLayout","sidebarPosition":1,"children":[],"href":"/docs/utilities/use-isomorphic-layout-effect","noPage":false,"isNew":false},{"id":"use-reduced-motion","title":"useReducedMotion","sidebarPosition":2,"children":[],"href":"/docs/utilities/use-reduced-motion","noPage":false,"isNew":false},{"id":"use-scroll","title":"useScroll","sidebarPosition":3,"children":[],"href":"/docs/utilities/use-scroll","noPage":false,"isNew":true},{"id":"use-resize","title":"useResize","sidebarPosition":4,"children":[],"href":"/docs/utilities/use-resize","noPage":false,"isNew":true},{"id":"use-in-view","title":"useInView","sidebarPosition":5,"children":[],"href":"/docs/utilities/use-in-view","noPage":false,"isNew":true}],"sidebarPosition":7,"title":"Utilities"},{"href":"/docs/typescript","id":"typescript","title":"Typescript","sidebarPosition":8,"children":[]}]

0 commit comments

Comments
 (0)