@hero-design/rn 8.3.4 → 8.5.0-alpha.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/.turbo/turbo-build.log +66 -9
- package/assets/fonts/hero-icons-mobile.ttf +0 -0
- package/es/index.js +473 -133
- package/lib/index.js +473 -133
- package/package.json +5 -7
- package/rollup.config.js +0 -1
- package/src/components/Carousel/CarouselItem.tsx +3 -1
- package/src/components/Carousel/StyledCarousel.tsx +2 -0
- package/src/components/Carousel/__tests__/__snapshots__/index.spec.tsx.snap +18 -15
- package/src/components/Icon/HeroIcon/glyphMap.json +1 -1
- package/src/components/Icon/IconList.ts +9 -0
- package/src/components/List/ListItem.tsx +1 -5
- package/src/components/List/__tests__/__snapshots__/ListItem.spec.tsx.snap +8 -8
- package/src/components/Select/BaseOptionList.tsx +5 -12
- package/src/components/Select/MultiSelect/OptionList.tsx +6 -6
- package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +3 -0
- package/src/components/Select/MultiSelect/index.tsx +9 -0
- package/src/components/Select/SingleSelect/OptionList.tsx +5 -3
- package/src/components/Select/SingleSelect/__tests__/__snapshots__/OptionList.spec.tsx.snap +24 -4
- package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap +21 -3
- package/src/components/Select/SingleSelect/index.tsx +8 -0
- package/src/components/Swipeable/Buttons.tsx +65 -0
- package/src/components/Swipeable/StyledSwipeable.tsx +14 -2
- package/src/components/Swipeable/SwipeableAction.tsx +15 -7
- package/src/components/Swipeable/index.tsx +531 -136
- package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +1 -1
- package/src/theme/components/carousel.ts +1 -1
- package/types/components/Calendar/helpers.d.ts +2 -2
- package/types/components/Select/helpers.d.ts +1 -1
- package/types/components/Swipeable/Buttons.d.ts +15 -0
- package/types/components/Swipeable/StyledSwipeable.d.ts +15 -2
- package/types/components/Swipeable/SwipeableAction.d.ts +10 -6
- package/types/components/Swipeable/index.d.ts +24 -41
- package/types/components/Toolbar/index.d.ts +2 -3
- package/types/testHelpers/renderWithTheme.d.ts +1 -1
- package/.turbo/turbo-publish:npm.log +0 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hero-design/rn",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.5.0-alpha.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@emotion/native": "^11.9.3",
|
|
23
23
|
"@emotion/react": "^11.9.3",
|
|
24
|
-
"@hero-design/colors": "8.
|
|
24
|
+
"@hero-design/colors": "8.5.0",
|
|
25
25
|
"date-fns": "^2.16.1",
|
|
26
26
|
"events": "^3.2.0",
|
|
27
27
|
"hero-editor": "^1.9.21"
|
|
@@ -31,7 +31,6 @@
|
|
|
31
31
|
"@react-native-community/slider": "4.1.12",
|
|
32
32
|
"react": "18.0.0",
|
|
33
33
|
"react-native": "0.69.7",
|
|
34
|
-
"react-native-gesture-handler": "^1.10.3 | ~2.1.0",
|
|
35
34
|
"react-native-pager-view": "^5.4.25",
|
|
36
35
|
"react-native-safe-area-context": "^4.2.5",
|
|
37
36
|
"react-native-vector-icons": "^9.1.0",
|
|
@@ -44,7 +43,7 @@
|
|
|
44
43
|
"@babel/preset-typescript": "^7.17.12",
|
|
45
44
|
"@babel/runtime": "^7.18.9",
|
|
46
45
|
"@emotion/jest": "^11.9.3",
|
|
47
|
-
"@hero-design/eslint-plugin": "8.
|
|
46
|
+
"@hero-design/eslint-plugin": "8.5.0",
|
|
48
47
|
"@react-native-community/datetimepicker": "^3.5.2",
|
|
49
48
|
"@react-native-community/slider": "4.1.12",
|
|
50
49
|
"@rollup/plugin-babel": "^5.3.1",
|
|
@@ -60,12 +59,11 @@
|
|
|
60
59
|
"@types/react-native": "^0.67.7",
|
|
61
60
|
"@types/react-native-vector-icons": "^6.4.10",
|
|
62
61
|
"babel-plugin-inline-import": "^3.0.0",
|
|
63
|
-
"eslint-config-hd": "8.
|
|
62
|
+
"eslint-config-hd": "8.5.0",
|
|
64
63
|
"jest": "^27.3.1",
|
|
65
|
-
"prettier-config-hd": "8.
|
|
64
|
+
"prettier-config-hd": "8.5.0",
|
|
66
65
|
"react": "18.0.0",
|
|
67
66
|
"react-native": "0.69.7",
|
|
68
|
-
"react-native-gesture-handler": "~2.1.0",
|
|
69
67
|
"react-native-pager-view": "^5.4.25",
|
|
70
68
|
"react-native-safe-area-context": "^4.2.5",
|
|
71
69
|
"react-native-vector-icons": "^9.1.0",
|
package/rollup.config.js
CHANGED
|
@@ -35,7 +35,9 @@ const CarouselItem = ({
|
|
|
35
35
|
>
|
|
36
36
|
{content}
|
|
37
37
|
<StyledCarouselHeading>{heading}</StyledCarouselHeading>
|
|
38
|
-
{body ?
|
|
38
|
+
{body ? (
|
|
39
|
+
<Typography.Text fontSize="large">{body}</Typography.Text>
|
|
40
|
+
) : null}
|
|
39
41
|
</StyledCarouselContentWrapper>
|
|
40
42
|
</Box>
|
|
41
43
|
);
|
|
@@ -3,6 +3,7 @@ import styled from '@emotion/native';
|
|
|
3
3
|
import Typography from '../Typography';
|
|
4
4
|
import Image from '../Image';
|
|
5
5
|
import Box from '../Box';
|
|
6
|
+
import { scale } from '../../utils/scale';
|
|
6
7
|
|
|
7
8
|
const StyledBackDrop = styled(View)<{
|
|
8
9
|
themeSlideBackground: string;
|
|
@@ -38,6 +39,7 @@ const StyledCarouselContentWrapper = styled(Box)<{
|
|
|
38
39
|
width: number;
|
|
39
40
|
}>(({ width }) => ({
|
|
40
41
|
width,
|
|
42
|
+
minHeight: scale(250),
|
|
41
43
|
}));
|
|
42
44
|
|
|
43
45
|
const StyledCarouselFooterWrapper = styled(View)(({ theme }) => ({
|
|
@@ -153,6 +153,7 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
153
153
|
},
|
|
154
154
|
Array [
|
|
155
155
|
Object {
|
|
156
|
+
"minHeight": 250,
|
|
156
157
|
"width": 750,
|
|
157
158
|
},
|
|
158
159
|
undefined,
|
|
@@ -174,7 +175,7 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
174
175
|
Array [
|
|
175
176
|
Object {
|
|
176
177
|
"fontFamily": "RebondGrotesque-SemiBold",
|
|
177
|
-
"fontSize":
|
|
178
|
+
"fontSize": 32,
|
|
178
179
|
"lineHeight": 44,
|
|
179
180
|
"marginBottom": 16,
|
|
180
181
|
"marginTop": 8,
|
|
@@ -196,14 +197,14 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
196
197
|
Object {
|
|
197
198
|
"color": "#001f23",
|
|
198
199
|
"fontFamily": "BeVietnamPro-Regular",
|
|
199
|
-
"fontSize":
|
|
200
|
-
"letterSpacing": 0.
|
|
201
|
-
"lineHeight":
|
|
200
|
+
"fontSize": 16,
|
|
201
|
+
"letterSpacing": 0.48,
|
|
202
|
+
"lineHeight": 24,
|
|
202
203
|
},
|
|
203
204
|
undefined,
|
|
204
205
|
]
|
|
205
206
|
}
|
|
206
|
-
themeFontSize="
|
|
207
|
+
themeFontSize="large"
|
|
207
208
|
themeFontWeight="regular"
|
|
208
209
|
themeIntent="body"
|
|
209
210
|
themeTypeface="neutral"
|
|
@@ -269,6 +270,7 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
269
270
|
},
|
|
270
271
|
Array [
|
|
271
272
|
Object {
|
|
273
|
+
"minHeight": 250,
|
|
272
274
|
"width": 750,
|
|
273
275
|
},
|
|
274
276
|
undefined,
|
|
@@ -307,7 +309,7 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
307
309
|
Array [
|
|
308
310
|
Object {
|
|
309
311
|
"fontFamily": "RebondGrotesque-SemiBold",
|
|
310
|
-
"fontSize":
|
|
312
|
+
"fontSize": 32,
|
|
311
313
|
"lineHeight": 44,
|
|
312
314
|
"marginBottom": 16,
|
|
313
315
|
"marginTop": 8,
|
|
@@ -329,14 +331,14 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
329
331
|
Object {
|
|
330
332
|
"color": "#001f23",
|
|
331
333
|
"fontFamily": "BeVietnamPro-Regular",
|
|
332
|
-
"fontSize":
|
|
333
|
-
"letterSpacing": 0.
|
|
334
|
-
"lineHeight":
|
|
334
|
+
"fontSize": 16,
|
|
335
|
+
"letterSpacing": 0.48,
|
|
336
|
+
"lineHeight": 24,
|
|
335
337
|
},
|
|
336
338
|
undefined,
|
|
337
339
|
]
|
|
338
340
|
}
|
|
339
|
-
themeFontSize="
|
|
341
|
+
themeFontSize="large"
|
|
340
342
|
themeFontWeight="regular"
|
|
341
343
|
themeIntent="body"
|
|
342
344
|
themeTypeface="neutral"
|
|
@@ -402,6 +404,7 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
402
404
|
},
|
|
403
405
|
Array [
|
|
404
406
|
Object {
|
|
407
|
+
"minHeight": 250,
|
|
405
408
|
"width": 750,
|
|
406
409
|
},
|
|
407
410
|
undefined,
|
|
@@ -423,7 +426,7 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
423
426
|
Array [
|
|
424
427
|
Object {
|
|
425
428
|
"fontFamily": "RebondGrotesque-SemiBold",
|
|
426
|
-
"fontSize":
|
|
429
|
+
"fontSize": 32,
|
|
427
430
|
"lineHeight": 44,
|
|
428
431
|
"marginBottom": 16,
|
|
429
432
|
"marginTop": 8,
|
|
@@ -445,14 +448,14 @@ exports[`Carousel renders basic carousel 1`] = `
|
|
|
445
448
|
Object {
|
|
446
449
|
"color": "#001f23",
|
|
447
450
|
"fontFamily": "BeVietnamPro-Regular",
|
|
448
|
-
"fontSize":
|
|
449
|
-
"letterSpacing": 0.
|
|
450
|
-
"lineHeight":
|
|
451
|
+
"fontSize": 16,
|
|
452
|
+
"letterSpacing": 0.48,
|
|
453
|
+
"lineHeight": 24,
|
|
451
454
|
},
|
|
452
455
|
undefined,
|
|
453
456
|
]
|
|
454
457
|
}
|
|
455
|
-
themeFontSize="
|
|
458
|
+
themeFontSize="large"
|
|
456
459
|
themeFontWeight="regular"
|
|
457
460
|
themeIntent="body"
|
|
458
461
|
themeTypeface="neutral"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"activate":59000,"add-emoji":59001,"add-person":59002,"adjustment":59003,"alignment":59004,"antenna":59005,"archive":59006,"assignment-warning":59007,"bank":59008,"bell":59009,"billing":59010,"bookmark":59011,"box-check":
|
|
1
|
+
{"activate":59000,"add-emoji":59001,"add-person":59002,"adjustment":59003,"alignment":59004,"antenna":59005,"archive":59006,"assignment-warning":59007,"bank":59008,"bell":59009,"billing":59010,"bookmark-added":59011,"bookmark":59012,"box-check":59013,"box":59014,"buildings":59015,"cake":59016,"calendar-clock":59017,"calendar":59018,"candy-box-menu":59019,"caret-down-small":59020,"caret-down":59021,"caret-left-small":59022,"caret-left":59023,"caret-right-small":59024,"caret-right":59025,"caret-up-small":59026,"caret-up":59027,"check-radio":59028,"circle-add":59029,"circle-cancel":59030,"circle-check":59031,"circle-down":59032,"circle-info":59033,"circle-left":59034,"circle-ok":59035,"circle-pencil":59036,"circle-question":59037,"circle-remove":59038,"circle-right":59039,"circle-up":59040,"circle-warning":59041,"clock-3":59042,"clock":59043,"cloud-download":59044,"cloud-upload":59045,"cog":59046,"coin":59047,"contacts":59048,"credit-card":59049,"diamond":59050,"direction-arrows":59051,"directory":59052,"document":59053,"dollar-coin-shine":59054,"double-buildings":59055,"edit-template":59056,"envelope":59057,"expense":59058,"eye-circle":59059,"eye-invisible":59060,"eye":59061,"face-meh":59062,"face-sad":59063,"face-smiley":59064,"feed":59065,"feedbacks":59066,"file-certified":59067,"file-clone":59068,"file-copy":59069,"file-csv":59070,"file-dispose":59071,"file-doc":59072,"file-excel":59073,"file-export":59074,"file-lock":59075,"file-pdf":59076,"file-powerpoint":59077,"file-search":59078,"file-secured":59079,"file-sheets":59080,"file-slide":59081,"file-verified":59082,"file-word":59083,"file":59084,"filter":59085,"folder-user":59086,"folder":59087,"format-bold":59088,"format-heading1":59089,"format-heading2":59090,"format-italic":59091,"format-list-bulleted":59092,"format-list-numbered":59093,"format-underlined":59094,"funnel-filter":59095,"global-dollar":59096,"globe":59097,"graduation-cap":59098,"graph":59099,"happy-sun":59100,"health-bag":59101,"heart":59102,"home":59103,"image":59104,"import":59105,"incident-siren":59106,"instapay":59107,"list":59108,"loading-2":59109,"loading":59110,"location":59111,"lock":59112,"looks-one":59113,"looks-two":59114,"media-content":59115,"menu":59116,"money-notes":59117,"moneybag":59118,"moon":59119,"multiple-stars":59120,"multiple-users":59121,"node":59122,"open-folder":59123,"paperclip":59124,"payment-summary":59125,"pencil":59126,"phone":59127,"piggy-bank":59128,"plane":59129,"play-circle":59130,"print":59131,"raising-hands":59132,"reply-arrow":59133,"reply":59134,"reschedule":59135,"rostering":59136,"save":59137,"schedule-send":59138,"schedule":59139,"search-person":59140,"send":59141,"speaker-active":59142,"speaker":59143,"star-award":59144,"star-badge":59145,"star-circle":59146,"star-medal":59147,"star":59148,"steps-circle":59149,"stopwatch":59150,"suitcase":59151,"survey":59152,"swag":59153,"switch":59154,"tag":59155,"target":59156,"teams":59157,"timesheet":59158,"touch-id":59159,"trash-bin":59160,"unlock":59161,"user":59162,"video-1":59163,"video-2":59164,"wallet":59165,"warning":59166,"activate-outlined":59167,"add-credit-card-outlined":59168,"add-person-outlined":59169,"add-section-outlined":59170,"add-time-outlined":59171,"add":59172,"adjustment-outlined":59173,"alignment-2-outlined":59174,"alignment-outlined":59175,"all-caps":59176,"arrow-down":59177,"arrow-downwards":59178,"arrow-left":59179,"arrow-leftwards":59180,"arrow-right":59181,"arrow-rightwards":59182,"arrow-up":59183,"arrow-upwards":59184,"article-outlined":59185,"at-sign":59186,"auto-graph-outlined":59187,"bell-active-outlined":59188,"bell-outlined":59189,"bell-slash-outlined":59190,"billing-outlined":59191,"body-outlined":59192,"bold":59193,"bookmark-added-outlined":59194,"bookmark-outlined":59195,"box-check-outlined":59196,"box-outlined":59197,"bullet-points":59198,"cake-outlined":59199,"calendar-dates-outlined":59200,"calendar-star-outlined":59201,"camera-outlined":59202,"cancel":59203,"chat-bubble-outlined":59204,"chat-unread-outlined":59205,"checkmark":59206,"circle-add-outlined":59207,"circle-cancel-outlined":59208,"circle-down-outlined":59209,"circle-info-outlined":59210,"circle-left-outlined":59211,"circle-ok-outlined":59212,"circle-question-outlined":59213,"circle-remove-outlined":59214,"circle-right-outlined":59215,"circle-up-outlined":59216,"circle-warning-outlined":59217,"clock-2-outlined":59218,"clock-outlined":59219,"cog-outlined":59220,"coin-outlined":59221,"comment-outlined":59222,"contacts-outlined":59223,"credit-card-outlined":59224,"cup-outlined":59225,"direction-arrows-outlined":59226,"directory-outlined":59227,"document-outlined":59228,"dollar-card-outlined":59229,"dollar-coin-shine-outlined":59230,"dollar-sign":59231,"double-buildings-outlined":59232,"double-left-arrows":59233,"double-right-arrows":59234,"download-outlined":59235,"edit-template-outlined":59236,"email-outlined":59237,"enter-arrow":59238,"envelope-outlined":59239,"expense-outlined":59240,"explore-outlined":59241,"external-link":59242,"eye-invisible-outlined":59243,"eye-outlined":59244,"face-id":59245,"face-meh-outlined":59246,"face-open-smiley-outlined":59247,"face-sad-outlined":59248,"face-smiley-outlined":59249,"feed-outlined":59250,"file-certified-outlined":59251,"file-clone-outlined":59252,"file-copy-outlined":59253,"file-dispose-outlined":59254,"file-dollar-outlined":59255,"file-download-outlined":59256,"file-export-outlined":59257,"file-lock-outlined":59258,"file-outlined":59259,"file-search-outlined":59260,"file-secured-outlined":59261,"file-statutory-outlined":59262,"file-verified-outlined":59263,"filter-outlined":59264,"folder-outlined":59265,"folder-user-outlined":59266,"funnel-filter-outline":59267,"graph-outlined":59268,"hand-holding-user-outlined":59269,"happy-sun-outlined":59270,"health-bag-outlined":59271,"heart-outlined":59272,"home-active-outlined":59273,"home-outlined":59274,"id-card-outlined":59275,"image-outlined":59276,"import-outlined":59277,"instapay-outlined":59278,"italic":59279,"link-1":59280,"link-2":59281,"list-outlined":59282,"live-help-outlined":59283,"location-outlined":59284,"lock-outlined":59285,"locked-file-outlined":59286,"log-out":59287,"media-content-outlined":59288,"menu-close":59289,"menu-expand":59290,"menu-fold-outlined":59291,"menu-unfold-outlined":59292,"moneybag-outlined":59293,"moon-outlined":59294,"more-horizontal":59295,"more-vertical":59296,"multiple-folders-outlined":59297,"multiple-users-outlined":59298,"near-me-outlined":59299,"node-outlined":59300,"number-points":59301,"number":59302,"overview-outlined":59303,"payment-summary-outlined":59304,"payslip-outlined":59305,"pencil-outlined":59306,"percentage":59307,"phone-outlined":59308,"piggy-bank-outlined":59309,"plane-outlined":59310,"play-circle-outlined":59311,"print-outlined":59312,"qr-code-outlined":59313,"qualification-outlined":59314,"re-assign":59315,"redeem":59316,"refresh":59317,"remove":59318,"reply-outlined":59319,"restart":59320,"return-arrow":59321,"rostering-outlined":59322,"save-outlined":59323,"schedule-outlined":59324,"search-outlined":59325,"search-secured-outlined":59326,"send-outlined":59327,"share-1":59328,"share-2":59329,"share-outlined":59330,"show-chart-outlined":59331,"single-down-arrow":59332,"single-left-arrow":59333,"single-right-arrow":59334,"single-up-arrow":59335,"speaker-active-outlined":59336,"speaker-outlined":59337,"star-circle-outlined":59338,"star-outlined":59339,"stopwatch-outlined":59340,"strikethrough":59341,"suitcase-clock-outlined":59342,"suitcase-outlined":59343,"survey-outlined":59344,"switch-outlined":59345,"sync":59346,"target-outlined":59347,"timesheet-outlined":59348,"today-outlined":59349,"transfer":59350,"trash-bin-outlined":59351,"umbrela-outlined":59352,"unavailable":59353,"underline":59354,"unlock-outlined":59355,"upload-outlined":59356,"user-circle-outlined":59357,"user-gear-outlined":59358,"user-outlined":59359,"user-rectangle-outlined":59360,"video-1-outlined":59361,"video-2-outlined":59362,"wallet-outlined":59363}
|
|
@@ -11,6 +11,7 @@ const IconList = [
|
|
|
11
11
|
'bank',
|
|
12
12
|
'bell',
|
|
13
13
|
'billing',
|
|
14
|
+
'bookmark-added',
|
|
14
15
|
'bookmark',
|
|
15
16
|
'box-check',
|
|
16
17
|
'box',
|
|
@@ -116,6 +117,7 @@ const IconList = [
|
|
|
116
117
|
'looks-two',
|
|
117
118
|
'media-content',
|
|
118
119
|
'menu',
|
|
120
|
+
'money-notes',
|
|
119
121
|
'moneybag',
|
|
120
122
|
'moon',
|
|
121
123
|
'multiple-stars',
|
|
@@ -144,6 +146,7 @@ const IconList = [
|
|
|
144
146
|
'speaker',
|
|
145
147
|
'star-award',
|
|
146
148
|
'star-badge',
|
|
149
|
+
'star-circle',
|
|
147
150
|
'star-medal',
|
|
148
151
|
'star',
|
|
149
152
|
'steps-circle',
|
|
@@ -182,7 +185,9 @@ const IconList = [
|
|
|
182
185
|
'arrow-rightwards',
|
|
183
186
|
'arrow-up',
|
|
184
187
|
'arrow-upwards',
|
|
188
|
+
'article-outlined',
|
|
185
189
|
'at-sign',
|
|
190
|
+
'auto-graph-outlined',
|
|
186
191
|
'bell-active-outlined',
|
|
187
192
|
'bell-outlined',
|
|
188
193
|
'bell-slash-outlined',
|
|
@@ -257,6 +262,7 @@ const IconList = [
|
|
|
257
262
|
'file-outlined',
|
|
258
263
|
'file-search-outlined',
|
|
259
264
|
'file-secured-outlined',
|
|
265
|
+
'file-statutory-outlined',
|
|
260
266
|
'file-verified-outlined',
|
|
261
267
|
'filter-outlined',
|
|
262
268
|
'folder-outlined',
|
|
@@ -297,6 +303,7 @@ const IconList = [
|
|
|
297
303
|
'node-outlined',
|
|
298
304
|
'number-points',
|
|
299
305
|
'number',
|
|
306
|
+
'overview-outlined',
|
|
300
307
|
'payment-summary-outlined',
|
|
301
308
|
'payslip-outlined',
|
|
302
309
|
'pencil-outlined',
|
|
@@ -324,12 +331,14 @@ const IconList = [
|
|
|
324
331
|
'share-1',
|
|
325
332
|
'share-2',
|
|
326
333
|
'share-outlined',
|
|
334
|
+
'show-chart-outlined',
|
|
327
335
|
'single-down-arrow',
|
|
328
336
|
'single-left-arrow',
|
|
329
337
|
'single-right-arrow',
|
|
330
338
|
'single-up-arrow',
|
|
331
339
|
'speaker-active-outlined',
|
|
332
340
|
'speaker-outlined',
|
|
341
|
+
'star-circle-outlined',
|
|
333
342
|
'star-outlined',
|
|
334
343
|
'stopwatch-outlined',
|
|
335
344
|
'strikethrough',
|
|
@@ -117,11 +117,7 @@ const ListItem = ({
|
|
|
117
117
|
</StyledPrefixContainer>
|
|
118
118
|
)}
|
|
119
119
|
<StyledTitleContainer>
|
|
120
|
-
<Typography.Text
|
|
121
|
-
intent="body"
|
|
122
|
-
fontSize="large"
|
|
123
|
-
fontWeight="semi-bold"
|
|
124
|
-
>
|
|
120
|
+
<Typography.Text intent="body" fontSize="large">
|
|
125
121
|
{title}
|
|
126
122
|
</Typography.Text>
|
|
127
123
|
{!!subtitle && (
|
|
@@ -131,7 +131,7 @@ exports[`ListItem renders correctly ListItem with children 1`] = `
|
|
|
131
131
|
Array [
|
|
132
132
|
Object {
|
|
133
133
|
"color": "#001f23",
|
|
134
|
-
"fontFamily": "BeVietnamPro-
|
|
134
|
+
"fontFamily": "BeVietnamPro-Regular",
|
|
135
135
|
"fontSize": 16,
|
|
136
136
|
"letterSpacing": 0.48,
|
|
137
137
|
"lineHeight": 24,
|
|
@@ -140,7 +140,7 @@ exports[`ListItem renders correctly ListItem with children 1`] = `
|
|
|
140
140
|
]
|
|
141
141
|
}
|
|
142
142
|
themeFontSize="large"
|
|
143
|
-
themeFontWeight="
|
|
143
|
+
themeFontWeight="regular"
|
|
144
144
|
themeIntent="body"
|
|
145
145
|
themeTypeface="neutral"
|
|
146
146
|
>
|
|
@@ -372,7 +372,7 @@ exports[`ListItem renders correctly ListItem with icon 1`] = `
|
|
|
372
372
|
Array [
|
|
373
373
|
Object {
|
|
374
374
|
"color": "#001f23",
|
|
375
|
-
"fontFamily": "BeVietnamPro-
|
|
375
|
+
"fontFamily": "BeVietnamPro-Regular",
|
|
376
376
|
"fontSize": 16,
|
|
377
377
|
"letterSpacing": 0.48,
|
|
378
378
|
"lineHeight": 24,
|
|
@@ -381,7 +381,7 @@ exports[`ListItem renders correctly ListItem with icon 1`] = `
|
|
|
381
381
|
]
|
|
382
382
|
}
|
|
383
383
|
themeFontSize="large"
|
|
384
|
-
themeFontWeight="
|
|
384
|
+
themeFontWeight="regular"
|
|
385
385
|
themeIntent="body"
|
|
386
386
|
themeTypeface="neutral"
|
|
387
387
|
>
|
|
@@ -514,7 +514,7 @@ exports[`ListItem renders correctly ListItem with leading status 1`] = `
|
|
|
514
514
|
Array [
|
|
515
515
|
Object {
|
|
516
516
|
"color": "#001f23",
|
|
517
|
-
"fontFamily": "BeVietnamPro-
|
|
517
|
+
"fontFamily": "BeVietnamPro-Regular",
|
|
518
518
|
"fontSize": 16,
|
|
519
519
|
"letterSpacing": 0.48,
|
|
520
520
|
"lineHeight": 24,
|
|
@@ -523,7 +523,7 @@ exports[`ListItem renders correctly ListItem with leading status 1`] = `
|
|
|
523
523
|
]
|
|
524
524
|
}
|
|
525
525
|
themeFontSize="large"
|
|
526
|
-
themeFontWeight="
|
|
526
|
+
themeFontWeight="regular"
|
|
527
527
|
themeIntent="body"
|
|
528
528
|
themeTypeface="neutral"
|
|
529
529
|
>
|
|
@@ -692,7 +692,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
|
|
|
692
692
|
Array [
|
|
693
693
|
Object {
|
|
694
694
|
"color": "#001f23",
|
|
695
|
-
"fontFamily": "BeVietnamPro-
|
|
695
|
+
"fontFamily": "BeVietnamPro-Regular",
|
|
696
696
|
"fontSize": 16,
|
|
697
697
|
"letterSpacing": 0.48,
|
|
698
698
|
"lineHeight": 24,
|
|
@@ -701,7 +701,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
|
|
|
701
701
|
]
|
|
702
702
|
}
|
|
703
703
|
themeFontSize="large"
|
|
704
|
-
themeFontWeight="
|
|
704
|
+
themeFontWeight="regular"
|
|
705
705
|
themeIntent="body"
|
|
706
706
|
themeTypeface="neutral"
|
|
707
707
|
>
|
|
@@ -1,26 +1,17 @@
|
|
|
1
1
|
import { useTheme } from '@emotion/react';
|
|
2
2
|
import React, { useState } from 'react';
|
|
3
|
-
import { Dimensions, SectionList, View } from 'react-native';
|
|
4
|
-
import type { ReactElement } from 'react';
|
|
5
|
-
import type { SectionListRenderItemInfo } from 'react-native';
|
|
3
|
+
import { Dimensions, SectionList, SectionListProps, View } from 'react-native';
|
|
6
4
|
import SectionHeading from '../SectionHeading';
|
|
7
5
|
import Spinner from '../Spinner';
|
|
8
6
|
import { OptionSpacer, SectionSpacer, StyledSectionList } from './StyledSelect';
|
|
9
|
-
import type {
|
|
10
|
-
SectionData,
|
|
11
|
-
OptionType,
|
|
12
|
-
SelectProps,
|
|
13
|
-
SectionType,
|
|
14
|
-
} from './types';
|
|
7
|
+
import type { OptionType, SelectProps, SectionType } from './types';
|
|
15
8
|
|
|
16
9
|
export type BaseOptionListProps<V, T extends OptionType<V>> = Pick<
|
|
17
10
|
SelectProps<V, T>,
|
|
18
11
|
'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange'
|
|
19
12
|
> & {
|
|
20
|
-
sections: SectionData<V, T>[];
|
|
21
|
-
renderItem: (info: SectionListRenderItemInfo<T, SectionType>) => ReactElement;
|
|
22
13
|
sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
|
|
23
|
-
}
|
|
14
|
+
} & SectionListProps<T, SectionType>;
|
|
24
15
|
|
|
25
16
|
const BaseOptionList = <V, T extends OptionType<V>>({
|
|
26
17
|
keyExtractor,
|
|
@@ -30,6 +21,7 @@ const BaseOptionList = <V, T extends OptionType<V>>({
|
|
|
30
21
|
sections,
|
|
31
22
|
renderItem,
|
|
32
23
|
sectionListRef,
|
|
24
|
+
...rest
|
|
33
25
|
}: BaseOptionListProps<V, T>) => {
|
|
34
26
|
const theme = useTheme();
|
|
35
27
|
|
|
@@ -75,6 +67,7 @@ const BaseOptionList = <V, T extends OptionType<V>>({
|
|
|
75
67
|
renderItem={renderItem}
|
|
76
68
|
ItemSeparatorComponent={OptionSpacer}
|
|
77
69
|
SectionSeparatorComponent={SectionSpacer}
|
|
70
|
+
{...rest}
|
|
78
71
|
/>
|
|
79
72
|
);
|
|
80
73
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { SectionListRenderItemInfo
|
|
3
|
-
import BaseOptionList from '../BaseOptionList';
|
|
2
|
+
import type { SectionListRenderItemInfo } from 'react-native';
|
|
3
|
+
import BaseOptionList, { BaseOptionListProps } from '../BaseOptionList';
|
|
4
4
|
import Option from './Option';
|
|
5
5
|
import type { MultiSelectProps } from '.';
|
|
6
|
-
import type { OptionType,
|
|
6
|
+
import type { OptionType, SectionType } from '../types';
|
|
7
7
|
|
|
8
8
|
type OptionListProps<V, T extends OptionType<V>> = Pick<
|
|
9
9
|
MultiSelectProps<V, T>,
|
|
@@ -15,9 +15,7 @@ type OptionListProps<V, T extends OptionType<V>> = Pick<
|
|
|
15
15
|
| 'renderOption'
|
|
16
16
|
> & {
|
|
17
17
|
onPress: (value: V[]) => void;
|
|
18
|
-
|
|
19
|
-
sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
|
|
20
|
-
};
|
|
18
|
+
} & BaseOptionListProps<V, T>;
|
|
21
19
|
|
|
22
20
|
const OptionList = <V, T extends OptionType<V>>({
|
|
23
21
|
keyExtractor,
|
|
@@ -29,6 +27,7 @@ const OptionList = <V, T extends OptionType<V>>({
|
|
|
29
27
|
renderOption,
|
|
30
28
|
value,
|
|
31
29
|
sectionListRef,
|
|
30
|
+
...rest
|
|
32
31
|
}: OptionListProps<V, T>) => {
|
|
33
32
|
const renderItem = (info: SectionListRenderItemInfo<T, SectionType>) => {
|
|
34
33
|
const { item } = info;
|
|
@@ -63,6 +62,7 @@ const OptionList = <V, T extends OptionType<V>>({
|
|
|
63
62
|
sections={sections}
|
|
64
63
|
renderItem={renderItem}
|
|
65
64
|
sectionListRef={sectionListRef}
|
|
65
|
+
{...rest}
|
|
66
66
|
/>
|
|
67
67
|
);
|
|
68
68
|
};
|
|
@@ -443,6 +443,7 @@ Array [
|
|
|
443
443
|
onScroll={[Function]}
|
|
444
444
|
onScrollBeginDrag={[Function]}
|
|
445
445
|
onScrollEndDrag={[Function]}
|
|
446
|
+
onScrollToIndexFailed={[Function]}
|
|
446
447
|
renderItem={[Function]}
|
|
447
448
|
scrollEventThrottle={50}
|
|
448
449
|
stickyHeaderIndices={
|
|
@@ -2013,6 +2014,7 @@ Array [
|
|
|
2013
2014
|
onScroll={[Function]}
|
|
2014
2015
|
onScrollBeginDrag={[Function]}
|
|
2015
2016
|
onScrollEndDrag={[Function]}
|
|
2017
|
+
onScrollToIndexFailed={[Function]}
|
|
2016
2018
|
renderItem={[Function]}
|
|
2017
2019
|
scrollEventThrottle={50}
|
|
2018
2020
|
stickyHeaderIndices={
|
|
@@ -3757,6 +3759,7 @@ Array [
|
|
|
3757
3759
|
onScroll={[Function]}
|
|
3758
3760
|
onScrollBeginDrag={[Function]}
|
|
3759
3761
|
onScrollEndDrag={[Function]}
|
|
3762
|
+
onScrollToIndexFailed={[Function]}
|
|
3760
3763
|
renderItem={[Function]}
|
|
3761
3764
|
scrollEventThrottle={50}
|
|
3762
3765
|
stickyHeaderIndices={
|
|
@@ -172,6 +172,15 @@ function MultiSelect<V, T extends OptionType<V>>({
|
|
|
172
172
|
value={selectingValue}
|
|
173
173
|
onPress={setSelectingValue}
|
|
174
174
|
sectionListRef={sectionListRef}
|
|
175
|
+
onScrollToIndexFailed={(info) => {
|
|
176
|
+
setTimeout(() => {
|
|
177
|
+
const scrollParams = getScrollParams(value?.[0], sections);
|
|
178
|
+
|
|
179
|
+
if (scrollParams.itemIndex < info.highestMeasuredFrameIndex) {
|
|
180
|
+
sectionListRef.current?.scrollToLocation(scrollParams);
|
|
181
|
+
}
|
|
182
|
+
}, 500);
|
|
183
|
+
}}
|
|
175
184
|
/>
|
|
176
185
|
</BottomSheet>
|
|
177
186
|
</>
|
|
@@ -2,8 +2,9 @@ import React from 'react';
|
|
|
2
2
|
import type { SectionListRenderItemInfo, SectionList } from 'react-native';
|
|
3
3
|
import Option from './Option';
|
|
4
4
|
import type { SingleSelectProps } from '.';
|
|
5
|
-
import type { OptionType,
|
|
5
|
+
import type { OptionType, SectionType } from '../types';
|
|
6
6
|
import { StyledOptionList } from './StyledSingleSelect';
|
|
7
|
+
import { BaseOptionListProps } from '../BaseOptionList';
|
|
7
8
|
|
|
8
9
|
type OptionListProps<V, T extends OptionType<V>> = Pick<
|
|
9
10
|
SingleSelectProps<V, T>,
|
|
@@ -15,9 +16,8 @@ type OptionListProps<V, T extends OptionType<V>> = Pick<
|
|
|
15
16
|
| 'renderOption'
|
|
16
17
|
> & {
|
|
17
18
|
onPress: (value: V | null) => void;
|
|
18
|
-
sections: SectionData<V, T>[];
|
|
19
19
|
sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
|
|
20
|
-
}
|
|
20
|
+
} & BaseOptionListProps<V, T>;
|
|
21
21
|
|
|
22
22
|
const OptionList = <V, T extends OptionType<V>>({
|
|
23
23
|
keyExtractor,
|
|
@@ -29,6 +29,7 @@ const OptionList = <V, T extends OptionType<V>>({
|
|
|
29
29
|
renderOption,
|
|
30
30
|
value,
|
|
31
31
|
sectionListRef,
|
|
32
|
+
...rest
|
|
32
33
|
}: OptionListProps<V, T>) => {
|
|
33
34
|
const renderItem = (info: SectionListRenderItemInfo<T, SectionType>) => {
|
|
34
35
|
const { item } = info;
|
|
@@ -63,6 +64,7 @@ const OptionList = <V, T extends OptionType<V>>({
|
|
|
63
64
|
sections={sections}
|
|
64
65
|
renderItem={renderItem}
|
|
65
66
|
sectionListRef={sectionListRef}
|
|
67
|
+
{...rest}
|
|
66
68
|
/>
|
|
67
69
|
);
|
|
68
70
|
};
|
|
@@ -66,7 +66,12 @@ exports[`OptionList render isLoading correctly 1`] = `
|
|
|
66
66
|
Object {
|
|
67
67
|
"paddingHorizontal": 12,
|
|
68
68
|
},
|
|
69
|
-
|
|
69
|
+
Array [
|
|
70
|
+
Object {
|
|
71
|
+
"paddingBottom": 16,
|
|
72
|
+
},
|
|
73
|
+
undefined,
|
|
74
|
+
],
|
|
70
75
|
]
|
|
71
76
|
}
|
|
72
77
|
>
|
|
@@ -843,7 +848,12 @@ exports[`OptionList renders correctly 1`] = `
|
|
|
843
848
|
Object {
|
|
844
849
|
"paddingHorizontal": 12,
|
|
845
850
|
},
|
|
846
|
-
|
|
851
|
+
Array [
|
|
852
|
+
Object {
|
|
853
|
+
"paddingBottom": 16,
|
|
854
|
+
},
|
|
855
|
+
undefined,
|
|
856
|
+
],
|
|
847
857
|
]
|
|
848
858
|
}
|
|
849
859
|
>
|
|
@@ -1467,7 +1477,12 @@ exports[`OptionList trigger onPress correctly on select new value 1`] = `
|
|
|
1467
1477
|
Object {
|
|
1468
1478
|
"paddingHorizontal": 12,
|
|
1469
1479
|
},
|
|
1470
|
-
|
|
1480
|
+
Array [
|
|
1481
|
+
Object {
|
|
1482
|
+
"paddingBottom": 16,
|
|
1483
|
+
},
|
|
1484
|
+
undefined,
|
|
1485
|
+
],
|
|
1471
1486
|
]
|
|
1472
1487
|
}
|
|
1473
1488
|
>
|
|
@@ -2091,7 +2106,12 @@ exports[`OptionList trigger onPress correctly on unselect current value 1`] = `
|
|
|
2091
2106
|
Object {
|
|
2092
2107
|
"paddingHorizontal": 12,
|
|
2093
2108
|
},
|
|
2094
|
-
|
|
2109
|
+
Array [
|
|
2110
|
+
Object {
|
|
2111
|
+
"paddingBottom": 16,
|
|
2112
|
+
},
|
|
2113
|
+
undefined,
|
|
2114
|
+
],
|
|
2095
2115
|
]
|
|
2096
2116
|
}
|
|
2097
2117
|
>
|