@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.
Files changed (36) hide show
  1. package/.turbo/turbo-build.log +66 -9
  2. package/assets/fonts/hero-icons-mobile.ttf +0 -0
  3. package/es/index.js +473 -133
  4. package/lib/index.js +473 -133
  5. package/package.json +5 -7
  6. package/rollup.config.js +0 -1
  7. package/src/components/Carousel/CarouselItem.tsx +3 -1
  8. package/src/components/Carousel/StyledCarousel.tsx +2 -0
  9. package/src/components/Carousel/__tests__/__snapshots__/index.spec.tsx.snap +18 -15
  10. package/src/components/Icon/HeroIcon/glyphMap.json +1 -1
  11. package/src/components/Icon/IconList.ts +9 -0
  12. package/src/components/List/ListItem.tsx +1 -5
  13. package/src/components/List/__tests__/__snapshots__/ListItem.spec.tsx.snap +8 -8
  14. package/src/components/Select/BaseOptionList.tsx +5 -12
  15. package/src/components/Select/MultiSelect/OptionList.tsx +6 -6
  16. package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +3 -0
  17. package/src/components/Select/MultiSelect/index.tsx +9 -0
  18. package/src/components/Select/SingleSelect/OptionList.tsx +5 -3
  19. package/src/components/Select/SingleSelect/__tests__/__snapshots__/OptionList.spec.tsx.snap +24 -4
  20. package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap +21 -3
  21. package/src/components/Select/SingleSelect/index.tsx +8 -0
  22. package/src/components/Swipeable/Buttons.tsx +65 -0
  23. package/src/components/Swipeable/StyledSwipeable.tsx +14 -2
  24. package/src/components/Swipeable/SwipeableAction.tsx +15 -7
  25. package/src/components/Swipeable/index.tsx +531 -136
  26. package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +1 -1
  27. package/src/theme/components/carousel.ts +1 -1
  28. package/types/components/Calendar/helpers.d.ts +2 -2
  29. package/types/components/Select/helpers.d.ts +1 -1
  30. package/types/components/Swipeable/Buttons.d.ts +15 -0
  31. package/types/components/Swipeable/StyledSwipeable.d.ts +15 -2
  32. package/types/components/Swipeable/SwipeableAction.d.ts +10 -6
  33. package/types/components/Swipeable/index.d.ts +24 -41
  34. package/types/components/Toolbar/index.d.ts +2 -3
  35. package/types/testHelpers/renderWithTheme.d.ts +1 -1
  36. 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.4",
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.3.4",
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.3.4",
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.3.4",
62
+ "eslint-config-hd": "8.5.0",
64
63
  "jest": "^27.3.1",
65
- "prettier-config-hd": "8.3.4",
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
@@ -29,7 +29,6 @@ export default {
29
29
  'react-native-safe-area-context',
30
30
  '@react-native-community/datetimepicker',
31
31
  '@react-native-community/slider',
32
- 'react-native-gesture-handler',
33
32
  'react-native-webview',
34
33
  'react-native-pager-view',
35
34
  'react-native-vector-icons',
@@ -35,7 +35,9 @@ const CarouselItem = ({
35
35
  >
36
36
  {content}
37
37
  <StyledCarouselHeading>{heading}</StyledCarouselHeading>
38
- {body ? <Typography.Text>{body}</Typography.Text> : null}
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": 36,
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": 14,
200
- "letterSpacing": 0.42,
201
- "lineHeight": 22,
200
+ "fontSize": 16,
201
+ "letterSpacing": 0.48,
202
+ "lineHeight": 24,
202
203
  },
203
204
  undefined,
204
205
  ]
205
206
  }
206
- themeFontSize="medium"
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": 36,
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": 14,
333
- "letterSpacing": 0.42,
334
- "lineHeight": 22,
334
+ "fontSize": 16,
335
+ "letterSpacing": 0.48,
336
+ "lineHeight": 24,
335
337
  },
336
338
  undefined,
337
339
  ]
338
340
  }
339
- themeFontSize="medium"
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": 36,
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": 14,
449
- "letterSpacing": 0.42,
450
- "lineHeight": 22,
451
+ "fontSize": 16,
452
+ "letterSpacing": 0.48,
453
+ "lineHeight": 24,
451
454
  },
452
455
  undefined,
453
456
  ]
454
457
  }
455
- themeFontSize="medium"
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":59012,"box":59013,"buildings":59014,"cake":59015,"calendar-clock":59016,"calendar":59017,"candy-box-menu":59018,"caret-down-small":59019,"caret-down":59020,"caret-left-small":59021,"caret-left":59022,"caret-right-small":59023,"caret-right":59024,"caret-up-small":59025,"caret-up":59026,"check-radio":59027,"circle-add":59028,"circle-cancel":59029,"circle-check":59030,"circle-down":59031,"circle-info":59032,"circle-left":59033,"circle-ok":59034,"circle-pencil":59035,"circle-question":59036,"circle-remove":59037,"circle-right":59038,"circle-up":59039,"circle-warning":59040,"clock-3":59041,"clock":59042,"cloud-download":59043,"cloud-upload":59044,"cog":59045,"coin":59046,"contacts":59047,"credit-card":59048,"diamond":59049,"direction-arrows":59050,"directory":59051,"document":59052,"dollar-coin-shine":59053,"double-buildings":59054,"edit-template":59055,"envelope":59056,"expense":59057,"eye-circle":59058,"eye-invisible":59059,"eye":59060,"face-meh":59061,"face-sad":59062,"face-smiley":59063,"feed":59064,"feedbacks":59065,"file-certified":59066,"file-clone":59067,"file-copy":59068,"file-csv":59069,"file-dispose":59070,"file-doc":59071,"file-excel":59072,"file-export":59073,"file-lock":59074,"file-pdf":59075,"file-powerpoint":59076,"file-search":59077,"file-secured":59078,"file-sheets":59079,"file-slide":59080,"file-verified":59081,"file-word":59082,"file":59083,"filter":59084,"folder-user":59085,"folder":59086,"format-bold":59087,"format-heading1":59088,"format-heading2":59089,"format-italic":59090,"format-list-bulleted":59091,"format-list-numbered":59092,"format-underlined":59093,"funnel-filter":59094,"global-dollar":59095,"globe":59096,"graduation-cap":59097,"graph":59098,"happy-sun":59099,"health-bag":59100,"heart":59101,"home":59102,"image":59103,"import":59104,"incident-siren":59105,"instapay":59106,"list":59107,"loading-2":59108,"loading":59109,"location":59110,"lock":59111,"looks-one":59112,"looks-two":59113,"media-content":59114,"menu":59115,"moneybag":59116,"moon":59117,"multiple-stars":59118,"multiple-users":59119,"node":59120,"open-folder":59121,"paperclip":59122,"payment-summary":59123,"pencil":59124,"phone":59125,"piggy-bank":59126,"plane":59127,"play-circle":59128,"print":59129,"raising-hands":59130,"reply-arrow":59131,"reply":59132,"reschedule":59133,"rostering":59134,"save":59135,"schedule-send":59136,"schedule":59137,"search-person":59138,"send":59139,"speaker-active":59140,"speaker":59141,"star-award":59142,"star-badge":59143,"star-medal":59144,"star":59145,"steps-circle":59146,"stopwatch":59147,"suitcase":59148,"survey":59149,"swag":59150,"switch":59151,"tag":59152,"target":59153,"teams":59154,"timesheet":59155,"touch-id":59156,"trash-bin":59157,"unlock":59158,"user":59159,"video-1":59160,"video-2":59161,"wallet":59162,"warning":59163,"activate-outlined":59164,"add-credit-card-outlined":59165,"add-person-outlined":59166,"add-section-outlined":59167,"add-time-outlined":59168,"add":59169,"adjustment-outlined":59170,"alignment-2-outlined":59171,"alignment-outlined":59172,"all-caps":59173,"arrow-down":59174,"arrow-downwards":59175,"arrow-left":59176,"arrow-leftwards":59177,"arrow-right":59178,"arrow-rightwards":59179,"arrow-up":59180,"arrow-upwards":59181,"at-sign":59182,"bell-active-outlined":59183,"bell-outlined":59184,"bell-slash-outlined":59185,"billing-outlined":59186,"body-outlined":59187,"bold":59188,"bookmark-added-outlined":59189,"bookmark-outlined":59190,"box-check-outlined":59191,"box-outlined":59192,"bullet-points":59193,"cake-outlined":59194,"calendar-dates-outlined":59195,"calendar-star-outlined":59196,"camera-outlined":59197,"cancel":59198,"chat-bubble-outlined":59199,"chat-unread-outlined":59200,"checkmark":59201,"circle-add-outlined":59202,"circle-cancel-outlined":59203,"circle-down-outlined":59204,"circle-info-outlined":59205,"circle-left-outlined":59206,"circle-ok-outlined":59207,"circle-question-outlined":59208,"circle-remove-outlined":59209,"circle-right-outlined":59210,"circle-up-outlined":59211,"circle-warning-outlined":59212,"clock-2-outlined":59213,"clock-outlined":59214,"cog-outlined":59215,"coin-outlined":59216,"comment-outlined":59217,"contacts-outlined":59218,"credit-card-outlined":59219,"cup-outlined":59220,"direction-arrows-outlined":59221,"directory-outlined":59222,"document-outlined":59223,"dollar-card-outlined":59224,"dollar-coin-shine-outlined":59225,"dollar-sign":59226,"double-buildings-outlined":59227,"double-left-arrows":59228,"double-right-arrows":59229,"download-outlined":59230,"edit-template-outlined":59231,"email-outlined":59232,"enter-arrow":59233,"envelope-outlined":59234,"expense-outlined":59235,"explore-outlined":59236,"external-link":59237,"eye-invisible-outlined":59238,"eye-outlined":59239,"face-id":59240,"face-meh-outlined":59241,"face-open-smiley-outlined":59242,"face-sad-outlined":59243,"face-smiley-outlined":59244,"feed-outlined":59245,"file-certified-outlined":59246,"file-clone-outlined":59247,"file-copy-outlined":59248,"file-dispose-outlined":59249,"file-dollar-outlined":59250,"file-download-outlined":59251,"file-export-outlined":59252,"file-lock-outlined":59253,"file-outlined":59254,"file-search-outlined":59255,"file-secured-outlined":59256,"file-verified-outlined":59257,"filter-outlined":59258,"folder-outlined":59259,"folder-user-outlined":59260,"funnel-filter-outline":59261,"graph-outlined":59262,"hand-holding-user-outlined":59263,"happy-sun-outlined":59264,"health-bag-outlined":59265,"heart-outlined":59266,"home-active-outlined":59267,"home-outlined":59268,"id-card-outlined":59269,"image-outlined":59270,"import-outlined":59271,"instapay-outlined":59272,"italic":59273,"link-1":59274,"link-2":59275,"list-outlined":59276,"live-help-outlined":59277,"location-outlined":59278,"lock-outlined":59279,"locked-file-outlined":59280,"log-out":59281,"media-content-outlined":59282,"menu-close":59283,"menu-expand":59284,"menu-fold-outlined":59285,"menu-unfold-outlined":59286,"moneybag-outlined":59287,"moon-outlined":59288,"more-horizontal":59289,"more-vertical":59290,"multiple-folders-outlined":59291,"multiple-users-outlined":59292,"near-me-outlined":59293,"node-outlined":59294,"number-points":59295,"number":59296,"payment-summary-outlined":59297,"payslip-outlined":59298,"pencil-outlined":59299,"percentage":59300,"phone-outlined":59301,"piggy-bank-outlined":59302,"plane-outlined":59303,"play-circle-outlined":59304,"print-outlined":59305,"qr-code-outlined":59306,"qualification-outlined":59307,"re-assign":59308,"redeem":59309,"refresh":59310,"remove":59311,"reply-outlined":59312,"restart":59313,"return-arrow":59314,"rostering-outlined":59315,"save-outlined":59316,"schedule-outlined":59317,"search-outlined":59318,"search-secured-outlined":59319,"send-outlined":59320,"share-1":59321,"share-2":59322,"share-outlined":59323,"single-down-arrow":59324,"single-left-arrow":59325,"single-right-arrow":59326,"single-up-arrow":59327,"speaker-active-outlined":59328,"speaker-outlined":59329,"star-outlined":59330,"stopwatch-outlined":59331,"strikethrough":59332,"suitcase-clock-outlined":59333,"suitcase-outlined":59334,"survey-outlined":59335,"switch-outlined":59336,"sync":59337,"target-outlined":59338,"timesheet-outlined":59339,"today-outlined":59340,"transfer":59341,"trash-bin-outlined":59342,"umbrela-outlined":59343,"unavailable":59344,"underline":59345,"unlock-outlined":59346,"upload-outlined":59347,"user-circle-outlined":59348,"user-gear-outlined":59349,"user-outlined":59350,"user-rectangle-outlined":59351,"video-1-outlined":59352,"video-2-outlined":59353,"wallet-outlined":59354}
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-SemiBold",
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="semi-bold"
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-SemiBold",
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="semi-bold"
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-SemiBold",
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="semi-bold"
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-SemiBold",
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="semi-bold"
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, SectionList } from 'react-native';
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, SectionData, SectionType } from '../types';
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
- sections: SectionData<V, T>[];
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, SectionData, SectionType } from '../types';
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
- Object {},
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
- Object {},
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
- Object {},
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
- Object {},
2109
+ Array [
2110
+ Object {
2111
+ "paddingBottom": 16,
2112
+ },
2113
+ undefined,
2114
+ ],
2095
2115
  ]
2096
2116
  }
2097
2117
  >