@atlaskit/focus-ring 1.4.0 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +143 -126
- package/LICENSE.md +6 -8
- package/dist/cjs/focus-ring.js +22 -4
- package/dist/es2019/focus-ring.js +22 -4
- package/dist/esm/focus-ring.js +22 -4
- package/dist/types/focus-ring.d.ts +4 -1
- package/dist/types-ts4.5/focus-ring.d.ts +4 -1
- package/package.json +78 -79
- package/report.api.md +12 -11
package/CHANGELOG.md
CHANGED
|
@@ -1,344 +1,361 @@
|
|
|
1
1
|
# @atlaskit/focus-ring
|
|
2
2
|
|
|
3
|
+
## 1.5.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#110670](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110670)
|
|
8
|
+
[`c733254a2dd6e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c733254a2dd6e) -
|
|
9
|
+
Explicitly set jsxRuntime to classic via pragma comments in order to avoid issues where jsxRuntime
|
|
10
|
+
is implicitly set to automatic.
|
|
11
|
+
|
|
12
|
+
## 1.4.1
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [#111297](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111297)
|
|
17
|
+
[`5f51c15a6d33f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5f51c15a6d33f) -
|
|
18
|
+
Adds a `:focus` style reset to prevent `:focus` styles with lower specificity from leaking
|
|
19
|
+
through.
|
|
20
|
+
|
|
3
21
|
## 1.4.0
|
|
4
22
|
|
|
5
23
|
### Minor Changes
|
|
6
24
|
|
|
7
|
-
-
|
|
8
|
-
|
|
9
|
-
|
|
25
|
+
- [#96204](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/96204)
|
|
26
|
+
[`a53c45efeac1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a53c45efeac1) -
|
|
27
|
+
Add support for React 18 in non-strict mode.
|
|
10
28
|
|
|
11
29
|
## 1.3.9
|
|
12
30
|
|
|
13
31
|
### Patch Changes
|
|
14
32
|
|
|
15
|
-
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
behaviour.
|
|
33
|
+
- [#83297](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83297)
|
|
34
|
+
[`6b1707c169e0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6b1707c169e0) -
|
|
35
|
+
The internal composition of this component has changed. There is no expected change in behaviour.
|
|
19
36
|
|
|
20
37
|
## 1.3.8
|
|
21
38
|
|
|
22
39
|
### Patch Changes
|
|
23
40
|
|
|
24
|
-
-
|
|
25
|
-
|
|
26
|
-
|
|
41
|
+
- [#83116](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83116)
|
|
42
|
+
[`8d4e99057fe0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8d4e99057fe0) -
|
|
43
|
+
Upgrade Typescript from `4.9.5` to `5.4.2`
|
|
27
44
|
|
|
28
45
|
## 1.3.7
|
|
29
46
|
|
|
30
47
|
### Patch Changes
|
|
31
48
|
|
|
32
|
-
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
49
|
+
- [#72130](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/72130)
|
|
50
|
+
[`b037e5451037`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b037e5451037) -
|
|
51
|
+
Update new button text color fallback for default theme (non-token) to match that of old button
|
|
52
|
+
current text color
|
|
36
53
|
|
|
37
54
|
## 1.3.6
|
|
38
55
|
|
|
39
56
|
### Patch Changes
|
|
40
57
|
|
|
41
|
-
-
|
|
42
|
-
|
|
43
|
-
|
|
58
|
+
- [#39309](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/39309)
|
|
59
|
+
[`1e90520801a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1e90520801a) - Added
|
|
60
|
+
this package into push model consumption.
|
|
44
61
|
|
|
45
62
|
## 1.3.5
|
|
46
63
|
|
|
47
64
|
### Patch Changes
|
|
48
65
|
|
|
49
|
-
-
|
|
50
|
-
|
|
51
|
-
|
|
66
|
+
- [#38098](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/38098)
|
|
67
|
+
[`63ee052ee1b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/63ee052ee1b) - Fix
|
|
68
|
+
focus-ring border width token with `border.width.outline`
|
|
52
69
|
|
|
53
70
|
## 1.3.4
|
|
54
71
|
|
|
55
72
|
### Patch Changes
|
|
56
73
|
|
|
57
|
-
-
|
|
58
|
-
|
|
59
|
-
|
|
74
|
+
- [#37186](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/37186)
|
|
75
|
+
[`ce22a54e852`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ce22a54e852) - [ux]
|
|
76
|
+
update focus ring outline border.focused fallback to B200 to meet contrast
|
|
60
77
|
|
|
61
78
|
## 1.3.3
|
|
62
79
|
|
|
63
80
|
### Patch Changes
|
|
64
81
|
|
|
65
|
-
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
82
|
+
- [#32935](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/32935)
|
|
83
|
+
[`b1bdec7cce2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b1bdec7cce2) - Internal
|
|
84
|
+
change to enforce token usage for spacing properties. There is no expected visual or behaviour
|
|
85
|
+
change.
|
|
69
86
|
|
|
70
87
|
## 1.3.2
|
|
71
88
|
|
|
72
89
|
### Patch Changes
|
|
73
90
|
|
|
74
|
-
-
|
|
75
|
-
|
|
76
|
-
|
|
91
|
+
- [#33793](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33793)
|
|
92
|
+
[`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure
|
|
93
|
+
legacy types are published for TS 4.5-4.8
|
|
77
94
|
|
|
78
95
|
## 1.3.1
|
|
79
96
|
|
|
80
97
|
### Patch Changes
|
|
81
98
|
|
|
82
|
-
-
|
|
83
|
-
|
|
84
|
-
|
|
99
|
+
- [#33649](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33649)
|
|
100
|
+
[`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) - Upgrade
|
|
101
|
+
Typescript from `4.5.5` to `4.9.5`
|
|
85
102
|
|
|
86
103
|
## 1.3.0
|
|
87
104
|
|
|
88
105
|
### Minor Changes
|
|
89
106
|
|
|
90
|
-
-
|
|
91
|
-
|
|
92
|
-
|
|
107
|
+
- [#33258](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33258)
|
|
108
|
+
[`56507598609`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56507598609) - Skip
|
|
109
|
+
minor dependency bump
|
|
93
110
|
|
|
94
111
|
### Patch Changes
|
|
95
112
|
|
|
96
|
-
-
|
|
113
|
+
- Updated dependencies
|
|
97
114
|
|
|
98
115
|
## 1.2.6
|
|
99
116
|
|
|
100
117
|
### Patch Changes
|
|
101
118
|
|
|
102
|
-
-
|
|
103
|
-
|
|
104
|
-
|
|
119
|
+
- [#31299](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/31299)
|
|
120
|
+
[`c23cf0b085d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c23cf0b085d) - Adds
|
|
121
|
+
display name to component for React devtools debugging.
|
|
105
122
|
|
|
106
123
|
## 1.2.5
|
|
107
124
|
|
|
108
125
|
### Patch Changes
|
|
109
126
|
|
|
110
|
-
-
|
|
111
|
-
|
|
112
|
-
|
|
127
|
+
- [#30125](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/30125)
|
|
128
|
+
[`7f5f23dcb68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7f5f23dcb68) -
|
|
129
|
+
Introduce shape tokens to some packages.
|
|
113
130
|
|
|
114
131
|
## 1.2.4
|
|
115
132
|
|
|
116
133
|
### Patch Changes
|
|
117
134
|
|
|
118
|
-
-
|
|
135
|
+
- Updated dependencies
|
|
119
136
|
|
|
120
137
|
## 1.2.3
|
|
121
138
|
|
|
122
139
|
### Patch Changes
|
|
123
140
|
|
|
124
|
-
-
|
|
141
|
+
- Updated dependencies
|
|
125
142
|
|
|
126
143
|
## 1.2.2
|
|
127
144
|
|
|
128
145
|
### Patch Changes
|
|
129
146
|
|
|
130
|
-
-
|
|
147
|
+
- Updated dependencies
|
|
131
148
|
|
|
132
149
|
## 1.2.1
|
|
133
150
|
|
|
134
151
|
### Patch Changes
|
|
135
152
|
|
|
136
|
-
-
|
|
153
|
+
- Updated dependencies
|
|
137
154
|
|
|
138
155
|
## 1.2.0
|
|
139
156
|
|
|
140
157
|
### Minor Changes
|
|
141
158
|
|
|
142
|
-
-
|
|
143
|
-
|
|
144
|
-
|
|
159
|
+
- [#26244](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/26244)
|
|
160
|
+
[`71bf011db22`](https://bitbucket.org/atlassian/atlassian-frontend/commits/71bf011db22) - Focus
|
|
161
|
+
ring inset styles are now applied via outline - consistent with offset styles.
|
|
145
162
|
|
|
146
163
|
## 1.1.0
|
|
147
164
|
|
|
148
165
|
### Minor Changes
|
|
149
166
|
|
|
150
|
-
-
|
|
151
|
-
|
|
152
|
-
|
|
167
|
+
- [#24710](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24710)
|
|
168
|
+
[`b5d79ded842`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b5d79ded842) - Updates
|
|
169
|
+
`@emotion/core` to `@emotion/react`; v10 to v11. There is no expected behavior change.
|
|
153
170
|
|
|
154
171
|
## 1.0.7
|
|
155
172
|
|
|
156
173
|
### Patch Changes
|
|
157
174
|
|
|
158
|
-
-
|
|
159
|
-
|
|
160
|
-
|
|
175
|
+
- [#24874](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24874)
|
|
176
|
+
[`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade
|
|
177
|
+
Typescript from `4.3.5` to `4.5.5`
|
|
161
178
|
|
|
162
179
|
## 1.0.6
|
|
163
180
|
|
|
164
181
|
### Patch Changes
|
|
165
182
|
|
|
166
|
-
-
|
|
167
|
-
|
|
168
|
-
|
|
183
|
+
- [#24492](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24492)
|
|
184
|
+
[`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade
|
|
185
|
+
Typescript from `4.2.4` to `4.3.5`.
|
|
169
186
|
|
|
170
187
|
## 1.0.5
|
|
171
188
|
|
|
172
189
|
### Patch Changes
|
|
173
190
|
|
|
174
|
-
-
|
|
191
|
+
- Updated dependencies
|
|
175
192
|
|
|
176
193
|
## 1.0.4
|
|
177
194
|
|
|
178
195
|
### Patch Changes
|
|
179
196
|
|
|
180
|
-
-
|
|
181
|
-
|
|
182
|
-
|
|
197
|
+
- [#20650](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/20650)
|
|
198
|
+
[`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) - Upgrade
|
|
199
|
+
to TypeScript 4.2.4
|
|
183
200
|
|
|
184
201
|
## 1.0.3
|
|
185
202
|
|
|
186
203
|
### Patch Changes
|
|
187
204
|
|
|
188
|
-
-
|
|
205
|
+
- Updated dependencies
|
|
189
206
|
|
|
190
207
|
## 1.0.2
|
|
191
208
|
|
|
192
209
|
### Patch Changes
|
|
193
210
|
|
|
194
|
-
-
|
|
211
|
+
- Updated dependencies
|
|
195
212
|
|
|
196
213
|
## 1.0.1
|
|
197
214
|
|
|
198
215
|
### Patch Changes
|
|
199
216
|
|
|
200
|
-
-
|
|
217
|
+
- Updated dependencies
|
|
201
218
|
|
|
202
219
|
## 1.0.0
|
|
203
220
|
|
|
204
221
|
### Major Changes
|
|
205
222
|
|
|
206
|
-
-
|
|
207
|
-
|
|
208
|
-
|
|
223
|
+
- [#16752](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/16752)
|
|
224
|
+
[`3e1a93c6b67`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3e1a93c6b67) - Releases
|
|
225
|
+
FocusRing to v1.
|
|
209
226
|
|
|
210
227
|
### Minor Changes
|
|
211
228
|
|
|
212
|
-
-
|
|
213
|
-
|
|
214
|
-
|
|
229
|
+
- [`63b8679585b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/63b8679585b) - Adds an
|
|
230
|
+
additional prop `focus` to the `FocusRing` to allow the component to also be controlled. This prop
|
|
231
|
+
is designed to be used in conjunction with a complementary hook; `useFocusRing`.
|
|
215
232
|
|
|
216
233
|
## 0.2.7
|
|
217
234
|
|
|
218
235
|
### Patch Changes
|
|
219
236
|
|
|
220
|
-
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
-
|
|
237
|
+
- [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - Updates
|
|
238
|
+
usage of deprecated token names so they're aligned with the latest naming conventions. No UI or
|
|
239
|
+
visual changes
|
|
240
|
+
- [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - [ux] The
|
|
241
|
+
component has reworked its internal so that it can now better deal with issues where the
|
|
242
|
+
background-color was obscured by the focus-ring box shadow.
|
|
243
|
+
- Updated dependencies
|
|
227
244
|
|
|
228
245
|
## 0.2.6
|
|
229
246
|
|
|
230
247
|
### Patch Changes
|
|
231
248
|
|
|
232
|
-
-
|
|
249
|
+
- Updated dependencies
|
|
233
250
|
|
|
234
251
|
## 0.2.5
|
|
235
252
|
|
|
236
253
|
### Patch Changes
|
|
237
254
|
|
|
238
|
-
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
-
|
|
255
|
+
- [#15998](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/15998)
|
|
256
|
+
[`f460cc7c411`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f460cc7c411) - Builds
|
|
257
|
+
for this package now pass through a tokens babel plugin, removing runtime invocations of the
|
|
258
|
+
tokens() function and improving bundle size.
|
|
259
|
+
- Updated dependencies
|
|
243
260
|
|
|
244
261
|
## 0.2.4
|
|
245
262
|
|
|
246
263
|
### Patch Changes
|
|
247
264
|
|
|
248
|
-
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
-
|
|
265
|
+
- [#14777](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/14777)
|
|
266
|
+
[`6c1c909296d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6c1c909296d) - [ux]
|
|
267
|
+
When composing elements that define class name they will now be correctly retained.
|
|
268
|
+
- Updated dependencies
|
|
252
269
|
|
|
253
270
|
## 0.2.3
|
|
254
271
|
|
|
255
272
|
### Patch Changes
|
|
256
273
|
|
|
257
|
-
-
|
|
258
|
-
|
|
259
|
-
|
|
274
|
+
- [#15632](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/15632)
|
|
275
|
+
[`34282240102`](https://bitbucket.org/atlassian/atlassian-frontend/commits/34282240102) - Adds
|
|
276
|
+
explicit type to button usages components.
|
|
260
277
|
|
|
261
278
|
## 0.2.2
|
|
262
279
|
|
|
263
280
|
### Patch Changes
|
|
264
281
|
|
|
265
|
-
-
|
|
282
|
+
- Updated dependencies
|
|
266
283
|
|
|
267
284
|
## 0.2.1
|
|
268
285
|
|
|
269
286
|
### Patch Changes
|
|
270
287
|
|
|
271
|
-
-
|
|
288
|
+
- Updated dependencies
|
|
272
289
|
|
|
273
290
|
## 0.2.0
|
|
274
291
|
|
|
275
292
|
### Minor Changes
|
|
276
293
|
|
|
277
|
-
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
-
|
|
282
|
-
|
|
294
|
+
- [#13302](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/13302)
|
|
295
|
+
[`c765dce3afb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c765dce3afb) - [ux]
|
|
296
|
+
Focus Ring now exposes an additional prop `isInset` to support inset focus states; for example on
|
|
297
|
+
inputs, or textfields.
|
|
298
|
+
- [`0dac09c47b6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0dac09c47b6) - [ux]
|
|
299
|
+
Colors are now sourced through tokens.
|
|
283
300
|
|
|
284
301
|
### Patch Changes
|
|
285
302
|
|
|
286
|
-
-
|
|
303
|
+
- Updated dependencies
|
|
287
304
|
|
|
288
305
|
## 0.1.1
|
|
289
306
|
|
|
290
307
|
### Patch Changes
|
|
291
308
|
|
|
292
|
-
-
|
|
293
|
-
|
|
294
|
-
|
|
309
|
+
- [#13232](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/13232)
|
|
310
|
+
[`9c9296f2959`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9c9296f2959) - Fix bug
|
|
311
|
+
where the package was being exported from the wrong file.
|
|
295
312
|
|
|
296
313
|
## 0.1.0
|
|
297
314
|
|
|
298
315
|
### Minor Changes
|
|
299
316
|
|
|
300
|
-
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
-
|
|
304
|
-
|
|
305
|
-
|
|
317
|
+
- [#12837](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12837)
|
|
318
|
+
[`5ab09801cfa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5ab09801cfa) - [ux]
|
|
319
|
+
Updates focus-ring to use an offset box-shadow for its focus state.
|
|
320
|
+
- [`adaa7913de0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/adaa7913de0) - Initial
|
|
321
|
+
release for the package. A Focus Ring can be used to compose focusable elements with a simple
|
|
322
|
+
composable API.
|
|
306
323
|
|
|
307
324
|
### Patch Changes
|
|
308
325
|
|
|
309
|
-
-
|
|
326
|
+
- Updated dependencies
|
|
310
327
|
|
|
311
328
|
## 0.0.4
|
|
312
329
|
|
|
313
330
|
### Patch Changes
|
|
314
331
|
|
|
315
|
-
-
|
|
316
|
-
|
|
317
|
-
|
|
332
|
+
- [#8306](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/8306)
|
|
333
|
+
[`229b32842b5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/229b32842b5) - Fix
|
|
334
|
+
.npmignore and tsconfig.json for **tests**
|
|
318
335
|
|
|
319
336
|
## 0.0.3
|
|
320
337
|
|
|
321
338
|
### Patch Changes
|
|
322
339
|
|
|
323
|
-
-
|
|
324
|
-
|
|
325
|
-
|
|
340
|
+
- [#5857](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5857)
|
|
341
|
+
[`d3265f19be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3265f19be) - Transpile
|
|
342
|
+
packages using babel rather than tsc
|
|
326
343
|
|
|
327
344
|
## 0.0.2
|
|
328
345
|
|
|
329
346
|
### Patch Changes
|
|
330
347
|
|
|
331
|
-
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
348
|
+
- [#5497](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5497)
|
|
349
|
+
[`5f58283e1f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f58283e1f) - Export
|
|
350
|
+
types using Typescript's new "export type" syntax to satisfy Typescript's --isolatedModules
|
|
351
|
+
compiler option. This requires version 3.8 of Typescript, read more about how we handle Typescript
|
|
352
|
+
versions here: https://atlaskit.atlassian.com/get-started Also add `typescript` to
|
|
353
|
+
`devDependencies` to denote version that the package was built with.
|
|
337
354
|
|
|
338
355
|
## 0.0.1
|
|
339
356
|
|
|
340
357
|
### Patch Changes
|
|
341
358
|
|
|
342
|
-
-
|
|
343
|
-
|
|
344
|
-
|
|
359
|
+
- [#4967](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/4967)
|
|
360
|
+
[`b443b5a60f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b443b5a60f) - Renamed
|
|
361
|
+
template package
|
package/LICENSE.md
CHANGED
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
Copyright 2020 Atlassian Pty Ltd
|
|
2
2
|
|
|
3
|
-
Licensed under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
|
|
5
|
-
You may obtain a copy of the License at
|
|
3
|
+
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in
|
|
4
|
+
compliance with the License. You may obtain a copy of the License at
|
|
6
5
|
|
|
7
6
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
8
7
|
|
|
9
|
-
Unless required by applicable law or agreed to in writing, software
|
|
10
|
-
distributed
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
limitations under the License.
|
|
8
|
+
Unless required by applicable law or agreed to in writing, software distributed under the License is
|
|
9
|
+
distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
|
10
|
+
implied. See the License for the specific language governing permissions and limitations under the
|
|
11
|
+
License.
|
package/dist/cjs/focus-ring.js
CHANGED
|
@@ -6,8 +6,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _react = require("react");
|
|
8
8
|
var _react2 = require("@emotion/react");
|
|
9
|
+
/**
|
|
10
|
+
* @jsxRuntime classic
|
|
11
|
+
*/
|
|
9
12
|
/** @jsx jsx */
|
|
10
13
|
|
|
14
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
15
|
+
|
|
11
16
|
var BORDER_WIDTH = 2;
|
|
12
17
|
var baseFocusOutsideStyles = (0, _react2.css)({
|
|
13
18
|
outline: "".concat(BORDER_WIDTH, "px solid ", "var(--ds-border-focused, #2684FF)"),
|
|
@@ -15,14 +20,21 @@ var baseFocusOutsideStyles = (0, _react2.css)({
|
|
|
15
20
|
});
|
|
16
21
|
var baseInsetStyles = (0, _react2.css)({
|
|
17
22
|
outlineColor: "var(--ds-border-focused, #2684FF)",
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
18
24
|
outlineOffset: -BORDER_WIDTH,
|
|
19
25
|
outlineStyle: 'solid',
|
|
20
26
|
outlineWidth: "var(--ds-border-width-outline, 2px)"
|
|
21
27
|
});
|
|
22
28
|
var focusRingStyles = (0, _react2.css)({
|
|
29
|
+
// Focus styles used when :focus-visible isn't supported
|
|
30
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
31
|
+
'&:focus': baseFocusOutsideStyles,
|
|
32
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
23
33
|
'&:focus-visible': baseFocusOutsideStyles,
|
|
24
|
-
|
|
25
|
-
|
|
34
|
+
// Remove default focus styles for mouse interactions if :focus-visible is supported
|
|
35
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
36
|
+
'&:focus:not(:focus-visible)': {
|
|
37
|
+
outline: 'none'
|
|
26
38
|
},
|
|
27
39
|
'@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)': {
|
|
28
40
|
'&:focus-visible': {
|
|
@@ -31,9 +43,15 @@ var focusRingStyles = (0, _react2.css)({
|
|
|
31
43
|
}
|
|
32
44
|
});
|
|
33
45
|
var insetFocusRingStyles = (0, _react2.css)({
|
|
46
|
+
// Focus styles used when :focus-visible isn't supported
|
|
47
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
48
|
+
'&:focus': baseInsetStyles,
|
|
49
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
34
50
|
'&:focus-visible': baseInsetStyles,
|
|
35
|
-
|
|
36
|
-
|
|
51
|
+
// Remove default focus styles for mouse interactions if :focus-visible is supported
|
|
52
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
53
|
+
'&:focus:not(:focus-visible)': {
|
|
54
|
+
outline: 'none'
|
|
37
55
|
},
|
|
38
56
|
'@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)': {
|
|
39
57
|
'&:focus-visible': {
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
import { Children, cloneElement, memo } from 'react';
|
|
6
|
+
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
8
|
import { ClassNames, css, jsx } from '@emotion/react';
|
|
4
9
|
const BORDER_WIDTH = 2;
|
|
5
10
|
const baseFocusOutsideStyles = css({
|
|
@@ -8,14 +13,21 @@ const baseFocusOutsideStyles = css({
|
|
|
8
13
|
});
|
|
9
14
|
const baseInsetStyles = css({
|
|
10
15
|
outlineColor: "var(--ds-border-focused, #2684FF)",
|
|
16
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
11
17
|
outlineOffset: -BORDER_WIDTH,
|
|
12
18
|
outlineStyle: 'solid',
|
|
13
19
|
outlineWidth: "var(--ds-border-width-outline, 2px)"
|
|
14
20
|
});
|
|
15
21
|
const focusRingStyles = css({
|
|
22
|
+
// Focus styles used when :focus-visible isn't supported
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
24
|
+
'&:focus': baseFocusOutsideStyles,
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
16
26
|
'&:focus-visible': baseFocusOutsideStyles,
|
|
17
|
-
|
|
18
|
-
|
|
27
|
+
// Remove default focus styles for mouse interactions if :focus-visible is supported
|
|
28
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
29
|
+
'&:focus:not(:focus-visible)': {
|
|
30
|
+
outline: 'none'
|
|
19
31
|
},
|
|
20
32
|
'@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)': {
|
|
21
33
|
'&:focus-visible': {
|
|
@@ -24,9 +36,15 @@ const focusRingStyles = css({
|
|
|
24
36
|
}
|
|
25
37
|
});
|
|
26
38
|
const insetFocusRingStyles = css({
|
|
39
|
+
// Focus styles used when :focus-visible isn't supported
|
|
40
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
41
|
+
'&:focus': baseInsetStyles,
|
|
42
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
27
43
|
'&:focus-visible': baseInsetStyles,
|
|
28
|
-
|
|
29
|
-
|
|
44
|
+
// Remove default focus styles for mouse interactions if :focus-visible is supported
|
|
45
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
46
|
+
'&:focus:not(:focus-visible)': {
|
|
47
|
+
outline: 'none'
|
|
30
48
|
},
|
|
31
49
|
'@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)': {
|
|
32
50
|
'&:focus-visible': {
|
package/dist/esm/focus-ring.js
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
import { Children, cloneElement, memo } from 'react';
|
|
6
|
+
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
8
|
import { ClassNames, css, jsx } from '@emotion/react';
|
|
4
9
|
var BORDER_WIDTH = 2;
|
|
5
10
|
var baseFocusOutsideStyles = css({
|
|
@@ -8,14 +13,21 @@ var baseFocusOutsideStyles = css({
|
|
|
8
13
|
});
|
|
9
14
|
var baseInsetStyles = css({
|
|
10
15
|
outlineColor: "var(--ds-border-focused, #2684FF)",
|
|
16
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
11
17
|
outlineOffset: -BORDER_WIDTH,
|
|
12
18
|
outlineStyle: 'solid',
|
|
13
19
|
outlineWidth: "var(--ds-border-width-outline, 2px)"
|
|
14
20
|
});
|
|
15
21
|
var focusRingStyles = css({
|
|
22
|
+
// Focus styles used when :focus-visible isn't supported
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
24
|
+
'&:focus': baseFocusOutsideStyles,
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
16
26
|
'&:focus-visible': baseFocusOutsideStyles,
|
|
17
|
-
|
|
18
|
-
|
|
27
|
+
// Remove default focus styles for mouse interactions if :focus-visible is supported
|
|
28
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
29
|
+
'&:focus:not(:focus-visible)': {
|
|
30
|
+
outline: 'none'
|
|
19
31
|
},
|
|
20
32
|
'@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)': {
|
|
21
33
|
'&:focus-visible': {
|
|
@@ -24,9 +36,15 @@ var focusRingStyles = css({
|
|
|
24
36
|
}
|
|
25
37
|
});
|
|
26
38
|
var insetFocusRingStyles = css({
|
|
39
|
+
// Focus styles used when :focus-visible isn't supported
|
|
40
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
41
|
+
'&:focus': baseInsetStyles,
|
|
42
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
27
43
|
'&:focus-visible': baseInsetStyles,
|
|
28
|
-
|
|
29
|
-
|
|
44
|
+
// Remove default focus styles for mouse interactions if :focus-visible is supported
|
|
45
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
46
|
+
'&:focus:not(:focus-visible)': {
|
|
47
|
+
outline: 'none'
|
|
30
48
|
},
|
|
31
49
|
'@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)': {
|
|
32
50
|
'&:focus-visible': {
|
package/package.json
CHANGED
|
@@ -1,80 +1,79 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
}
|
|
2
|
+
"name": "@atlaskit/focus-ring",
|
|
3
|
+
"version": "1.5.0",
|
|
4
|
+
"description": "A focus ring is used to indicate the currently focused item.",
|
|
5
|
+
"author": "Atlassian Pty Ltd",
|
|
6
|
+
"license": "Apache-2.0",
|
|
7
|
+
"publishConfig": {
|
|
8
|
+
"registry": "https://registry.npmjs.org/"
|
|
9
|
+
},
|
|
10
|
+
"atlassian": {
|
|
11
|
+
"team": "Design System Team",
|
|
12
|
+
"releaseModel": "continuous",
|
|
13
|
+
"productPushConsumption": [
|
|
14
|
+
"jira"
|
|
15
|
+
],
|
|
16
|
+
"website": {
|
|
17
|
+
"name": "Focus ring",
|
|
18
|
+
"category": "Components"
|
|
19
|
+
},
|
|
20
|
+
"runReact18": true
|
|
21
|
+
},
|
|
22
|
+
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
23
|
+
"main": "dist/cjs/index.js",
|
|
24
|
+
"module": "dist/esm/index.js",
|
|
25
|
+
"module:es2019": "dist/es2019/index.js",
|
|
26
|
+
"types": "dist/types/index.d.ts",
|
|
27
|
+
"typesVersions": {
|
|
28
|
+
">=4.5 <4.9": {
|
|
29
|
+
"*": [
|
|
30
|
+
"dist/types-ts4.5/*",
|
|
31
|
+
"dist/types-ts4.5/index.d.ts"
|
|
32
|
+
]
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
"sideEffects": false,
|
|
36
|
+
"atlaskit:src": "src/index.tsx",
|
|
37
|
+
"af:exports": {
|
|
38
|
+
".": "./src/index.tsx"
|
|
39
|
+
},
|
|
40
|
+
"dependencies": {
|
|
41
|
+
"@atlaskit/tokens": "^1.51.0",
|
|
42
|
+
"@babel/runtime": "^7.0.0",
|
|
43
|
+
"@emotion/react": "^11.7.1"
|
|
44
|
+
},
|
|
45
|
+
"peerDependencies": {
|
|
46
|
+
"react": "^16.8.0 || ^17.0.0 || ~18.2.0"
|
|
47
|
+
},
|
|
48
|
+
"devDependencies": {
|
|
49
|
+
"@af/accessibility-testing": "*",
|
|
50
|
+
"@af/visual-regression": "*",
|
|
51
|
+
"@atlaskit/textfield": "^6.4.0",
|
|
52
|
+
"@testing-library/react": "^12.1.5",
|
|
53
|
+
"react-dom": "^16.8.0",
|
|
54
|
+
"typescript": "~5.4.2",
|
|
55
|
+
"wait-for-expect": "^1.2.0"
|
|
56
|
+
},
|
|
57
|
+
"techstack": {
|
|
58
|
+
"@atlassian/frontend": {
|
|
59
|
+
"import-structure": "atlassian-conventions",
|
|
60
|
+
"circular-dependencies": "file-and-folder-level"
|
|
61
|
+
},
|
|
62
|
+
"@repo/internal": {
|
|
63
|
+
"dom-events": "use-bind-event-listener",
|
|
64
|
+
"design-system": "v1",
|
|
65
|
+
"styling": [
|
|
66
|
+
"static",
|
|
67
|
+
"emotion"
|
|
68
|
+
],
|
|
69
|
+
"ui-components": "lite-mode",
|
|
70
|
+
"analytics": "analytics-next",
|
|
71
|
+
"design-tokens": [
|
|
72
|
+
"color",
|
|
73
|
+
"spacing"
|
|
74
|
+
],
|
|
75
|
+
"deprecation": "no-deprecated-imports"
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
"homepage": "https://atlaskit.atlassian.com/packages/design-system/focus-ring"
|
|
79
|
+
}
|
package/report.api.md
CHANGED
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
## API Report File for "@atlaskit/focus-ring"
|
|
4
4
|
|
|
5
|
-
> Do not edit this file. This report is auto-generated using
|
|
5
|
+
> Do not edit this file. This report is auto-generated using
|
|
6
|
+
> [API Extractor](https://api-extractor.com/).
|
|
6
7
|
> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
|
|
7
8
|
|
|
8
9
|
### Table of contents
|
|
@@ -21,10 +22,10 @@ import type { ReactElement } from 'react';
|
|
|
21
22
|
|
|
22
23
|
// @public (undocumented)
|
|
23
24
|
export interface FocusEventHandlers {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
25
|
+
// (undocumented)
|
|
26
|
+
onBlur: FocusEventHandler;
|
|
27
|
+
// (undocumented)
|
|
28
|
+
onFocus: FocusEventHandler;
|
|
28
29
|
}
|
|
29
30
|
|
|
30
31
|
// @public
|
|
@@ -33,9 +34,9 @@ export default FocusRing;
|
|
|
33
34
|
|
|
34
35
|
// @public (undocumented)
|
|
35
36
|
export interface FocusRingProps {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
37
|
+
children: ReactElement;
|
|
38
|
+
focus?: FocusState;
|
|
39
|
+
isInset?: boolean;
|
|
39
40
|
}
|
|
40
41
|
|
|
41
42
|
// @public (undocumented)
|
|
@@ -43,8 +44,8 @@ export type FocusState = 'off' | 'on';
|
|
|
43
44
|
|
|
44
45
|
// @public
|
|
45
46
|
export const useFocusRing: (initialState?: FocusState) => {
|
|
46
|
-
|
|
47
|
-
|
|
47
|
+
readonly focusState: 'off' | 'on';
|
|
48
|
+
readonly focusProps: FocusEventHandlers;
|
|
48
49
|
};
|
|
49
50
|
|
|
50
51
|
// (No @packageDocumentation comment for this package)
|
|
@@ -58,7 +59,7 @@ export const useFocusRing: (initialState?: FocusState) => {
|
|
|
58
59
|
|
|
59
60
|
```json
|
|
60
61
|
{
|
|
61
|
-
|
|
62
|
+
"react": "^16.8.0"
|
|
62
63
|
}
|
|
63
64
|
```
|
|
64
65
|
|