@hero-design/rn 8.3.4 → 8.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "8.3.4",
+  "version": "8.5.0",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/native": "^11.9.3",
     "@emotion/react": "^11.9.3",
-    "@hero-design/colors": "8.3.4",
+    "@hero-design/colors": "8.5.0",
     "date-fns": "^2.16.1",
     "events": "^3.2.0",
     "hero-editor": "^1.9.21"
@@ -44,7 +44,7 @@
     "@babel/preset-typescript": "^7.17.12",
     "@babel/runtime": "^7.18.9",
     "@emotion/jest": "^11.9.3",
-    "@hero-design/eslint-plugin": "8.3.4",
+    "@hero-design/eslint-plugin": "8.5.0",
     "@react-native-community/datetimepicker": "^3.5.2",
     "@react-native-community/slider": "4.1.12",
     "@rollup/plugin-babel": "^5.3.1",
@@ -60,9 +60,9 @@
     "@types/react-native": "^0.67.7",
     "@types/react-native-vector-icons": "^6.4.10",
     "babel-plugin-inline-import": "^3.0.0",
-    "eslint-config-hd": "8.3.4",
+    "eslint-config-hd": "8.5.0",
     "jest": "^27.3.1",
-    "prettier-config-hd": "8.3.4",
+    "prettier-config-hd": "8.5.0",
     "react": "18.0.0",
     "react-native": "0.69.7",
     "react-native-gesture-handler": "~2.1.0",

package/src/components/Carousel/CarouselItem.tsx

@@ -35,7 +35,9 @@ const CarouselItem = ({
       >
         {content}
         <StyledCarouselHeading>{heading}</StyledCarouselHeading>
-        {body ? <Typography.Text>{body}</Typography.Text> : null}
+        {body ? (
+          <Typography.Text fontSize="large">{body}</Typography.Text>
+        ) : null}
       </StyledCarouselContentWrapper>
     </Box>
   );

package/src/components/Carousel/StyledCarousel.tsx

@@ -3,6 +3,7 @@ import styled from '@emotion/native';
 import Typography from '../Typography';
 import Image from '../Image';
 import Box from '../Box';
+import { scale } from '../../utils/scale';
 
 const StyledBackDrop = styled(View)<{
   themeSlideBackground: string;
@@ -38,6 +39,7 @@ const StyledCarouselContentWrapper = styled(Box)<{
   width: number;
 }>(({ width }) => ({
   width,
+  minHeight: scale(250),
 }));
 
 const StyledCarouselFooterWrapper = styled(View)(({ theme }) => ({

package/src/components/Carousel/__tests__/__snapshots__/index.spec.tsx.snap

@@ -153,6 +153,7 @@ exports[`Carousel renders basic carousel 1`] = `
                   },
                   Array [
                     Object {
+                      "minHeight": 250,
                       "width": 750,
                     },
                     undefined,
@@ -174,7 +175,7 @@ exports[`Carousel renders basic carousel 1`] = `
                     Array [
                       Object {
                         "fontFamily": "RebondGrotesque-SemiBold",
-                        "fontSize": 36,
+                        "fontSize": 32,
                         "lineHeight": 44,
                         "marginBottom": 16,
                         "marginTop": 8,
@@ -196,14 +197,14 @@ exports[`Carousel renders basic carousel 1`] = `
                     Object {
                       "color": "#001f23",
                       "fontFamily": "BeVietnamPro-Regular",
-                      "fontSize": 14,
-                      "letterSpacing": 0.42,
-                      "lineHeight": 22,
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
                     },
                     undefined,
                   ]
                 }
-                themeFontSize="medium"
+                themeFontSize="large"
                 themeFontWeight="regular"
                 themeIntent="body"
                 themeTypeface="neutral"
@@ -269,6 +270,7 @@ exports[`Carousel renders basic carousel 1`] = `
                   },
                   Array [
                     Object {
+                      "minHeight": 250,
                       "width": 750,
                     },
                     undefined,
@@ -307,7 +309,7 @@ exports[`Carousel renders basic carousel 1`] = `
                     Array [
                       Object {
                         "fontFamily": "RebondGrotesque-SemiBold",
-                        "fontSize": 36,
+                        "fontSize": 32,
                         "lineHeight": 44,
                         "marginBottom": 16,
                         "marginTop": 8,
@@ -329,14 +331,14 @@ exports[`Carousel renders basic carousel 1`] = `
                     Object {
                       "color": "#001f23",
                       "fontFamily": "BeVietnamPro-Regular",
-                      "fontSize": 14,
-                      "letterSpacing": 0.42,
-                      "lineHeight": 22,
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
                     },
                     undefined,
                   ]
                 }
-                themeFontSize="medium"
+                themeFontSize="large"
                 themeFontWeight="regular"
                 themeIntent="body"
                 themeTypeface="neutral"
@@ -402,6 +404,7 @@ exports[`Carousel renders basic carousel 1`] = `
                   },
                   Array [
                     Object {
+                      "minHeight": 250,
                       "width": 750,
                     },
                     undefined,
@@ -423,7 +426,7 @@ exports[`Carousel renders basic carousel 1`] = `
                     Array [
                       Object {
                         "fontFamily": "RebondGrotesque-SemiBold",
-                        "fontSize": 36,
+                        "fontSize": 32,
                         "lineHeight": 44,
                         "marginBottom": 16,
                         "marginTop": 8,
@@ -445,14 +448,14 @@ exports[`Carousel renders basic carousel 1`] = `
                     Object {
                       "color": "#001f23",
                       "fontFamily": "BeVietnamPro-Regular",
-                      "fontSize": 14,
-                      "letterSpacing": 0.42,
-                      "lineHeight": 22,
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
                     },
                     undefined,
                   ]
                 }
-                themeFontSize="medium"
+                themeFontSize="large"
                 themeFontWeight="regular"
                 themeIntent="body"
                 themeTypeface="neutral"

package/src/components/Icon/HeroIcon/glyphMap.json

@@ -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}
+{"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-verified-outlined":59262,"filter-outlined":59263,"folder-outlined":59264,"folder-user-outlined":59265,"funnel-filter-outline":59266,"graph-outlined":59267,"hand-holding-user-outlined":59268,"happy-sun-outlined":59269,"health-bag-outlined":59270,"heart-outlined":59271,"home-active-outlined":59272,"home-outlined":59273,"id-card-outlined":59274,"image-outlined":59275,"import-outlined":59276,"instapay-outlined":59277,"italic":59278,"link-1":59279,"link-2":59280,"list-outlined":59281,"live-help-outlined":59282,"location-outlined":59283,"lock-outlined":59284,"locked-file-outlined":59285,"log-out":59286,"media-content-outlined":59287,"menu-close":59288,"menu-expand":59289,"menu-fold-outlined":59290,"menu-unfold-outlined":59291,"moneybag-outlined":59292,"moon-outlined":59293,"more-horizontal":59294,"more-vertical":59295,"multiple-folders-outlined":59296,"multiple-users-outlined":59297,"near-me-outlined":59298,"node-outlined":59299,"number-points":59300,"number":59301,"overview-outlined":59302,"payment-summary-outlined":59303,"payslip-outlined":59304,"pencil-outlined":59305,"percentage":59306,"phone-outlined":59307,"piggy-bank-outlined":59308,"plane-outlined":59309,"play-circle-outlined":59310,"print-outlined":59311,"qr-code-outlined":59312,"qualification-outlined":59313,"re-assign":59314,"redeem":59315,"refresh":59316,"remove":59317,"reply-outlined":59318,"restart":59319,"return-arrow":59320,"rostering-outlined":59321,"save-outlined":59322,"schedule-outlined":59323,"search-outlined":59324,"search-secured-outlined":59325,"send-outlined":59326,"share-1":59327,"share-2":59328,"share-outlined":59329,"show-chart-outlined":59330,"single-down-arrow":59331,"single-left-arrow":59332,"single-right-arrow":59333,"single-up-arrow":59334,"speaker-active-outlined":59335,"speaker-outlined":59336,"star-circle-outlined":59337,"star-outlined":59338,"stopwatch-outlined":59339,"strikethrough":59340,"suitcase-clock-outlined":59341,"suitcase-outlined":59342,"survey-outlined":59343,"switch-outlined":59344,"sync":59345,"target-outlined":59346,"timesheet-outlined":59347,"today-outlined":59348,"transfer":59349,"trash-bin-outlined":59350,"umbrela-outlined":59351,"unavailable":59352,"underline":59353,"unlock-outlined":59354,"upload-outlined":59355,"user-circle-outlined":59356,"user-gear-outlined":59357,"user-outlined":59358,"user-rectangle-outlined":59359,"video-1-outlined":59360,"video-2-outlined":59361,"wallet-outlined":59362}

package/src/components/Icon/IconList.ts

@@ -11,6 +11,7 @@ const IconList = [
   'bank',
   'bell',
   'billing',
+  'bookmark-added',
   'bookmark',
   'box-check',
   'box',
@@ -116,6 +117,7 @@ const IconList = [
   'looks-two',
   'media-content',
   'menu',
+  'money-notes',
   'moneybag',
   'moon',
   'multiple-stars',
@@ -144,6 +146,7 @@ const IconList = [
   'speaker',
   'star-award',
   'star-badge',
+  'star-circle',
   'star-medal',
   'star',
   'steps-circle',
@@ -182,7 +185,9 @@ const IconList = [
   'arrow-rightwards',
   'arrow-up',
   'arrow-upwards',
+  'article-outlined',
   'at-sign',
+  'auto-graph-outlined',
   'bell-active-outlined',
   'bell-outlined',
   'bell-slash-outlined',
@@ -297,6 +302,7 @@ const IconList = [
   'node-outlined',
   'number-points',
   'number',
+  'overview-outlined',
   'payment-summary-outlined',
   'payslip-outlined',
   'pencil-outlined',
@@ -324,12 +330,14 @@ const IconList = [
   'share-1',
   'share-2',
   'share-outlined',
+  'show-chart-outlined',
   'single-down-arrow',
   'single-left-arrow',
   'single-right-arrow',
   'single-up-arrow',
   'speaker-active-outlined',
   'speaker-outlined',
+  'star-circle-outlined',
   'star-outlined',
   'stopwatch-outlined',
   'strikethrough',

package/src/components/Select/BaseOptionList.tsx

@@ -1,26 +1,17 @@
 import { useTheme } from '@emotion/react';
 import React, { useState } from 'react';
-import { Dimensions, SectionList, View } from 'react-native';
-import type { ReactElement } from 'react';
-import type { SectionListRenderItemInfo } from 'react-native';
+import { Dimensions, SectionList, SectionListProps, View } from 'react-native';
 import SectionHeading from '../SectionHeading';
 import Spinner from '../Spinner';
 import { OptionSpacer, SectionSpacer, StyledSectionList } from './StyledSelect';
-import type {
-  SectionData,
-  OptionType,
-  SelectProps,
-  SectionType,
-} from './types';
+import type { OptionType, SelectProps, SectionType } from './types';
 
 export type BaseOptionListProps<V, T extends OptionType<V>> = Pick<
   SelectProps<V, T>,
   'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange'
 > & {
-  sections: SectionData<V, T>[];
-  renderItem: (info: SectionListRenderItemInfo<T, SectionType>) => ReactElement;
   sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
-};
+} & SectionListProps<T, SectionType>;
 
 const BaseOptionList = <V, T extends OptionType<V>>({
   keyExtractor,
@@ -30,6 +21,7 @@ const BaseOptionList = <V, T extends OptionType<V>>({
   sections,
   renderItem,
   sectionListRef,
+  ...rest
 }: BaseOptionListProps<V, T>) => {
   const theme = useTheme();
 
@@ -75,6 +67,7 @@ const BaseOptionList = <V, T extends OptionType<V>>({
       renderItem={renderItem}
       ItemSeparatorComponent={OptionSpacer}
       SectionSeparatorComponent={SectionSpacer}
+      {...rest}
     />
   );
 };

package/src/components/Select/MultiSelect/OptionList.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { SectionListRenderItemInfo, SectionList } from 'react-native';
-import BaseOptionList from '../BaseOptionList';
+import type { SectionListRenderItemInfo } from 'react-native';
+import BaseOptionList, { BaseOptionListProps } from '../BaseOptionList';
 import Option from './Option';
 import type { MultiSelectProps } from '.';
-import type { OptionType, SectionData, SectionType } from '../types';
+import type { OptionType, SectionType } from '../types';
 
 type OptionListProps<V, T extends OptionType<V>> = Pick<
   MultiSelectProps<V, T>,
@@ -15,9 +15,7 @@ type OptionListProps<V, T extends OptionType<V>> = Pick<
   | 'renderOption'
 > & {
   onPress: (value: V[]) => void;
-  sections: SectionData<V, T>[];
-  sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
-};
+} & BaseOptionListProps<V, T>;
 
 const OptionList = <V, T extends OptionType<V>>({
   keyExtractor,
@@ -29,6 +27,7 @@ const OptionList = <V, T extends OptionType<V>>({
   renderOption,
   value,
   sectionListRef,
+  ...rest
 }: OptionListProps<V, T>) => {
   const renderItem = (info: SectionListRenderItemInfo<T, SectionType>) => {
     const { item } = info;
@@ -63,6 +62,7 @@ const OptionList = <V, T extends OptionType<V>>({
       sections={sections}
       renderItem={renderItem}
       sectionListRef={sectionListRef}
+      {...rest}
     />
   );
 };

package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap

@@ -443,6 +443,7 @@ Array [
             onScroll={[Function]}
             onScrollBeginDrag={[Function]}
             onScrollEndDrag={[Function]}
+            onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
             scrollEventThrottle={50}
             stickyHeaderIndices={
@@ -2013,6 +2014,7 @@ Array [
             onScroll={[Function]}
             onScrollBeginDrag={[Function]}
             onScrollEndDrag={[Function]}
+            onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
             scrollEventThrottle={50}
             stickyHeaderIndices={
@@ -3757,6 +3759,7 @@ Array [
             onScroll={[Function]}
             onScrollBeginDrag={[Function]}
             onScrollEndDrag={[Function]}
+            onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
             scrollEventThrottle={50}
             stickyHeaderIndices={

package/src/components/Select/MultiSelect/index.tsx

@@ -172,6 +172,15 @@ function MultiSelect<V, T extends OptionType<V>>({
           value={selectingValue}
           onPress={setSelectingValue}
           sectionListRef={sectionListRef}
+          onScrollToIndexFailed={(info) => {
+            setTimeout(() => {
+              const scrollParams = getScrollParams(value?.[0], sections);
+
+              if (scrollParams.itemIndex < info.highestMeasuredFrameIndex) {
+                sectionListRef.current?.scrollToLocation(scrollParams);
+              }
+            }, 500);
+          }}
         />
       </BottomSheet>
     </>

package/src/components/Select/SingleSelect/OptionList.tsx

@@ -2,8 +2,9 @@ import React from 'react';
 import type { SectionListRenderItemInfo, SectionList } from 'react-native';
 import Option from './Option';
 import type { SingleSelectProps } from '.';
-import type { OptionType, SectionData, SectionType } from '../types';
+import type { OptionType, SectionType } from '../types';
 import { StyledOptionList } from './StyledSingleSelect';
+import { BaseOptionListProps } from '../BaseOptionList';
 
 type OptionListProps<V, T extends OptionType<V>> = Pick<
   SingleSelectProps<V, T>,
@@ -15,9 +16,8 @@ type OptionListProps<V, T extends OptionType<V>> = Pick<
   | 'renderOption'
 > & {
   onPress: (value: V | null) => void;
-  sections: SectionData<V, T>[];
   sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
-};
+} & BaseOptionListProps<V, T>;
 
 const OptionList = <V, T extends OptionType<V>>({
   keyExtractor,
@@ -29,6 +29,7 @@ const OptionList = <V, T extends OptionType<V>>({
   renderOption,
   value,
   sectionListRef,
+  ...rest
 }: OptionListProps<V, T>) => {
   const renderItem = (info: SectionListRenderItemInfo<T, SectionType>) => {
     const { item } = info;
@@ -63,6 +64,7 @@ const OptionList = <V, T extends OptionType<V>>({
       sections={sections}
       renderItem={renderItem}
       sectionListRef={sectionListRef}
+      {...rest}
     />
   );
 };

package/src/components/Select/SingleSelect/__tests__/__snapshots__/OptionList.spec.tsx.snap

@@ -66,7 +66,12 @@ exports[`OptionList render isLoading correctly 1`] = `
       Object {
         "paddingHorizontal": 12,
       },
-      Object {},
+      Array [
+        Object {
+          "paddingBottom": 16,
+        },
+        undefined,
+      ],
     ]
   }
 >
@@ -843,7 +848,12 @@ exports[`OptionList renders correctly 1`] = `
       Object {
         "paddingHorizontal": 12,
       },
-      Object {},
+      Array [
+        Object {
+          "paddingBottom": 16,
+        },
+        undefined,
+      ],
     ]
   }
 >
@@ -1467,7 +1477,12 @@ exports[`OptionList trigger onPress correctly on select new value 1`] = `
       Object {
         "paddingHorizontal": 12,
       },
-      Object {},
+      Array [
+        Object {
+          "paddingBottom": 16,
+        },
+        undefined,
+      ],
     ]
   }
 >
@@ -2091,7 +2106,12 @@ exports[`OptionList trigger onPress correctly on unselect current value 1`] = `
       Object {
         "paddingHorizontal": 12,
       },
-      Object {},
+      Array [
+        Object {
+          "paddingBottom": 16,
+        },
+        undefined,
+      ],
     ]
   }
 >

package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap

@@ -442,6 +442,7 @@ Array [
             onScroll={[Function]}
             onScrollBeginDrag={[Function]}
             onScrollEndDrag={[Function]}
+            onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
             scrollEventThrottle={50}
             stickyHeaderIndices={
@@ -455,7 +456,12 @@ Array [
                 Object {
                   "paddingHorizontal": 12,
                 },
-                Object {},
+                Array [
+                  Object {
+                    "paddingBottom": 16,
+                  },
+                  undefined,
+                ],
               ]
             }
           >
@@ -1933,6 +1939,7 @@ Array [
             onScroll={[Function]}
             onScrollBeginDrag={[Function]}
             onScrollEndDrag={[Function]}
+            onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
             scrollEventThrottle={50}
             stickyHeaderIndices={
@@ -1945,7 +1952,12 @@ Array [
                 Object {
                   "paddingHorizontal": 12,
                 },
-                Object {},
+                Array [
+                  Object {
+                    "paddingBottom": 16,
+                  },
+                  undefined,
+                ],
               ]
             }
           >
@@ -3544,6 +3556,7 @@ Array [
             onScroll={[Function]}
             onScrollBeginDrag={[Function]}
             onScrollEndDrag={[Function]}
+            onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
             scrollEventThrottle={50}
             stickyHeaderIndices={
@@ -3557,7 +3570,12 @@ Array [
                 Object {
                   "paddingHorizontal": 12,
                 },
-                Object {},
+                Array [
+                  Object {
+                    "paddingBottom": 16,
+                  },
+                  undefined,
+                ],
               ]
             }
           >

package/src/components/Select/SingleSelect/index.tsx

@@ -134,6 +134,14 @@ const SingleSelect = <V, T extends OptionType<V>>({
             onConfirm(selectedValue);
           }}
           sectionListRef={sectionListRef}
+          onScrollToIndexFailed={(info) => {
+            setTimeout(() => {
+              const scrollParams = getScrollParams(value, sections);
+              if (scrollParams.itemIndex < info.highestMeasuredFrameIndex) {
+                sectionListRef.current?.scrollToLocation(scrollParams);
+              }
+            }, 500);
+          }}
         />
       </BottomSheet>
     </>

package/src/theme/__tests__/__snapshots__/index.spec.ts.snap

@@ -258,7 +258,7 @@ Object {
         "paginatorBackgroundColor": "#401960",
       },
       "fontSizes": Object {
-        "heading": 36,
+        "heading": 32,
       },
       "fonts": Object {
         "heading": "RebondGrotesque-SemiBold",

package/src/theme/components/carousel.ts

@@ -25,7 +25,7 @@ const getCarouselTheme = (theme: GlobalTheme) => {
   };
 
   const fontSizes = {
-    heading: theme.fontSizes['6xlarge'],
+    heading: theme.fontSizes['xxxxxlarge'],
   };
 
   const fonts = {