Skip to content

Commit 2092049

Browse files
RobinMalfaitRobinMalfait
authored
Rename data-from -> data-closed and data-exit -> data-leave (#3285)
* rename `data-from` to `data-closed`, `data-exit` to `data-leave` * update changelog
1 parent 1e9a3f1 commit 2092049

File tree

4 files changed

+84
-84
lines changed

4 files changed

+84
-84
lines changed

‎packages/@headlessui-react/CHANGELOG.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
1010
### Added
1111

1212
- Add ability to render multiple `<Dialog />` components at once (without nesting them) ([#3242](https://github.com/tailwindlabs/headlessui/pull/3242))
13-
- Add CSS based transitions using `data-*` attributes ([#3273](https://github.com/tailwindlabs/headlessui/pull/3273))
13+
- Add CSS based transitions using `data-*` attributes ([#3273](https://github.com/tailwindlabs/headlessui/pull/3273), [#3285](https://github.com/tailwindlabs/headlessui/pull/3285))
1414

1515
### Fixed
1616

‎packages/@headlessui-react/src/components/transition/__snapshots__/transition.test.tsx.snap‎

Lines changed: 44 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -5,25 +5,25 @@ exports[`Setup API nested should be possible to change the underlying DOM tag of
55
class="My Page"
66
>
77
<article
8+
data-closed=""
89
data-enter=""
9-
data-from=""
10-
data-headlessui-state="from enter transition"
10+
data-headlessui-state="closed enter transition"
1111
data-transition=""
1212
style=""
1313
>
1414
<aside
15+
data-closed=""
1516
data-enter=""
16-
data-from=""
17-
data-headlessui-state="from enter transition"
17+
data-headlessui-state="closed enter transition"
1818
data-transition=""
1919
style=""
2020
>
2121
Sidebar
2222
</aside>
2323
<section
24+
data-closed=""
2425
data-enter=""
25-
data-from=""
26-
data-headlessui-state="from enter transition"
26+
data-headlessui-state="closed enter transition"
2727
data-transition=""
2828
style=""
2929
>
@@ -38,25 +38,25 @@ exports[`Setup API nested should be possible to change the underlying DOM tag of
3838
class="My Page"
3939
>
4040
<div
41+
data-closed=""
4142
data-enter=""
42-
data-from=""
43-
data-headlessui-state="from enter transition"
43+
data-headlessui-state="closed enter transition"
4444
data-transition=""
4545
style=""
4646
>
4747
<aside
48+
data-closed=""
4849
data-enter=""
49-
data-from=""
50-
data-headlessui-state="from enter transition"
50+
data-headlessui-state="closed enter transition"
5151
data-transition=""
5252
style=""
5353
>
5454
Sidebar
5555
</aside>
5656
<section
57+
data-closed=""
5758
data-enter=""
58-
data-from=""
59-
data-headlessui-state="from enter transition"
59+
data-headlessui-state="closed enter transition"
6060
data-transition=""
6161
style=""
6262
>
@@ -71,25 +71,25 @@ exports[`Setup API nested should be possible to nest transition components 1`] =
7171
class="My Page"
7272
>
7373
<div
74+
data-closed=""
7475
data-enter=""
75-
data-from=""
76-
data-headlessui-state="from enter transition"
76+
data-headlessui-state="closed enter transition"
7777
data-transition=""
7878
style=""
7979
>
8080
<div
81+
data-closed=""
8182
data-enter=""
82-
data-from=""
83-
data-headlessui-state="from enter transition"
83+
data-headlessui-state="closed enter transition"
8484
data-transition=""
8585
style=""
8686
>
8787
Sidebar
8888
</div>
8989
<div
90+
data-closed=""
9091
data-enter=""
91-
data-from=""
92-
data-headlessui-state="from enter transition"
92+
data-headlessui-state="closed enter transition"
9393
data-transition=""
9494
style=""
9595
>
@@ -104,23 +104,23 @@ exports[`Setup API nested should be possible to use render props on the Transiti
104104
class="My Page"
105105
>
106106
<article
107+
data-closed=""
107108
data-enter=""
108-
data-from=""
109-
data-headlessui-state="from enter transition"
109+
data-headlessui-state="closed enter transition"
110110
data-transition=""
111111
>
112112
<aside
113+
data-closed=""
113114
data-enter=""
114-
data-from=""
115-
data-headlessui-state="from enter transition"
115+
data-headlessui-state="closed enter transition"
116116
data-transition=""
117117
>
118118
Sidebar
119119
</aside>
120120
<section
121+
data-closed=""
121122
data-enter=""
122-
data-from=""
123-
data-headlessui-state="from enter transition"
123+
data-headlessui-state="closed enter transition"
124124
data-transition=""
125125
>
126126
Content
@@ -134,24 +134,24 @@ exports[`Setup API nested should be possible to use render props on the Transiti
134134
class="My Page"
135135
>
136136
<div
137+
data-closed=""
137138
data-enter=""
138-
data-from=""
139-
data-headlessui-state="from enter transition"
139+
data-headlessui-state="closed enter transition"
140140
data-transition=""
141141
style=""
142142
>
143143
<aside
144+
data-closed=""
144145
data-enter=""
145-
data-from=""
146-
data-headlessui-state="from enter transition"
146+
data-headlessui-state="closed enter transition"
147147
data-transition=""
148148
>
149149
Sidebar
150150
</aside>
151151
<section
152+
data-closed=""
152153
data-enter=""
153-
data-from=""
154-
data-headlessui-state="from enter transition"
154+
data-headlessui-state="closed enter transition"
155155
data-transition=""
156156
>
157157
Content
@@ -168,9 +168,9 @@ exports[`Setup API nested should yell at us when we forgot to forward the ref on
168168

169169
exports[`Setup API shallow should be possible to change the underlying DOM tag 1`] = `
170170
<span
171+
data-closed=""
171172
data-enter=""
172-
data-from=""
173-
data-headlessui-state="from enter transition"
173+
data-headlessui-state="closed enter transition"
174174
data-transition=""
175175
style=""
176176
>
@@ -180,9 +180,9 @@ exports[`Setup API shallow should be possible to change the underlying DOM tag 1
180180

181181
exports[`Setup API shallow should be possible to use a render prop 1`] = `
182182
<span
183+
data-closed=""
183184
data-enter=""
184-
data-from=""
185-
data-headlessui-state="from enter transition"
185+
data-headlessui-state="closed enter transition"
186186
data-transition=""
187187
>
188188
Children
@@ -192,9 +192,9 @@ exports[`Setup API shallow should be possible to use a render prop 1`] = `
192192
exports[`Setup API shallow should passthrough all the props (that we do not use internally) 1`] = `
193193
<div
194194
class="text-blue-400"
195+
data-closed=""
195196
data-enter=""
196-
data-from=""
197-
data-headlessui-state="from enter transition"
197+
data-headlessui-state="closed enter transition"
198198
data-transition=""
199199
id="root"
200200
style=""
@@ -206,9 +206,9 @@ exports[`Setup API shallow should passthrough all the props (that we do not use
206206
exports[`Setup API shallow should passthrough all the props (that we do not use internally) even when using an \`as\` prop 1`] = `
207207
<a
208208
class="text-blue-400"
209+
data-closed=""
209210
data-enter=""
210-
data-from=""
211-
data-headlessui-state="from enter transition"
211+
data-headlessui-state="closed enter transition"
212212
data-transition=""
213213
href="/"
214214
style=""
@@ -219,9 +219,9 @@ exports[`Setup API shallow should passthrough all the props (that we do not use
219219

220220
exports[`Setup API shallow should render another component if the \`as\` prop is used and its children by default 1`] = `
221221
<a
222+
data-closed=""
222223
data-enter=""
223-
data-from=""
224-
data-headlessui-state="from enter transition"
224+
data-headlessui-state="closed enter transition"
225225
data-transition=""
226226
style=""
227227
>
@@ -235,9 +235,9 @@ exports[`Setup API shallow should yell at us when we forget to forward the ref w
235235

236236
exports[`Setup API transition classes should be possible to passthrough the transition classes 1`] = `
237237
<div
238+
data-closed=""
238239
data-enter=""
239-
data-from=""
240-
data-headlessui-state="from enter transition"
240+
data-headlessui-state="closed enter transition"
241241
data-transition=""
242242
style=""
243243
>
@@ -248,8 +248,8 @@ exports[`Setup API transition classes should be possible to passthrough the tran
248248
exports[`Setup API transition classes should be possible to passthrough the transition classes and immediately apply the enter transitions when appear is set to true 1`] = `
249249
<div
250250
class="enter enter-from"
251-
data-from=""
252-
data-headlessui-state="from"
251+
data-closed=""
252+
data-headlessui-state="closed"
253253
style=""
254254
>
255255
Children

‎packages/@headlessui-react/src/components/transition/transition.test.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -358,9 +358,9 @@ describe('Setup API', () => {
358358
<div
359359
class="foo1
360360
foo2"
361+
data-closed=""
361362
data-enter=""
362-
data-from=""
363-
data-headlessui-state="from enter transition"
363+
data-headlessui-state="closed enter transition"
364364
data-transition=""
365365
style=""
366366
>
@@ -382,9 +382,9 @@ describe('Setup API', () => {
382382
<div
383383
class="foo1
384384
foo2 foo1 foo2 leave"
385+
data-closed=""
385386
data-enter=""
386-
data-from=""
387-
data-headlessui-state="from enter transition"
387+
data-headlessui-state="closed enter transition"
388388
data-transition=""
389389
style=""
390390
>

0 commit comments

Comments
 (0)