@atlaskit/range 7.1.7 → 7.2.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 +317 -180
- package/afm-cc/tsconfig.json +31 -0
- package/constellation/index/examples.mdx +3 -1
- package/constellation/index/usage.mdx +13 -9
- package/dist/cjs/range.js +7 -7
- package/dist/cjs/styled.js +5 -6
- package/dist/cjs/theme.js +5 -9
- package/dist/es2019/range.js +1 -0
- package/dist/esm/range.js +3 -2
- package/dist/esm/styled.js +2 -2
- package/package.json +10 -7
- package/range/package.json +1 -1
- package/styled/package.json +1 -1
- package/theme/package.json +1 -1
- package/tmp/api-report-tmp.d.ts +0 -33
package/CHANGELOG.md
CHANGED
|
@@ -1,552 +1,689 @@
|
|
|
1
1
|
# @atlaskit/range
|
|
2
2
|
|
|
3
|
+
## 7.2.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#93978](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/93978)
|
|
8
|
+
[`1a198c473f9d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1a198c473f9d) -
|
|
9
|
+
Add support for React 18.
|
|
10
|
+
|
|
11
|
+
## 7.1.8
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [#83116](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83116)
|
|
16
|
+
[`8d4e99057fe0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8d4e99057fe0) -
|
|
17
|
+
Upgrade Typescript from `4.9.5` to `5.4.2`
|
|
18
|
+
|
|
3
19
|
## 7.1.7
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
6
22
|
|
|
7
|
-
-
|
|
23
|
+
- [#38731](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/38731)
|
|
24
|
+
[`9af31f3c1ae`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9af31f3c1ae) - Delete
|
|
25
|
+
version.json
|
|
8
26
|
|
|
9
27
|
## 7.1.6
|
|
10
28
|
|
|
11
29
|
### Patch Changes
|
|
12
30
|
|
|
13
|
-
-
|
|
31
|
+
- [#38201](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/38201)
|
|
32
|
+
[`356d6ebed05`](https://bitbucket.org/atlassian/atlassian-frontend/commits/356d6ebed05) - This
|
|
33
|
+
package is now onboarded onto the product push model.
|
|
14
34
|
|
|
15
35
|
## 7.1.5
|
|
16
36
|
|
|
17
37
|
### Patch Changes
|
|
18
38
|
|
|
19
|
-
-
|
|
39
|
+
- [#36754](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/36754)
|
|
40
|
+
[`4ae083a7e66`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4ae083a7e66) - Use
|
|
41
|
+
`@af/accessibility-testing` for default jest-axe config and jest-axe import in accessibility
|
|
42
|
+
testing.
|
|
20
43
|
|
|
21
44
|
## 7.1.4
|
|
22
45
|
|
|
23
46
|
### Patch Changes
|
|
24
47
|
|
|
25
|
-
-
|
|
48
|
+
- [#35441](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/35441)
|
|
49
|
+
[`599bfe90ee3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/599bfe90ee3) -
|
|
50
|
+
Internal change to use shape tokens. There is no expected visual change.
|
|
26
51
|
|
|
27
52
|
## 7.1.3
|
|
28
53
|
|
|
29
54
|
### Patch Changes
|
|
30
55
|
|
|
31
|
-
-
|
|
56
|
+
- [#32935](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/32935)
|
|
57
|
+
[`b1bdec7cce2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b1bdec7cce2) -
|
|
58
|
+
Internal change to enforce token usage for spacing properties. There is no expected visual or
|
|
59
|
+
behaviour change.
|
|
32
60
|
|
|
33
61
|
## 7.1.2
|
|
34
62
|
|
|
35
63
|
### Patch Changes
|
|
36
64
|
|
|
37
|
-
-
|
|
65
|
+
- [#33793](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33793)
|
|
66
|
+
[`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure
|
|
67
|
+
legacy types are published for TS 4.5-4.8
|
|
38
68
|
|
|
39
69
|
## 7.1.1
|
|
40
70
|
|
|
41
71
|
### Patch Changes
|
|
42
72
|
|
|
43
|
-
-
|
|
73
|
+
- [#33649](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33649)
|
|
74
|
+
[`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) -
|
|
75
|
+
Upgrade Typescript from `4.5.5` to `4.9.5`
|
|
44
76
|
|
|
45
77
|
## 7.1.0
|
|
46
78
|
|
|
47
79
|
### Minor Changes
|
|
48
80
|
|
|
49
|
-
-
|
|
81
|
+
- [#33258](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33258)
|
|
82
|
+
[`56507598609`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56507598609) - Skip
|
|
83
|
+
minor dependency bump
|
|
50
84
|
|
|
51
85
|
### Patch Changes
|
|
52
86
|
|
|
53
|
-
-
|
|
87
|
+
- Updated dependencies
|
|
54
88
|
|
|
55
89
|
## 7.0.4
|
|
56
90
|
|
|
57
91
|
### Patch Changes
|
|
58
92
|
|
|
59
|
-
-
|
|
60
|
-
-
|
|
93
|
+
- [#27634](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/27634)
|
|
94
|
+
[`22b754d311f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/22b754d311f) -
|
|
95
|
+
Updates usage of removed design token `utilities.UNSAFE_util.transparent` in favour of its
|
|
96
|
+
replacement `utilities.UNSAFE.transparent`
|
|
97
|
+
- Updated dependencies
|
|
61
98
|
|
|
62
99
|
## 7.0.3
|
|
63
100
|
|
|
64
101
|
### Patch Changes
|
|
65
102
|
|
|
66
|
-
-
|
|
103
|
+
- Updated dependencies
|
|
67
104
|
|
|
68
105
|
## 7.0.2
|
|
69
106
|
|
|
70
107
|
### Patch Changes
|
|
71
108
|
|
|
72
|
-
-
|
|
109
|
+
- Updated dependencies
|
|
73
110
|
|
|
74
111
|
## 7.0.1
|
|
75
112
|
|
|
76
113
|
### Patch Changes
|
|
77
114
|
|
|
78
|
-
-
|
|
115
|
+
- Updated dependencies
|
|
79
116
|
|
|
80
117
|
## 7.0.0
|
|
81
118
|
|
|
82
119
|
### Major Changes
|
|
83
120
|
|
|
84
|
-
-
|
|
121
|
+
- [#25860](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/25860)
|
|
122
|
+
[`78741dd1644`](https://bitbucket.org/atlassian/atlassian-frontend/commits/78741dd1644) - [ux]
|
|
123
|
+
Breaking visual changes to range to afford better contrast:
|
|
85
124
|
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
125
|
+
- The scrubber now applies the same color as the foreground
|
|
126
|
+
- The disabled state has been altered; it's now a consistently applied opacity state overlay
|
|
127
|
+
across the whole element
|
|
128
|
+
- The input now uses :focus-visible, rather than :focus and applies an offset focus ring
|
|
89
129
|
|
|
90
130
|
## 6.1.1
|
|
91
131
|
|
|
92
132
|
### Patch Changes
|
|
93
133
|
|
|
94
|
-
-
|
|
134
|
+
- [#26303](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/26303)
|
|
135
|
+
[`9827dcb82b8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9827dcb82b8) - No-op
|
|
136
|
+
change to introduce spacing tokens to design system components.
|
|
95
137
|
|
|
96
138
|
## 6.1.0
|
|
97
139
|
|
|
98
140
|
### Minor Changes
|
|
99
141
|
|
|
100
|
-
-
|
|
142
|
+
- [#24710](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24710)
|
|
143
|
+
[`1966ffa850d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1966ffa850d) -
|
|
144
|
+
Updates `@emotion/core` to `@emotion/react`; v10 to v11. There is no expected behavior change.
|
|
101
145
|
|
|
102
146
|
## 6.0.9
|
|
103
147
|
|
|
104
148
|
### Patch Changes
|
|
105
149
|
|
|
106
|
-
-
|
|
150
|
+
- [#24874](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24874)
|
|
151
|
+
[`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) -
|
|
152
|
+
Upgrade Typescript from `4.3.5` to `4.5.5`
|
|
107
153
|
|
|
108
154
|
## 6.0.8
|
|
109
155
|
|
|
110
156
|
### Patch Changes
|
|
111
157
|
|
|
112
|
-
-
|
|
158
|
+
- [#24492](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24492)
|
|
159
|
+
[`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) -
|
|
160
|
+
Upgrade Typescript from `4.2.4` to `4.3.5`.
|
|
113
161
|
|
|
114
162
|
## 6.0.7
|
|
115
163
|
|
|
116
164
|
### Patch Changes
|
|
117
165
|
|
|
118
|
-
-
|
|
119
|
-
-
|
|
166
|
+
- [#23381](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/23381)
|
|
167
|
+
[`8202e37941b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8202e37941b) -
|
|
168
|
+
Internal code change turning on new linting rules.
|
|
169
|
+
- Updated dependencies
|
|
120
170
|
|
|
121
171
|
## 6.0.6
|
|
122
172
|
|
|
123
173
|
### Patch Changes
|
|
124
174
|
|
|
125
|
-
-
|
|
175
|
+
- [#22642](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/22642)
|
|
176
|
+
[`45ebe7af434`](https://bitbucket.org/atlassian/atlassian-frontend/commits/45ebe7af434) - Moved
|
|
177
|
+
to using declarative entrypoints internally. Public API is unchanged.
|
|
126
178
|
|
|
127
179
|
## 6.0.5
|
|
128
180
|
|
|
129
181
|
### Patch Changes
|
|
130
182
|
|
|
131
|
-
-
|
|
183
|
+
- Updated dependencies
|
|
132
184
|
|
|
133
185
|
## 6.0.4
|
|
134
186
|
|
|
135
187
|
### Patch Changes
|
|
136
188
|
|
|
137
|
-
-
|
|
189
|
+
- [#20650](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/20650)
|
|
190
|
+
[`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) -
|
|
191
|
+
Upgrade to TypeScript 4.2.4
|
|
138
192
|
|
|
139
193
|
## 6.0.3
|
|
140
194
|
|
|
141
195
|
### Patch Changes
|
|
142
196
|
|
|
143
|
-
-
|
|
197
|
+
- Updated dependencies
|
|
144
198
|
|
|
145
199
|
## 6.0.2
|
|
146
200
|
|
|
147
201
|
### Patch Changes
|
|
148
202
|
|
|
149
|
-
-
|
|
203
|
+
- Updated dependencies
|
|
150
204
|
|
|
151
205
|
## 6.0.1
|
|
152
206
|
|
|
153
207
|
### Patch Changes
|
|
154
208
|
|
|
155
|
-
-
|
|
209
|
+
- Updated dependencies
|
|
156
210
|
|
|
157
211
|
## 6.0.0
|
|
158
212
|
|
|
159
213
|
### Major Changes
|
|
160
214
|
|
|
161
|
-
-
|
|
162
|
-
|
|
215
|
+
- [#18526](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/18526)
|
|
216
|
+
[`17d9edaa415`](https://bitbucket.org/atlassian/atlassian-frontend/commits/17d9edaa415) - In
|
|
217
|
+
preparation for compiled adoption, internal styling has been rewritten to remove dynamic styles.
|
|
218
|
+
This includes custom theming using the `theme` prop, which has been removed.
|
|
163
219
|
|
|
164
|
-
|
|
220
|
+
If you are not using the `theme` prop, there should be no breaking changes.
|
|
165
221
|
|
|
166
222
|
## 5.1.4
|
|
167
223
|
|
|
168
224
|
### Patch Changes
|
|
169
225
|
|
|
170
|
-
-
|
|
171
|
-
|
|
172
|
-
-
|
|
226
|
+
- [#16752](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/16752)
|
|
227
|
+
[`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - The
|
|
228
|
+
no-unsafe-design-token-usage eslint rule now respects the new token naming conventions when
|
|
229
|
+
auto-fixing by correctly formatting token ids.
|
|
230
|
+
- [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - The
|
|
231
|
+
no-unsafe-design-token-usage eslint rule now respects the new token naming conventions when
|
|
232
|
+
auto-fixing by correctly formatting token ids.
|
|
233
|
+
- Updated dependencies
|
|
173
234
|
|
|
174
235
|
## 5.1.3
|
|
175
236
|
|
|
176
237
|
### Patch Changes
|
|
177
238
|
|
|
178
|
-
-
|
|
239
|
+
- Updated dependencies
|
|
179
240
|
|
|
180
241
|
## 5.1.2
|
|
181
242
|
|
|
182
243
|
### Patch Changes
|
|
183
244
|
|
|
184
|
-
-
|
|
245
|
+
- [#17475](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/17475)
|
|
246
|
+
[`c55c736ecea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c55c736ecea) - Patch
|
|
247
|
+
VULN AFP-3486 AFP-3487 AFP-3488 AFP-3489
|
|
185
248
|
|
|
186
249
|
## 5.1.1
|
|
187
250
|
|
|
188
251
|
### Patch Changes
|
|
189
252
|
|
|
190
|
-
-
|
|
191
|
-
-
|
|
253
|
+
- [#15998](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/15998)
|
|
254
|
+
[`f460cc7c411`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f460cc7c411) - Builds
|
|
255
|
+
for this package now pass through a tokens babel plugin, removing runtime invocations of the
|
|
256
|
+
tokens() function and improving bundle size.
|
|
257
|
+
- Updated dependencies
|
|
192
258
|
|
|
193
259
|
## 5.1.0
|
|
194
260
|
|
|
195
261
|
### Minor Changes
|
|
196
262
|
|
|
197
|
-
-
|
|
263
|
+
- [#14777](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/14777)
|
|
264
|
+
[`21c178539a2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/21c178539a2) - [ux]
|
|
265
|
+
Instrumented range with the new theming package, `@atlaskit/tokens`.
|
|
198
266
|
|
|
199
|
-
|
|
200
|
-
|
|
267
|
+
New tokens will be visible only in applications configured to use the new Tokens API (currently
|
|
268
|
+
in alpha). These changes are intended to be interoperable with the legacy theme implementation.
|
|
269
|
+
Legacy dark mode users should expect no visual or breaking changes.
|
|
201
270
|
|
|
202
271
|
### Patch Changes
|
|
203
272
|
|
|
204
|
-
-
|
|
273
|
+
- Updated dependencies
|
|
205
274
|
|
|
206
275
|
## 5.0.11
|
|
207
276
|
|
|
208
277
|
### Patch Changes
|
|
209
278
|
|
|
210
|
-
-
|
|
279
|
+
- Updated dependencies
|
|
211
280
|
|
|
212
281
|
## 5.0.10
|
|
213
282
|
|
|
214
283
|
### Patch Changes
|
|
215
284
|
|
|
216
|
-
-
|
|
285
|
+
- [#12880](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12880)
|
|
286
|
+
[`378d1cef00f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/378d1cef00f) - Bump
|
|
287
|
+
`@atlaskit/theme` to version `^11.3.0`.
|
|
217
288
|
|
|
218
289
|
## 5.0.9
|
|
219
290
|
|
|
220
291
|
### Patch Changes
|
|
221
292
|
|
|
222
|
-
-
|
|
293
|
+
- [#11980](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/11980)
|
|
294
|
+
[`b0183dd2972`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b0183dd2972) -
|
|
295
|
+
Updated package.json decriptions and documentation. Docs have moved from atlaskit.atlassian.com
|
|
296
|
+
to atlassian.design
|
|
223
297
|
|
|
224
298
|
## 5.0.8
|
|
225
299
|
|
|
226
300
|
### Patch Changes
|
|
227
301
|
|
|
228
|
-
-
|
|
302
|
+
- [#12167](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12167)
|
|
303
|
+
[`d6f7ff383cf`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d6f7ff383cf) -
|
|
304
|
+
Updates to development dependency `storybook-addon-performance`
|
|
229
305
|
|
|
230
306
|
## 5.0.7
|
|
231
307
|
|
|
232
308
|
### Patch Changes
|
|
233
309
|
|
|
234
|
-
-
|
|
310
|
+
- [#7762](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/7762)
|
|
311
|
+
[`952019cfd39`](https://bitbucket.org/atlassian/atlassian-frontend/commits/952019cfd39) -
|
|
312
|
+
Removed extraneous/unnecessary dependencies for design system components.
|
|
235
313
|
|
|
236
314
|
## 5.0.6
|
|
237
315
|
|
|
238
316
|
### Patch Changes
|
|
239
317
|
|
|
240
|
-
-
|
|
318
|
+
- [#6930](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/6930)
|
|
319
|
+
[`3137d05e06`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3137d05e06) - [ux]
|
|
320
|
+
Fixed rendering bug inside of Range. Now the blue trackbar snaps to a step in the range to align
|
|
321
|
+
with the position of the thumb.
|
|
241
322
|
|
|
242
323
|
## 5.0.5
|
|
243
324
|
|
|
244
325
|
### Patch Changes
|
|
245
326
|
|
|
246
|
-
-
|
|
327
|
+
- [#5857](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5857)
|
|
328
|
+
[`d3265f19be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3265f19be) -
|
|
329
|
+
Transpile packages using babel rather than tsc
|
|
247
330
|
|
|
248
331
|
## 5.0.4
|
|
249
332
|
|
|
250
333
|
### Patch Changes
|
|
251
334
|
|
|
252
|
-
-
|
|
253
|
-
|
|
254
|
-
|
|
335
|
+
- [#5497](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5497)
|
|
336
|
+
[`5f58283e1f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f58283e1f) - Export
|
|
337
|
+
types using Typescript's new "export type" syntax to satisfy Typescript's --isolatedModules
|
|
338
|
+
compiler option. This requires version 3.8 of Typescript, read more about how we handle
|
|
339
|
+
Typescript versions here: https://atlaskit.atlassian.com/get-started Also add `typescript` to
|
|
340
|
+
`devDependencies` to denote version that the package was built with.
|
|
255
341
|
|
|
256
342
|
## 5.0.3
|
|
257
343
|
|
|
258
344
|
### Patch Changes
|
|
259
345
|
|
|
260
|
-
-
|
|
346
|
+
- Updated dependencies
|
|
261
347
|
|
|
262
348
|
## 5.0.2
|
|
263
349
|
|
|
264
350
|
### Patch Changes
|
|
265
351
|
|
|
266
|
-
-
|
|
352
|
+
- [#3885](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3885)
|
|
353
|
+
[`6c525a8229`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6c525a8229) - Upgraded
|
|
354
|
+
to TypeScript 3.9.6 and tslib to 2.0.0
|
|
267
355
|
|
|
268
|
-
|
|
269
|
-
|
|
356
|
+
Since tslib is a dependency for all our packages we recommend that products also follow this
|
|
357
|
+
tslib upgrade to prevent duplicates of tslib being bundled.
|
|
270
358
|
|
|
271
359
|
## 5.0.1
|
|
272
360
|
|
|
273
361
|
### Patch Changes
|
|
274
362
|
|
|
275
|
-
-
|
|
276
|
-
|
|
363
|
+
- [#3823](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3823)
|
|
364
|
+
[`6262f382de`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6262f382de) - Use the
|
|
365
|
+
'lodash' package instead of single-function 'lodash.\*' packages
|
|
366
|
+
- [`e99262c6f0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e99262c6f0) - All form
|
|
367
|
+
elements now have a default font explicitly set
|
|
277
368
|
|
|
278
369
|
## 5.0.0
|
|
279
370
|
|
|
280
371
|
### Major Changes
|
|
281
372
|
|
|
282
|
-
-
|
|
283
|
-
|
|
373
|
+
- [#3335](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3335)
|
|
374
|
+
[`87f4720f27`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87f4720f27) -
|
|
375
|
+
Officially dropping IE11 support, from this version onwards there are no warranties of the
|
|
376
|
+
package working in IE11. For more information see:
|
|
377
|
+
https://community.developer.atlassian.com/t/atlaskit-to-drop-support-for-internet-explorer-11-from-1st-july-2020/39534
|
|
284
378
|
|
|
285
379
|
### Patch Changes
|
|
286
380
|
|
|
287
|
-
-
|
|
381
|
+
- Updated dependencies
|
|
288
382
|
|
|
289
383
|
## 4.0.1
|
|
290
384
|
|
|
291
385
|
### Patch Changes
|
|
292
386
|
|
|
293
|
-
-
|
|
387
|
+
- [#2866](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/2866)
|
|
388
|
+
[`54a9514fcf`](https://bitbucket.org/atlassian/atlassian-frontend/commits/54a9514fcf) - Build
|
|
389
|
+
and supporting files will no longer be published to npm
|
|
294
390
|
|
|
295
391
|
## 4.0.0
|
|
296
392
|
|
|
297
393
|
### Major Changes
|
|
298
394
|
|
|
299
|
-
-
|
|
395
|
+
- [#2137](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/2137)
|
|
396
|
+
[`da1c8c16d4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/da1c8c16d4) - In this
|
|
397
|
+
version we made range dramatically faster and lighter 🤩
|
|
300
398
|
|
|
301
|
-
|
|
399
|
+
### Changes
|
|
302
400
|
|
|
303
|
-
|
|
401
|
+
In `4.0.0` we bring significant performance improvements all for just the cost of 1 breaking
|
|
402
|
+
change 😮. That's not all folks because this update comes with a 🤑 FREE 🤑 codemod for you to
|
|
403
|
+
upgrade with.
|
|
304
404
|
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
405
|
+
- Range no longer has a `peerDependency` on `styled-components@3`. Internally range is now
|
|
406
|
+
using `@emotion/core` for styling
|
|
407
|
+
- A performance issue made the range noticeably laggy with large ranges. With this change we
|
|
408
|
+
are no longer creating new classes on each step change and instead updating a css variable,
|
|
409
|
+
making Range noticeably smoother.
|
|
410
|
+
- Changed the `inputRef` prop to be `ref` which returns the `ref` of the range input using
|
|
411
|
+
`React.forwardRef`. This new `ref` prop will accept the type of the old `inputRef` prop,
|
|
412
|
+
`(input?: HTMLInputElement) => any`, as well as if `ref` is created with `React.createRef`.
|
|
413
|
+
- A new example that shows off how to rate limit your `onChange` event
|
|
309
414
|
|
|
310
|
-
|
|
415
|
+
### Automatic upgrading
|
|
311
416
|
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
417
|
+
```
|
|
418
|
+
# You first need to have the latest range installed before you can run the codemod
|
|
419
|
+
yarn upgrade @atlaskit/range@^4.0.0
|
|
315
420
|
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
421
|
+
# Run the codemod cli
|
|
422
|
+
# Pass in a parser for your codebase
|
|
423
|
+
npx @atlaskit/codemod-cli /path/to/target/directory --parser [tsx | flow | babel]
|
|
424
|
+
```
|
|
320
425
|
|
|
321
|
-
|
|
426
|
+
#### Notes
|
|
322
427
|
|
|
323
|
-
|
|
324
|
-
|
|
428
|
+
- You first need to upgrade to `4.0.0` **before** you run the codemod cli. This is because the
|
|
429
|
+
cli will look in your local `node_modules` for the codemod which is published inside the
|
|
430
|
+
`spinner` package.
|
|
431
|
+
- The codemod is pretty clever, and will respect aliasing as well as using custom naming for
|
|
432
|
+
the default import
|
|
325
433
|
|
|
326
|
-
|
|
434
|
+
#### Ez pz lemon squeezy
|
|
327
435
|
|
|
328
|
-
|
|
436
|
+
The codemod will change the `inputRef` prop to `ref`
|
|
329
437
|
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
438
|
+
```diff
|
|
439
|
+
- <Range inputRef={inputRef} />
|
|
440
|
+
+ <Range ref={inputRef} />
|
|
333
441
|
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
442
|
+
- <Range
|
|
443
|
+
- inputRef={ref => {
|
|
444
|
+
- myRangeRef = ref;
|
|
445
|
+
- }}
|
|
446
|
+
- />
|
|
447
|
+
+ <Range
|
|
448
|
+
+ ref={ref => {
|
|
449
|
+
+ myRangeRef = ref;
|
|
450
|
+
+ }}
|
|
451
|
+
+ />
|
|
344
452
|
|
|
345
|
-
|
|
453
|
+
```
|
|
346
454
|
|
|
347
455
|
## 3.0.12
|
|
348
456
|
|
|
349
457
|
### Patch Changes
|
|
350
458
|
|
|
351
|
-
-
|
|
459
|
+
- [patch][6548261c9a](https://bitbucket.org/atlassian/atlassian-frontend/commits/6548261c9a):
|
|
352
460
|
|
|
353
|
-
|
|
461
|
+
Remove namespace imports from React, ReactDom, and PropTypes- Updated dependencies
|
|
462
|
+
[6548261c9a](https://bitbucket.org/atlassian/atlassian-frontend/commits/6548261c9a):
|
|
354
463
|
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
464
|
+
- @atlaskit/docs@8.3.2
|
|
465
|
+
- @atlaskit/visual-regression@0.1.9
|
|
466
|
+
- @atlaskit/checkbox@10.1.7
|
|
467
|
+
- @atlaskit/theme@9.5.1
|
|
468
|
+
- @atlaskit/tooltip@15.2.3
|
|
360
469
|
|
|
361
470
|
## 3.0.11
|
|
362
471
|
|
|
363
472
|
### Patch Changes
|
|
364
473
|
|
|
365
|
-
-
|
|
474
|
+
- [patch][4a223473c5](https://bitbucket.org/atlassian/atlassian-frontend/commits/4a223473c5):
|
|
366
475
|
|
|
367
|
-
|
|
476
|
+
Removes babel/runtime from dependencies. Users should see a smaller bundlesize as a result-
|
|
477
|
+
Updated dependencies
|
|
478
|
+
[82747f2922](https://bitbucket.org/atlassian/atlassian-frontend/commits/82747f2922):
|
|
368
479
|
|
|
369
|
-
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
480
|
+
- Updated dependencies
|
|
481
|
+
[4a223473c5](https://bitbucket.org/atlassian/atlassian-frontend/commits/4a223473c5):
|
|
482
|
+
- Updated dependencies
|
|
483
|
+
[6a8bc6f866](https://bitbucket.org/atlassian/atlassian-frontend/commits/6a8bc6f866):
|
|
484
|
+
- @atlaskit/theme@9.5.0
|
|
485
|
+
- @atlaskit/checkbox@10.1.5
|
|
486
|
+
- @atlaskit/tooltip@15.2.1
|
|
374
487
|
|
|
375
488
|
## 3.0.10
|
|
376
489
|
|
|
377
490
|
### Patch Changes
|
|
378
491
|
|
|
379
|
-
-
|
|
492
|
+
- [patch][557a8e2451](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/557a8e2451):
|
|
380
493
|
|
|
381
|
-
|
|
494
|
+
Rebuilds package to fix typescript typing error.
|
|
382
495
|
|
|
383
496
|
## 3.0.9
|
|
384
497
|
|
|
385
498
|
### Patch Changes
|
|
386
499
|
|
|
387
|
-
-
|
|
500
|
+
- [patch][35d2229b2a](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/35d2229b2a):
|
|
388
501
|
|
|
389
|
-
|
|
502
|
+
Adding missing license to packages and update to Copyright 2019 Atlassian Pty Ltd.
|
|
390
503
|
|
|
391
504
|
## 3.0.8
|
|
392
505
|
|
|
393
|
-
-
|
|
394
|
-
|
|
395
|
-
|
|
506
|
+
- Updated dependencies
|
|
507
|
+
[97bab7fd28](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/97bab7fd28):
|
|
508
|
+
- @atlaskit/checkbox@10.0.0
|
|
509
|
+
- @atlaskit/docs@8.1.7
|
|
396
510
|
|
|
397
511
|
## 3.0.7
|
|
398
512
|
|
|
399
513
|
### Patch Changes
|
|
400
514
|
|
|
401
|
-
-
|
|
515
|
+
- [patch][097b696613](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/097b696613):
|
|
402
516
|
|
|
403
|
-
|
|
517
|
+
Components now depend on TS 3.6 internally, in order to fix an issue with TS resolving
|
|
518
|
+
non-relative imports as relative imports
|
|
404
519
|
|
|
405
520
|
## 3.0.6
|
|
406
521
|
|
|
407
522
|
### Patch Changes
|
|
408
523
|
|
|
409
|
-
-
|
|
524
|
+
- [patch][ecca4d1dbb](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/ecca4d1dbb):
|
|
410
525
|
|
|
411
|
-
|
|
526
|
+
Upgraded Typescript to 3.3.x
|
|
412
527
|
|
|
413
528
|
## 3.0.5
|
|
414
529
|
|
|
415
530
|
### Patch Changes
|
|
416
531
|
|
|
417
|
-
-
|
|
532
|
+
- [patch][708028db86](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/708028db86):
|
|
418
533
|
|
|
419
|
-
|
|
534
|
+
Change all the imports to theme in Core to use multi entry points
|
|
420
535
|
|
|
421
536
|
## 3.0.4
|
|
422
537
|
|
|
423
538
|
### Patch Changes
|
|
424
539
|
|
|
425
|
-
-
|
|
540
|
+
- [patch][de35ce8c67](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/de35ce8c67):
|
|
426
541
|
|
|
427
|
-
|
|
542
|
+
Updates component maintainers
|
|
428
543
|
|
|
429
544
|
## 3.0.3
|
|
430
545
|
|
|
431
546
|
### Patch Changes
|
|
432
547
|
|
|
433
|
-
-
|
|
548
|
+
- [patch][f34776be97](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/f34776be97):
|
|
434
549
|
|
|
435
|
-
|
|
550
|
+
Type definition files are now referenced in package.json
|
|
436
551
|
|
|
437
552
|
## 3.0.2
|
|
438
553
|
|
|
439
|
-
-
|
|
440
|
-
|
|
554
|
+
- Updated dependencies
|
|
555
|
+
[87a2638655](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/87a2638655):
|
|
556
|
+
- @atlaskit/checkbox@9.0.0
|
|
441
557
|
|
|
442
558
|
## 3.0.1
|
|
443
559
|
|
|
444
560
|
### Patch Changes
|
|
445
561
|
|
|
446
|
-
-
|
|
562
|
+
- [patch][4615439434](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/4615439434):
|
|
447
563
|
|
|
448
|
-
|
|
564
|
+
index.ts will now be ignored when publishing to npm
|
|
449
565
|
|
|
450
566
|
## 3.0.0
|
|
451
567
|
|
|
452
568
|
### Major Changes
|
|
453
569
|
|
|
454
|
-
-
|
|
570
|
+
- [major][4a08d1912e](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/4a08d1912e):
|
|
455
571
|
|
|
456
|
-
|
|
572
|
+
@atlaskit/range has been converted to Typescript. Typescript consumers will now get static type
|
|
573
|
+
safety. Flow types are no longer provided. No API or behavioural changes.
|
|
457
574
|
|
|
458
575
|
## 2.0.2
|
|
459
576
|
|
|
460
|
-
-
|
|
461
|
-
|
|
577
|
+
- Updated dependencies
|
|
578
|
+
[67f06f58dd](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/67f06f58dd):
|
|
579
|
+
- @atlaskit/tooltip@15.0.0
|
|
462
580
|
|
|
463
581
|
## 2.0.1
|
|
464
582
|
|
|
465
|
-
-
|
|
466
|
-
|
|
467
|
-
|
|
583
|
+
- Updated dependencies
|
|
584
|
+
[70862830d6](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/70862830d6):
|
|
585
|
+
- @atlaskit/checkbox@8.0.0
|
|
586
|
+
- @atlaskit/theme@9.1.0
|
|
468
587
|
|
|
469
588
|
## 2.0.0
|
|
470
589
|
|
|
471
|
-
-
|
|
590
|
+
- [major][7c17b35107](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/7c17b35107):
|
|
472
591
|
|
|
473
|
-
|
|
592
|
+
- Updates react and react-dom peer dependencies to react@^16.8.0 and react-dom@^16.8.0. To use
|
|
593
|
+
this package, please ensure you use at least this version of react and react-dom.
|
|
474
594
|
|
|
475
595
|
## 1.0.0
|
|
476
596
|
|
|
477
|
-
-
|
|
597
|
+
- [major][546b636a36](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/546b636a36):
|
|
478
598
|
|
|
479
|
-
|
|
599
|
+
- This major release indicates that this package is no longer under dev preview but is ready
|
|
600
|
+
for use
|
|
480
601
|
|
|
481
602
|
## 0.2.2
|
|
482
603
|
|
|
483
|
-
-
|
|
604
|
+
- [patch][1f2a181b0f](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/1f2a181b0f):
|
|
484
605
|
|
|
485
|
-
|
|
606
|
+
- onChange is no longer overridden by spread props. As a result this component should now work
|
|
607
|
+
in uncontrolled mode
|
|
486
608
|
|
|
487
609
|
## 0.2.1
|
|
488
610
|
|
|
489
|
-
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
611
|
+
- Updated dependencies
|
|
612
|
+
[9c0b4744be](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/9c0b4744be):
|
|
613
|
+
- @atlaskit/docs@7.0.3
|
|
614
|
+
- @atlaskit/checkbox@6.0.4
|
|
615
|
+
- @atlaskit/tooltip@13.0.4
|
|
616
|
+
- @atlaskit/theme@8.1.7
|
|
494
617
|
|
|
495
618
|
## 0.2.0
|
|
496
619
|
|
|
497
|
-
-
|
|
620
|
+
- [minor][76299208e6](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/76299208e6):
|
|
498
621
|
|
|
499
|
-
|
|
622
|
+
- Drop ES5 from all the flow modules
|
|
500
623
|
|
|
501
|
-
|
|
624
|
+
### Dropping CJS support in all @atlaskit packages
|
|
502
625
|
|
|
503
|
-
|
|
504
|
-
|
|
626
|
+
As a breaking change, all @atlaskit packages will be dropping cjs distributions and will only
|
|
627
|
+
distribute esm. This means all distributed code will be transpiled, but will still contain
|
|
628
|
+
`import` and `export` declarations.
|
|
505
629
|
|
|
506
|
-
|
|
630
|
+
The major reason for doing this is to allow us to support multiple entry points in packages,
|
|
631
|
+
e.g:
|
|
507
632
|
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
633
|
+
```js
|
|
634
|
+
import colors from `@atlaskit/theme/colors`;
|
|
635
|
+
```
|
|
511
636
|
|
|
512
|
-
|
|
637
|
+
Previously this was sort of possible for consumers by doing something like:
|
|
513
638
|
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
639
|
+
```js
|
|
640
|
+
import colors from `@atlaskit/theme/dist/esm/colors`;
|
|
641
|
+
```
|
|
517
642
|
|
|
518
|
-
|
|
643
|
+
This has a couple of issues. 1, it treats the file system as API making internal refactors
|
|
644
|
+
harder, we have to worry about how consumers might be using things that aren't _actually_
|
|
645
|
+
supposed to be used. 2. We are unable to do this _internally_ in @atlaskit packages. This leads
|
|
646
|
+
to lots of packages bundling all of theme, just to use a single color, especially in situations
|
|
647
|
+
where tree shaking fails.
|
|
519
648
|
|
|
520
|
-
|
|
649
|
+
To support being able to use multiple entrypoints internally, we unfortunately cannot have
|
|
650
|
+
multiple distributions as they would need to have very different imports from of their own
|
|
651
|
+
internal dependencies.
|
|
521
652
|
|
|
522
|
-
|
|
653
|
+
ES Modules are widely supported by all modern bundlers and can be worked around in node
|
|
654
|
+
environments.
|
|
523
655
|
|
|
524
|
-
|
|
656
|
+
We may choose to revisit this solution in the future if we find any unintended condequences, but
|
|
657
|
+
we see this as a pretty sane path forward which should lead to some major bundle size decreases,
|
|
658
|
+
saner API's and simpler package architecture.
|
|
525
659
|
|
|
526
|
-
|
|
660
|
+
Please reach out to #fabric-build (if in Atlassian) or create an issue in
|
|
661
|
+
[Design System Support](https://ecosystem.atlassian.net/secure/CreateIssue.jspa?pid=24670) (for
|
|
662
|
+
external) if you have any questions or queries about this.
|
|
527
663
|
|
|
528
664
|
## 0.1.3
|
|
529
665
|
|
|
530
|
-
-
|
|
666
|
+
- [patch][aab267bb3a](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/aab267bb3a):
|
|
531
667
|
|
|
532
|
-
|
|
668
|
+
- Added test to make sure the props are passed down to hidden input
|
|
533
669
|
|
|
534
670
|
## 0.1.2
|
|
535
671
|
|
|
536
|
-
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
672
|
+
- Updated dependencies [58b84fa](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/58b84fa):
|
|
673
|
+
- @atlaskit/checkbox@5.0.9
|
|
674
|
+
- @atlaskit/theme@7.0.1
|
|
675
|
+
- @atlaskit/tooltip@12.1.13
|
|
676
|
+
- @atlaskit/docs@6.0.0
|
|
541
677
|
|
|
542
678
|
## 0.1.1
|
|
543
679
|
|
|
544
|
-
-
|
|
680
|
+
- [patch][d13242d](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/d13242d):
|
|
545
681
|
|
|
546
|
-
|
|
682
|
+
- Change API to experimental theming API to namespace component themes into separate contexts
|
|
683
|
+
and make theming simpler. Update all dependant components.
|
|
547
684
|
|
|
548
685
|
## 0.1.0
|
|
549
686
|
|
|
550
|
-
-
|
|
687
|
+
- [minor][8945a58](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/8945a58):
|
|
551
688
|
|
|
552
|
-
|
|
689
|
+
- Initial release
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.confluence.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"declaration": true,
|
|
5
|
+
"target": "es5",
|
|
6
|
+
"composite": true,
|
|
7
|
+
"outDir": "../dist",
|
|
8
|
+
"rootDir": "../",
|
|
9
|
+
"baseUrl": "../"
|
|
10
|
+
},
|
|
11
|
+
"include": [
|
|
12
|
+
"../src/**/*.ts",
|
|
13
|
+
"../src/**/*.tsx"
|
|
14
|
+
],
|
|
15
|
+
"exclude": [
|
|
16
|
+
"../src/**/__tests__/*",
|
|
17
|
+
"../src/**/*.test.*",
|
|
18
|
+
"../src/**/test.*"
|
|
19
|
+
],
|
|
20
|
+
"references": [
|
|
21
|
+
{
|
|
22
|
+
"path": "../../ds-lib/afm-cc/tsconfig.json"
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
"path": "../../theme/afm-cc/tsconfig.json"
|
|
26
|
+
},
|
|
27
|
+
{
|
|
28
|
+
"path": "../../tokens/afm-cc/tsconfig.json"
|
|
29
|
+
}
|
|
30
|
+
]
|
|
31
|
+
}
|
|
@@ -16,7 +16,7 @@ The default form of a range.
|
|
|
16
16
|
|
|
17
17
|
## Form
|
|
18
18
|
|
|
19
|
-
Range used with the [
|
|
19
|
+
Range used with the [form component](/components/form/).
|
|
20
20
|
|
|
21
21
|
<Example Component={RangeForm} packageName="@atlaskit/range" />
|
|
22
22
|
|
|
@@ -36,4 +36,6 @@ In an uncontrolled range, the state is managed by the DOM.
|
|
|
36
36
|
|
|
37
37
|
Set `isDisabled` to disable a range when another action has to be completed before the range is usable.
|
|
38
38
|
|
|
39
|
+
Avoid using disabled UI where possible. This can cause accessibility problems, because disabled UI does not give enough information about what went wrong and how to proceed.
|
|
40
|
+
|
|
39
41
|
<Example Component={RangeDisabled} packageName="@atlaskit/range" />
|
|
@@ -4,26 +4,30 @@ order: 2
|
|
|
4
4
|
|
|
5
5
|
## Usage
|
|
6
6
|
|
|
7
|
-
Use ranges in [forms](/patterns/forms) to let
|
|
7
|
+
Use ranges in [forms](/patterns/forms) to let people select a value within a given range of minimum and maximum values.
|
|
8
8
|
|
|
9
9
|
## Anatomy
|
|
10
10
|
|
|
11
|
-
|
|
12
12
|
|
|
13
|
-
1. **Track:** The track displays the range available for the user to select from.
|
|
14
|
-
2. **Handle:** A position indicator that can
|
|
13
|
+
1. **Track:** The track is a horizontal line that displays the range available for the user to select from.
|
|
14
|
+
2. **Handle:** A circular position indicator that people can move along the track to change the value.
|
|
15
|
+
|
|
16
|
+
## Accessibility
|
|
17
|
+
|
|
18
|
+
- Don't use a range if choosing a specific value is important. The slider interaction isn't as precise as explicitly typing or choosing an option from a list.
|
|
19
|
+
- Don't use a range for values that aren't numeric. For example, selecting weekdays (Monday to Friday).
|
|
15
20
|
|
|
16
21
|
## Best practices
|
|
17
22
|
|
|
18
23
|
- Place labels directly above the input, and align to the left.
|
|
19
|
-
-
|
|
20
|
-
-
|
|
21
|
-
-
|
|
22
|
-
|
|
24
|
+
- Don't use for ranges that are extremely large. For example, values over 100.
|
|
25
|
+
- Don't use for ranges that are very small (for example, 1-3). The range moves in steps when the range of values is lower.
|
|
26
|
+
- For left-to-right user interfaces, put the lowest value on the left of the slider. For right-to-left user interfaces, put the lowest value on the right.
|
|
23
27
|
|
|
24
28
|
## Content guidelines
|
|
25
29
|
|
|
26
|
-
-
|
|
30
|
+
- Keep labels short and concise.
|
|
27
31
|
- If necessary, use helper text to clarify how to use the range.
|
|
28
32
|
|
|
29
33
|
## Related
|
package/dist/cjs/range.js
CHANGED
|
@@ -14,14 +14,15 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
14
14
|
var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
|
|
15
15
|
var _styled = require("./styled");
|
|
16
16
|
var _excluded = ["isDisabled", "defaultValue", "max", "min", "onChange", "step", "value", "testId"];
|
|
17
|
-
function _getRequireWildcardCache(
|
|
18
|
-
function _interopRequireWildcard(
|
|
19
|
-
function ownKeys(
|
|
20
|
-
function _objectSpread(
|
|
17
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
18
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
19
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
20
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
21
21
|
// Combine omits the keys of the second from the first so in case of overlap the props of the second are used.
|
|
22
22
|
|
|
23
23
|
// OwnProps is used for external documentation, but does not list every property supported by Range.
|
|
24
24
|
// So we combine (a reduced list of) HTMLInputElement attributes with OwnProps to get the full type.
|
|
25
|
+
|
|
25
26
|
var snapToStep = function snapToStep(value, min, step) {
|
|
26
27
|
// Normalise the value to allow for division properly with different min values
|
|
27
28
|
var adjustedValue = value - min;
|
|
@@ -39,7 +40,7 @@ var getRoundedPercentValue = function getRoundedPercentValue(value, min, max, st
|
|
|
39
40
|
return percent;
|
|
40
41
|
};
|
|
41
42
|
var noop = _noop.default;
|
|
42
|
-
var _default = /*#__PURE__*/(0, _react.forwardRef)(function Range(props, ref) {
|
|
43
|
+
var _default = exports.default = /*#__PURE__*/(0, _react.forwardRef)(function Range(props, ref) {
|
|
43
44
|
var _props$isDisabled = props.isDisabled,
|
|
44
45
|
isDisabled = _props$isDisabled === void 0 ? false : _props$isDisabled,
|
|
45
46
|
_props$defaultValue = props.defaultValue,
|
|
@@ -81,5 +82,4 @@ var _default = /*#__PURE__*/(0, _react.forwardRef)(function Range(props, ref) {
|
|
|
81
82
|
valuePercent: valuePercent,
|
|
82
83
|
"data-testid": testId
|
|
83
84
|
}, spreadProps));
|
|
84
|
-
});
|
|
85
|
-
exports.default = _default;
|
|
85
|
+
});
|
package/dist/cjs/styled.js
CHANGED
|
@@ -14,10 +14,10 @@ var _react2 = require("@emotion/react");
|
|
|
14
14
|
var theme = _interopRequireWildcard(require("./theme"));
|
|
15
15
|
var _excluded = ["valuePercent", "style"];
|
|
16
16
|
var _hoverNotDisabled, _css;
|
|
17
|
-
function _getRequireWildcardCache(
|
|
18
|
-
function _interopRequireWildcard(
|
|
19
|
-
function ownKeys(
|
|
20
|
-
function _objectSpread(
|
|
17
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
18
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
19
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
20
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /** @jsx jsx */
|
|
21
21
|
var VAR_THUMB_BORDER_COLOR = '--thumb-border';
|
|
22
22
|
var VAR_THUMB_SHADOW = '--thumb-shadow';
|
|
23
23
|
var VAR_THUMB_BACKGROUND_COLOR = '--thumb-bg';
|
|
@@ -123,7 +123,7 @@ var themeStyles = (0, _react2.css)((_css = {}, (0, _defineProperty2.default)(_cs
|
|
|
123
123
|
* __Input__
|
|
124
124
|
* Internal-only styled input component.
|
|
125
125
|
*/
|
|
126
|
-
var Input = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
126
|
+
var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
127
127
|
var valuePercent = props.valuePercent,
|
|
128
128
|
style = props.style,
|
|
129
129
|
strippedProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
@@ -133,5 +133,4 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
133
133
|
css: [baseStyles, browserStyles.webkit, browserStyles.firefox, themeStyles]
|
|
134
134
|
}));
|
|
135
135
|
});
|
|
136
|
-
exports.Input = Input;
|
|
137
136
|
Input.displayName = 'InputRange';
|
package/dist/cjs/theme.js
CHANGED
|
@@ -5,13 +5,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.transitionDuration = exports.track = exports.thumb = exports.input = void 0;
|
|
7
7
|
var _colors = require("@atlaskit/theme/colors");
|
|
8
|
-
var transitionDuration = '0.2s';
|
|
9
|
-
exports.
|
|
10
|
-
var input = {
|
|
8
|
+
var transitionDuration = exports.transitionDuration = '0.2s';
|
|
9
|
+
var input = exports.input = {
|
|
11
10
|
height: 40
|
|
12
11
|
};
|
|
13
|
-
exports.
|
|
14
|
-
var thumb = {
|
|
12
|
+
var thumb = exports.thumb = {
|
|
15
13
|
size: 16,
|
|
16
14
|
borderWidth: 2,
|
|
17
15
|
background: {
|
|
@@ -28,8 +26,7 @@ var thumb = {
|
|
|
28
26
|
disabled: "var(--ds-shadow-raised, ".concat("0 0 1px ".concat(_colors.N60A), ")")
|
|
29
27
|
}
|
|
30
28
|
};
|
|
31
|
-
exports.
|
|
32
|
-
var track = {
|
|
29
|
+
var track = exports.track = {
|
|
33
30
|
height: 4,
|
|
34
31
|
/**
|
|
35
32
|
* borderRadius >= height / 2 to create a pill shape.
|
|
@@ -44,5 +41,4 @@ var track = {
|
|
|
44
41
|
default: "var(--ds-background-neutral-bold, ".concat(_colors.B400, ")"),
|
|
45
42
|
hovered: "var(--ds-background-neutral-bold-hovered, ".concat(_colors.B300, ")")
|
|
46
43
|
}
|
|
47
|
-
};
|
|
48
|
-
exports.track = track;
|
|
44
|
+
};
|
package/dist/es2019/range.js
CHANGED
|
@@ -7,6 +7,7 @@ import { Input } from './styled';
|
|
|
7
7
|
|
|
8
8
|
// OwnProps is used for external documentation, but does not list every property supported by Range.
|
|
9
9
|
// So we combine (a reduced list of) HTMLInputElement attributes with OwnProps to get the full type.
|
|
10
|
+
|
|
10
11
|
const snapToStep = (value, min, step) => {
|
|
11
12
|
// Normalise the value to allow for division properly with different min values
|
|
12
13
|
const adjustedValue = value - min;
|
package/dist/esm/range.js
CHANGED
|
@@ -3,8 +3,8 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
5
5
|
var _excluded = ["isDisabled", "defaultValue", "max", "min", "onChange", "step", "value", "testId"];
|
|
6
|
-
function ownKeys(
|
|
7
|
-
function _objectSpread(
|
|
6
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
7
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
8
8
|
import React, { forwardRef, useCallback, useState } from 'react';
|
|
9
9
|
import __noop from '@atlaskit/ds-lib/noop';
|
|
10
10
|
import { Input } from './styled';
|
|
@@ -13,6 +13,7 @@ import { Input } from './styled';
|
|
|
13
13
|
|
|
14
14
|
// OwnProps is used for external documentation, but does not list every property supported by Range.
|
|
15
15
|
// So we combine (a reduced list of) HTMLInputElement attributes with OwnProps to get the full type.
|
|
16
|
+
|
|
16
17
|
var snapToStep = function snapToStep(value, min, step) {
|
|
17
18
|
// Normalise the value to allow for division properly with different min values
|
|
18
19
|
var adjustedValue = value - min;
|
package/dist/esm/styled.js
CHANGED
|
@@ -3,8 +3,8 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
4
|
var _excluded = ["valuePercent", "style"];
|
|
5
5
|
var _hoverNotDisabled, _css;
|
|
6
|
-
function ownKeys(
|
|
7
|
-
function _objectSpread(
|
|
6
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
7
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
8
8
|
/** @jsx jsx */
|
|
9
9
|
|
|
10
10
|
import { forwardRef } from 'react';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/range",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.2.0",
|
|
4
4
|
"description": "A range lets users choose an approximate value on a slider.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
"atlaskit:src": "src/index.tsx",
|
|
17
17
|
"atlassian": {
|
|
18
18
|
"team": "Design System Team",
|
|
19
|
+
"runReact18": true,
|
|
19
20
|
"productPushConsumption": [
|
|
20
21
|
"jira"
|
|
21
22
|
],
|
|
@@ -26,19 +27,21 @@
|
|
|
26
27
|
}
|
|
27
28
|
},
|
|
28
29
|
"dependencies": {
|
|
29
|
-
"@atlaskit/ds-lib": "^2.
|
|
30
|
-
"@atlaskit/theme": "^12.
|
|
31
|
-
"@atlaskit/tokens": "^1.
|
|
30
|
+
"@atlaskit/ds-lib": "^2.3.0",
|
|
31
|
+
"@atlaskit/theme": "^12.7.0",
|
|
32
|
+
"@atlaskit/tokens": "^1.44.0",
|
|
32
33
|
"@babel/runtime": "^7.0.0",
|
|
33
34
|
"@emotion/react": "^11.7.1"
|
|
34
35
|
},
|
|
35
36
|
"peerDependencies": {
|
|
36
|
-
"react": "^16.8.0"
|
|
37
|
+
"react": "^16.8.0 || ^17.0.0 || ~18.2.0"
|
|
37
38
|
},
|
|
38
39
|
"devDependencies": {
|
|
39
40
|
"@af/accessibility-testing": "*",
|
|
40
41
|
"@af/visual-regression": "*",
|
|
42
|
+
"@atlaskit/checkbox": "^13.1.0",
|
|
41
43
|
"@atlaskit/ssr": "*",
|
|
44
|
+
"@atlaskit/tooltip": "^18.3.0",
|
|
42
45
|
"@atlaskit/visual-regression": "*",
|
|
43
46
|
"@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
|
|
44
47
|
"@emotion/styled": "^11.0.0",
|
|
@@ -48,7 +51,7 @@
|
|
|
48
51
|
"lodash": "^4.17.21",
|
|
49
52
|
"react-dom": "^16.8.0",
|
|
50
53
|
"storybook-addon-performance": "^0.16.0",
|
|
51
|
-
"typescript": "~4.
|
|
54
|
+
"typescript": "~5.4.2"
|
|
52
55
|
},
|
|
53
56
|
"keywords": [
|
|
54
57
|
"atlaskit",
|
|
@@ -91,4 +94,4 @@
|
|
|
91
94
|
"./theme": "./src/theme.tsx"
|
|
92
95
|
},
|
|
93
96
|
"prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
|
|
94
|
-
}
|
|
97
|
+
}
|
package/range/package.json
CHANGED
package/styled/package.json
CHANGED
package/theme/package.json
CHANGED
package/tmp/api-report-tmp.d.ts
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
## API Report File for "@atlaskit/range"
|
|
2
|
-
|
|
3
|
-
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
|
|
4
|
-
|
|
5
|
-
```ts
|
|
6
|
-
|
|
7
|
-
import { default as React_2 } from 'react';
|
|
8
|
-
|
|
9
|
-
// @public (undocumented)
|
|
10
|
-
type Combine<First, Second> = Omit<First, keyof Second> & Second;
|
|
11
|
-
|
|
12
|
-
// @public (undocumented)
|
|
13
|
-
const _default: React_2.ForwardRefExoticComponent<Omit<Omit<React_2.InputHTMLAttributes<HTMLInputElement>, "checked" | "disabled" | "required">, keyof OwnProps> & OwnProps & React_2.RefAttributes<HTMLInputElement>>;
|
|
14
|
-
export default _default;
|
|
15
|
-
|
|
16
|
-
// @public (undocumented)
|
|
17
|
-
type OwnProps = {
|
|
18
|
-
defaultValue?: number;
|
|
19
|
-
isDisabled?: boolean;
|
|
20
|
-
max?: number;
|
|
21
|
-
min?: number;
|
|
22
|
-
onChange?: (value: number) => void;
|
|
23
|
-
step?: number;
|
|
24
|
-
testId?: string;
|
|
25
|
-
value?: number;
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
// @public (undocumented)
|
|
29
|
-
export type RangeProps = Combine<Omit<React_2.InputHTMLAttributes<HTMLInputElement>, 'checked' | 'disabled' | 'required'>, OwnProps>;
|
|
30
|
-
|
|
31
|
-
// (No @packageDocumentation comment for this package)
|
|
32
|
-
|
|
33
|
-
```
|