@hero-design/rn 8.62.0 → 8.63.1

package/src/components/Alert/__tests__/index.spec.tsx

@@ -1,3 +1,4 @@
+import { fireEvent } from '@testing-library/react-native';
 import React from 'react';
 import Alert from '..';
 import renderWithTheme from '../../../testHelpers/renderWithTheme';
@@ -29,6 +30,23 @@ describe('Alert', () => {
     expect(getByTestId('alert-close-icon')).toBeDefined();
   });
 
+  it('renders correctly with CTA ', () => {
+    const onCloseSpy = jest.fn();
+    const { getByText } = renderWithTheme(
+      <Alert
+        title="Title"
+        content="Content"
+        actionLabel="CTA"
+        onClose={onCloseSpy}
+      />
+    );
+
+    expect(getByText('CTA')).toBeVisible();
+    fireEvent.press(getByText('CTA'));
+
+    expect(onCloseSpy).toHaveBeenCalledTimes(1);
+  });
+
   it('renders correctly without rounded ', () => {
     const { toJSON, getByTestId, getByText, queryByTestId } = renderWithTheme(
       <Alert title="Title" content="Content" variant="unrounded" />
@@ -122,3 +140,21 @@ describe('Alert', () => {
     });
   });
 });
+
+describe('AlertProps', () => {
+  it('raises type error if actionLabel has value but no close icon', () => {
+    // should raise error which requires onClose
+    renderWithTheme(
+      // @ts-expect-error: Type '{ title: string; content: string; actionLabel: string; }' i
+      <Alert title="Title" content="Content" actionLabel="VIEW" />
+    );
+
+    // if onClose is standalone, it's valid
+    renderWithTheme(
+      <Alert title="Title" content="Content" onClose={jest.fn()} />
+    );
+
+    // if onClose and actionLabel are undefined, it's valid
+    renderWithTheme(<Alert title="Title" content="Content" />);
+  });
+});

package/src/components/Alert/index.tsx

@@ -37,7 +37,7 @@ const AlertIcon = ({ icon }: { icon?: IconName }) =>
     </IconContainer>
   ) : null;
 
-interface AlertProps {
+interface BasicAlertProps {
   /**
    * Alert title.
    */
@@ -59,6 +59,7 @@ interface AlertProps {
   intent?: 'success' | 'info' | 'warning' | 'error' | 'notification';
   /**
    * Closing callback. When onClose is available, an X button will be rendered on the right side of alert. The callback will be called when user clicks on X button.
+   * - undefined: no action button.
    */
   onClose?: () => void;
   /**
@@ -73,8 +74,26 @@ interface AlertProps {
    * Testing id of the component.
    */
   testID?: string;
+  /**
+   * Action label at the right side of the alert.
+   * - undefined: a close icon.
+   */
+  actionLabel?: string;
 }
 
+type AlertProps =
+  | (BasicAlertProps & {
+      actionLabel?: undefined;
+    })
+  | (BasicAlertProps & {
+      onClose: () => void;
+      /**
+       * Action label at the right side of the alert.
+       * - undefined: a close icon.
+       */
+      actionLabel: string;
+    });
+
 const Alert = ({
   content,
   icon,
@@ -84,6 +103,7 @@ const Alert = ({
   variant = 'rounded',
   style,
   testID,
+  actionLabel,
 }: AlertProps): JSX.Element => {
   useDeprecation(
     `Alert's notification intent is deprecated and will be removed in the next major release. Please use other intents instead.`,
@@ -116,7 +136,13 @@ const Alert = ({
       </ContentContainer>
       {onClose ? (
         <CTAWrapper onPress={onClose} testID="alert-close-icon">
-          <Icon icon="cancel" size="small" />
+          {typeof actionLabel === 'string' ? (
+            <Typography.Body variant="small-bold">
+              {actionLabel}
+            </Typography.Body>
+          ) : (
+            <Icon icon="cancel" size="small" />
+          )}
         </CTAWrapper>
       ) : null}
     </Container>

package/src/components/AnimatedScroller/__tests__/__snapshots__/ScrollablesWithFAB.spec.tsx.snap

@@ -900,13 +900,6 @@ exports[`Scrollables With FAB [Function ExampleFlatListWithFAB] renders ActionGr
         </View>
       </View>
     </View>
-    <Modal
-      animationType="fade"
-      hardwareAccelerated={false}
-      statusBarTranslucent={true}
-      transparent={true}
-      visible={false}
-    />
   </View>
   <View
     pointerEvents="box-none"
@@ -2069,13 +2062,6 @@ exports[`Scrollables With FAB [Function ExampleScrollViewWithFAB] renders Action
         </View>
       </View>
     </View>
-    <Modal
-      animationType="fade"
-      hardwareAccelerated={false}
-      statusBarTranslucent={true}
-      transparent={true}
-      visible={false}
-    />
   </View>
   <View
     pointerEvents="box-none"
@@ -2885,13 +2871,6 @@ exports[`Scrollables With FAB [Function ExampleSectionListWithFAB] renders Actio
         </View>
       </View>
     </View>
-    <Modal
-      animationType="fade"
-      hardwareAccelerated={false}
-      statusBarTranslucent={true}
-      transparent={true}
-      visible={false}
-    />
   </View>
   <View
     pointerEvents="box-none"

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

@@ -8,12 +8,6 @@ exports[`BottomSheet renders correctly with BottomSheet.ScrollView 1`] = `
     }
   }
 >
-  <Modal
-    hardwareAccelerated={false}
-    onRequestClose={[MockFunction]}
-    transparent={true}
-    visible={false}
-  />
   <View
     pointerEvents="box-none"
     position="bottom"
@@ -45,12 +39,6 @@ exports[`BottomSheet renders correctly with close state 1`] = `
     }
   }
 >
-  <Modal
-    hardwareAccelerated={false}
-    onRequestClose={[MockFunction]}
-    transparent={true}
-    visible={false}
-  />
   <View
     pointerEvents="box-none"
     position="bottom"

package/src/components/DatePicker/__tests__/__snapshots__/DatePicker.spec.tsx.snap

@@ -538,12 +538,6 @@ exports[`DatePicker renders DatePickerIOS when OS is iOS 1`] = `
         </View>
       </View>
     </View>
-    <Modal
-      hardwareAccelerated={false}
-      onRequestClose={[Function]}
-      transparent={true}
-      visible={false}
-    />
   </View>
   <View
     pointerEvents="box-none"
@@ -825,12 +819,6 @@ exports[`DatePicker renders variant Calendar 1`] = `
         </View>
       </View>
     </View>
-    <Modal
-      hardwareAccelerated={false}
-      onRequestClose={[Function]}
-      transparent={true}
-      visible={false}
-    />
   </View>
   <View
     pointerEvents="box-none"

package/src/components/FAB/ActionGroup/__tests__/__snapshots__/index.spec.tsx.snap

@@ -158,13 +158,6 @@ exports[`ActionGroup has active false 1`] = `
         </View>
       </View>
     </View>
-    <Modal
-      animationType="fade"
-      hardwareAccelerated={false}
-      statusBarTranslucent={true}
-      transparent={true}
-      visible={false}
-    />
   </View>
   <View
     pointerEvents="box-none"

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,"bolt":59011,"bookmark-added":59012,"bookmark":59013,"box-check":59014,"box":59015,"bpay":59016,"buildings":59017,"cake":59018,"calendar-clock":59019,"calendar":59020,"candy-box-menu":59021,"caret-down-small":59022,"caret-down":59023,"caret-left-small":59024,"caret-left":59025,"caret-right-small":59026,"caret-right":59027,"caret-up-small":59028,"caret-up":59029,"check-radio":59030,"circle-add":59031,"circle-cancel":59032,"circle-check":59033,"circle-down":59034,"circle-info":59035,"circle-left":59036,"circle-ok":59037,"circle-pencil":59038,"circle-question":59039,"circle-remove":59040,"circle-right":59041,"circle-up":59042,"circle-warning":59043,"clock-3":59044,"clock":59045,"cloud-download":59046,"cloud-upload":59047,"cog":59048,"coin":59049,"contacts":59050,"credit-card":59051,"diamond":59052,"direction-arrows":59053,"directory":59054,"document":59055,"dollar-coin-shine":59056,"double-buildings":59057,"edit-template":59058,"envelope":59059,"exclude":59060,"expand-content":59061,"expense":59062,"explore_nearby":59063,"eye-circle":59064,"eye-invisible":59065,"eye":59066,"face-meh":59067,"face-sad":59068,"face-smiley":59069,"feed":59070,"feedbacks":59071,"file-certified":59072,"file-clone":59073,"file-copy":59074,"file-csv":59075,"file-dispose":59076,"file-doc":59077,"file-excel":59078,"file-export":59079,"file-lock":59080,"file-pdf":59081,"file-powerpoint":59082,"file-search":59083,"file-secured":59084,"file-sheets":59085,"file-slide":59086,"file-verified":59087,"file-word":59088,"file":59089,"filter":59090,"folder-user":59091,"folder":59092,"format-bold":59093,"format-heading1":59094,"format-heading2":59095,"format-italic":59096,"format-list-bulleted":59097,"format-list-numbered":59098,"format-underlined":59099,"funnel-filter":59100,"global-dollar":59101,"globe":59102,"graduation-cap":59103,"graph":59104,"happy-sun":59105,"health-bag":59106,"heart":59107,"hero-points":59108,"home":59109,"image":59110,"import":59111,"incident-siren":59112,"instapay-daily":59113,"instapay-now":59114,"instapay":59115,"list":59116,"loading-2":59117,"loading":59118,"location-on":59119,"location":59120,"lock":59121,"looks-one":59122,"looks-two":59123,"media-content":59124,"menu":59125,"money-notes":59126,"moneybag":59127,"moon":59128,"multiple-stars":59129,"multiple-users":59130,"near-me":59131,"node":59132,"open-folder":59133,"paperclip":59134,"payment-summary":59135,"pencil":59136,"phone":59137,"piggy-bank":59138,"plane-up":59139,"plane":59140,"play-circle":59141,"print":59142,"raising-hands":59143,"reply-arrow":59144,"reply":59145,"reschedule":59146,"rostering":59147,"salary-sacrifice":59148,"save":59149,"schedule-send":59150,"schedule":59151,"search-person":59152,"send":59153,"speaker-active":59154,"speaker":59155,"star-award":59156,"star-badge":59157,"star-circle":59158,"star-medal":59159,"star":59160,"steps-circle":59161,"stopwatch":59162,"suitcase":59163,"surfing":59164,"survey":59165,"swag-pillar-benefit":59166,"swag-pillar-career":59167,"swag-pillar-money":59168,"swag-pillar-work":59169,"swag":59170,"swipe-right":59171,"switch":59172,"tag":59173,"target":59174,"teams":59175,"timesheet":59176,"touch-id":59177,"trash-bin":59178,"unlock":59179,"user":59180,"video-1":59181,"video-2":59182,"wallet":59183,"warning":59184,"activate-outlined":59185,"add-credit-card-outlined":59186,"add-person-outlined":59187,"add-section-outlined":59188,"add-time-outlined":59189,"add":59190,"adjustment-outlined":59191,"ai-outlined":59192,"alignment-2-outlined":59193,"alignment-outlined":59194,"all-caps":59195,"application-outlined":59196,"arrow-down":59197,"arrow-downwards":59198,"arrow-left":59199,"arrow-leftwards":59200,"arrow-right":59201,"arrow-rightwards":59202,"arrow-up":59203,"arrow-upwards":59204,"article-outlined":59205,"at-sign":59206,"auto-graph-outlined":59207,"beer-outlined":59208,"bell-active-outlined":59209,"bell-outlined":59210,"bell-slash-outlined":59211,"bill-management-outlined":59212,"billing-outlined":59213,"body-outlined":59214,"bold":59215,"bolt-outlined":59216,"book-outlined":59217,"bookmark-added-outlined":59218,"bookmark-outlined":59219,"box-check-outlined":59220,"box-outlined":59221,"bullet-points":59222,"cake-outlined":59223,"calendar-dates-outlined":59224,"calendar-star-outlined":59225,"call-outlined":59226,"call-split-outlined":59227,"camera-outlined":59228,"cancel":59229,"car-forward-outlined":59230,"cashback-outlined":59231,"charging-station-outlined":59232,"chat-bubble-outlined":59233,"chat-unread-outlined":59234,"checkmark":59235,"circle-add-outlined":59236,"circle-cancel-outlined":59237,"circle-down-outlined":59238,"circle-info-outlined":59239,"circle-left-outlined":59240,"circle-ok-outlined":59241,"circle-question-outlined":59242,"circle-remove-outlined":59243,"circle-right-outlined":59244,"circle-up-outlined":59245,"circle-warning-outlined":59246,"clock-2-outlined":59247,"clock-outlined":59248,"cog-outlined":59249,"coin-outlined":59250,"coin-super-outlined":59251,"comment-outlined":59252,"contacts-outlined":59253,"contacts-user-outlined":59254,"credit-card-outlined":59255,"cup-outlined":59256,"dentistry-outlined":59257,"direction-arrows-outlined":59258,"directory-outlined":59259,"document-outlined":59260,"dollar-box-outlined":59261,"dollar-card-outlined":59262,"dollar-coin-shine-outlined":59263,"dollar-credit-card-outlined":59264,"dollar-sign":59265,"double-buildings-outlined":59266,"double-left-arrows":59267,"double-right-arrows":59268,"download-box-outlined":59269,"download-outlined":59270,"edit-template-outlined":59271,"email-outlined":59272,"enter-arrow":59273,"envelope-outlined":59274,"expense-approval-outlined":59275,"expense-outlined":59276,"explore-outlined":59277,"extension-outlined":59278,"external-link":59279,"eye-invisible-outlined":59280,"eye-outlined":59281,"face-id":59282,"face-meh-outlined":59283,"face-open-smiley-outlined":59284,"face-sad-outlined":59285,"face-smiley-outlined":59286,"fastfood-outlined":59287,"feed-outlined":59288,"file-certified-outlined":59289,"file-clone-outlined":59290,"file-copy-outlined":59291,"file-dispose-outlined":59292,"file-dollar-certified-outlined":59293,"file-dollar-outlined":59294,"file-download-outlined":59295,"file-export-outlined":59296,"file-lock-outlined":59297,"file-outlined":59298,"file-search-outlined":59299,"file-secured-outlined":59300,"file-statutory-outlined":59301,"file-verified-outlined":59302,"filter-outlined":59303,"folder-outlined":59304,"folder-user-outlined":59305,"form-outlined":59306,"funnel-filter-outline":59307,"goal-outlined":59308,"graph-outlined":59309,"hand-holding-user-outlined":59310,"happy-sun-outlined":59311,"health-bag-outlined":59312,"heart-outlined":59313,"home-active-outlined":59314,"home-outlined":59315,"id-card-outlined":59316,"image-outlined":59317,"import-outlined":59318,"instapay-outlined":59319,"italic":59320,"job-search-outlined":59321,"leave-approval-outlined":59322,"link-1":59323,"link-2":59324,"list-outlined":59325,"live-help-outlined":59326,"local_mall_outlined":59327,"location-on-outlined":59328,"location-outlined":59329,"lock-outlined":59330,"locked-file-outlined":59331,"log-out":59332,"mail-outlined":59333,"map-outlined":59334,"media-content-outlined":59335,"menu-close":59336,"menu-expand":59337,"menu-fold-outlined":59338,"menu-unfold-outlined":59339,"moneybag-outlined":59340,"moon-outlined":59341,"more-horizontal":59342,"more-vertical":59343,"multiple-folders-outlined":59344,"multiple-users-outlined":59345,"near-me-outlined":59346,"node-outlined":59347,"number-points":59348,"number":59349,"overview-outlined":59350,"payment-summary-outlined":59351,"payslip-outlined":59352,"pencil-outlined":59353,"percentage":59354,"phone-outlined":59355,"piggy-bank-outlined":59356,"plane-outlined":59357,"play-circle-outlined":59358,"print-outlined":59359,"propane-tank-outlined":59360,"qr-code-outlined":59361,"qualification-outlined":59362,"re-assign":59363,"redeem":59364,"refresh":59365,"remove":59366,"reply-outlined":59367,"restart":59368,"resume-outlined":59369,"return-arrow":59370,"rostering-outlined":59371,"safety-outlined":59372,"save-outlined":59373,"schedule-outlined":59374,"search-outlined":59375,"search-secured-outlined":59376,"send-outlined":59377,"share-1":59378,"share-2":59379,"share-outlined-2":59380,"share-outlined":59381,"shopping_basket_outlined":59382,"show-chart-outlined":59383,"single-down-arrow":59384,"single-left-arrow":59385,"single-right-arrow":59386,"single-up-arrow":59387,"smart-match-outlined":59388,"sparkle-outlined":59389,"speaker-active-outlined":59390,"speaker-outlined":59391,"star-circle-outlined":59392,"star-outlined":59393,"stash-outlined":59394,"stopwatch-outlined":59395,"strikethrough":59396,"styler-outlined":59397,"suitcase-clock-outlined":59398,"suitcase-outlined":59399,"survey-outlined":59400,"switch-outlined":59401,"sync":59402,"tag-outlined":59403,"target-outlined":59404,"tennis-outlined":59405,"ticket-outlined":59406,"timesheet-outlined":59407,"timesheets-outlined":59408,"today-outlined":59409,"transfer":59410,"trash-bin-outlined":59411,"umbrela-outlined":59412,"unavailability-outlined":59413,"unavailable":59414,"underline":59415,"union-outlined":59416,"unlock-outlined":59417,"upload-outlined":59418,"user-circle-outlined":59419,"user-gear-outlined":59420,"user-outlined":59421,"user-rectangle-outlined":59422,"video-1-outlined":59423,"video-2-outlined":59424,"volunteer-outlined":59425,"wallet-outlined":59426,"wellness-outlined":59427}
+{"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,"bolt":59011,"bookmark-added":59012,"bookmark":59013,"box-check":59014,"box":59015,"bpay":59016,"buildings":59017,"cake":59018,"calendar-clock":59019,"calendar":59020,"candy-box-menu":59021,"caret-down-small":59022,"caret-down":59023,"caret-left-small":59024,"caret-left":59025,"caret-right-small":59026,"caret-right":59027,"caret-up-small":59028,"caret-up":59029,"check-radio":59030,"circle-add":59031,"circle-cancel":59032,"circle-check":59033,"circle-down":59034,"circle-info":59035,"circle-left":59036,"circle-ok":59037,"circle-pencil":59038,"circle-question":59039,"circle-remove":59040,"circle-right":59041,"circle-up":59042,"circle-warning":59043,"clock-3":59044,"clock":59045,"cloud-download":59046,"cloud-upload":59047,"cog":59048,"coin":59049,"contacts":59050,"credit-card":59051,"diamond":59052,"direction-arrows":59053,"directory":59054,"document":59055,"dollar-coin-shine":59056,"double-buildings":59057,"edit-template":59058,"envelope":59059,"exclude":59060,"expand-content":59061,"expense":59062,"explore_nearby":59063,"eye-circle":59064,"eye-invisible":59065,"eye":59066,"face-meh":59067,"face-sad":59068,"face-smiley":59069,"feed":59070,"feedbacks":59071,"file-certified":59072,"file-clone":59073,"file-copy":59074,"file-csv":59075,"file-dispose":59076,"file-doc":59077,"file-excel":59078,"file-export":59079,"file-lock":59080,"file-pdf":59081,"file-powerpoint":59082,"file-search":59083,"file-secured":59084,"file-sheets":59085,"file-slide":59086,"file-verified":59087,"file-word":59088,"file":59089,"filter":59090,"folder-user":59091,"folder":59092,"format-bold":59093,"format-heading1":59094,"format-heading2":59095,"format-italic":59096,"format-list-bulleted":59097,"format-list-numbered":59098,"format-underlined":59099,"funnel-filter":59100,"global-dollar":59101,"globe":59102,"graduation-cap":59103,"graph":59104,"happy-sun":59105,"health-bag":59106,"heart":59107,"hero-points":59108,"home":59109,"image":59110,"import":59111,"incident-siren":59112,"instapay-daily":59113,"instapay-now":59114,"instapay":59115,"list":59116,"loading-2":59117,"loading":59118,"location-on":59119,"location":59120,"lock":59121,"looks-one":59122,"looks-two":59123,"media-content":59124,"menu":59125,"money-notes":59126,"moneybag":59127,"moon":59128,"multiple-stars":59129,"multiple-users":59130,"near-me":59131,"node":59132,"open-folder":59133,"paperclip":59134,"payment-summary":59135,"pencil":59136,"phone":59137,"piggy-bank":59138,"plane-up":59139,"plane":59140,"play-circle":59141,"print":59142,"raising-hands":59143,"reply-arrow":59144,"reply":59145,"reschedule":59146,"rostering":59147,"salary-sacrifice":59148,"save":59149,"schedule-send":59150,"schedule":59151,"search-person":59152,"send":59153,"speaker-active":59154,"speaker":59155,"star-award":59156,"star-badge":59157,"star-circle":59158,"star-medal":59159,"star":59160,"steps-circle":59161,"stopwatch":59162,"suitcase":59163,"surfing":59164,"survey":59165,"swag-pillar-benefit":59166,"swag-pillar-career":59167,"swag-pillar-money":59168,"swag-pillar-work":59169,"swag":59170,"swipe-right":59171,"switch":59172,"tag":59173,"target":59174,"teams":59175,"timesheet":59176,"touch-id":59177,"trash-bin":59178,"unlock":59179,"user":59180,"video-1":59181,"video-2":59182,"wallet":59183,"warning":59184,"activate-outlined":59185,"add-credit-card-outlined":59186,"add-person-outlined":59187,"add-section-outlined":59188,"add-time-outlined":59189,"add":59190,"adjustment-outlined":59191,"ai-outlined":59192,"alignment-2-outlined":59193,"alignment-outlined":59194,"all-caps":59195,"application-outlined":59196,"arrow-down":59197,"arrow-downwards":59198,"arrow-left":59199,"arrow-leftwards":59200,"arrow-right":59201,"arrow-rightwards":59202,"arrow-up":59203,"arrow-upwards":59204,"article-outlined":59205,"at-sign":59206,"auto-graph-outlined":59207,"beer-outlined":59208,"bell-active-outlined":59209,"bell-outlined":59210,"bell-slash-outlined":59211,"bill-management-outlined":59212,"billing-outlined":59213,"body-outlined":59214,"bold":59215,"bolt-outlined":59216,"book-outlined":59217,"bookmark-added-outlined":59218,"bookmark-outlined":59219,"box-check-outlined":59220,"box-outlined":59221,"bullet-points":59222,"cake-outlined":59223,"calendar-dates-outlined":59224,"calendar-star-outlined":59225,"call-outlined":59226,"call-split-outlined":59227,"camera-outlined":59228,"cancel":59229,"car-forward-outlined":59230,"cashback-outlined":59231,"charging-station-outlined":59232,"chat-bubble-outlined":59233,"chat-unread-outlined":59234,"checkmark":59235,"circle-add-outlined":59236,"circle-cancel-outlined":59237,"circle-down-outlined":59238,"circle-info-outlined":59239,"circle-left-outlined":59240,"circle-ok-outlined":59241,"circle-question-outlined":59242,"circle-remove-outlined":59243,"circle-right-outlined":59244,"circle-up-outlined":59245,"circle-warning-outlined":59246,"clock-2-outlined":59247,"clock-in-outlined":59248,"clock-out-outlined":59249,"clock-outlined":59250,"cog-outlined":59251,"coin-outlined":59252,"coin-super-outlined":59253,"comment-outlined":59254,"contacts-outlined":59255,"contacts-user-outlined":59256,"credit-card-outlined":59257,"cup-outlined":59258,"dentistry-outlined":59259,"direction-arrows-outlined":59260,"directory-outlined":59261,"document-outlined":59262,"dollar-box-outlined":59263,"dollar-card-outlined":59264,"dollar-coin-shine-outlined":59265,"dollar-credit-card-outlined":59266,"dollar-sign":59267,"double-buildings-outlined":59268,"double-left-arrows":59269,"double-right-arrows":59270,"download-box-outlined":59271,"download-outlined":59272,"edit-template-outlined":59273,"email-outlined":59274,"end-break-outlined":59275,"enter-arrow":59276,"envelope-outlined":59277,"expense-approval-outlined":59278,"expense-outlined":59279,"explore-outlined":59280,"extension-outlined":59281,"external-link":59282,"eye-invisible-outlined":59283,"eye-outlined":59284,"face-id":59285,"face-meh-outlined":59286,"face-open-smiley-outlined":59287,"face-sad-outlined":59288,"face-smiley-outlined":59289,"fastfood-outlined":59290,"feed-outlined":59291,"file-certified-outlined":59292,"file-clone-outlined":59293,"file-copy-outlined":59294,"file-dispose-outlined":59295,"file-dollar-certified-outlined":59296,"file-dollar-outlined":59297,"file-download-outlined":59298,"file-export-outlined":59299,"file-lock-outlined":59300,"file-outlined":59301,"file-search-outlined":59302,"file-secured-outlined":59303,"file-statutory-outlined":59304,"file-verified-outlined":59305,"filter-outlined":59306,"folder-outlined":59307,"folder-user-outlined":59308,"form-outlined":59309,"funnel-filter-outline":59310,"goal-outlined":59311,"graph-outlined":59312,"hand-holding-user-outlined":59313,"happy-sun-outlined":59314,"health-bag-outlined":59315,"heart-outlined":59316,"home-active-outlined":59317,"home-outlined":59318,"id-card-outlined":59319,"image-outlined":59320,"import-outlined":59321,"instapay-outlined":59322,"italic":59323,"job-search-outlined":59324,"leave-approval-outlined":59325,"link-1":59326,"link-2":59327,"list-outlined":59328,"live-help-outlined":59329,"local_mall_outlined":59330,"location-on-outlined":59331,"location-outlined":59332,"lock-outlined":59333,"locked-file-outlined":59334,"log-out":59335,"mail-outlined":59336,"map-outlined":59337,"media-content-outlined":59338,"menu-close":59339,"menu-expand":59340,"menu-fold-outlined":59341,"menu-unfold-outlined":59342,"moneybag-outlined":59343,"moon-outlined":59344,"more-horizontal":59345,"more-vertical":59346,"multiple-folders-outlined":59347,"multiple-users-outlined":59348,"near-me-outlined":59349,"node-outlined":59350,"number-points":59351,"number":59352,"overview-outlined":59353,"payment-summary-outlined":59354,"payslip-outlined":59355,"pencil-outlined":59356,"percentage":59357,"phone-outlined":59358,"piggy-bank-outlined":59359,"plane-outlined":59360,"play-circle-outlined":59361,"print-outlined":59362,"propane-tank-outlined":59363,"qr-code-outlined":59364,"qualification-outlined":59365,"re-assign":59366,"redeem":59367,"refresh":59368,"remove":59369,"reply-outlined":59370,"restart":59371,"resume-outlined":59372,"return-arrow":59373,"rostering-outlined":59374,"safety-outlined":59375,"save-outlined":59376,"schedule-outlined":59377,"search-outlined":59378,"search-secured-outlined":59379,"send-outlined":59380,"share-1":59381,"share-2":59382,"share-outlined-2":59383,"share-outlined":59384,"shopping_basket_outlined":59385,"show-chart-outlined":59386,"single-down-arrow":59387,"single-left-arrow":59388,"single-right-arrow":59389,"single-up-arrow":59390,"smart-match-outlined":59391,"sparkle-outlined":59392,"speaker-active-outlined":59393,"speaker-outlined":59394,"star-circle-outlined":59395,"star-outlined":59396,"start-break-outlined":59397,"stash-outlined":59398,"stopwatch-outlined":59399,"strikethrough":59400,"styler-outlined":59401,"suitcase-clock-outlined":59402,"suitcase-outlined":59403,"survey-outlined":59404,"switch-outlined":59405,"sync":59406,"tag-outlined":59407,"target-outlined":59408,"tennis-outlined":59409,"ticket-outlined":59410,"timesheet-outlined":59411,"timesheets-outlined":59412,"today-outlined":59413,"transfer":59414,"trash-bin-outlined":59415,"umbrela-outlined":59416,"unavailability-outlined":59417,"unavailable":59418,"underline":59419,"union-outlined":59420,"unlock-outlined":59421,"upload-outlined":59422,"user-circle-outlined":59423,"user-gear-outlined":59424,"user-outlined":59425,"user-rectangle-outlined":59426,"video-1-outlined":59427,"video-2-outlined":59428,"volunteer-outlined":59429,"wallet-outlined":59430,"wellness-outlined":59431}

package/src/components/Icon/IconList.ts

@@ -248,6 +248,8 @@ const IconList = [
   'circle-up-outlined',
   'circle-warning-outlined',
   'clock-2-outlined',
+  'clock-in-outlined',
+  'clock-out-outlined',
   'clock-outlined',
   'cog-outlined',
   'coin-outlined',
@@ -273,6 +275,7 @@ const IconList = [
   'download-outlined',
   'edit-template-outlined',
   'email-outlined',
+  'end-break-outlined',
   'enter-arrow',
   'envelope-outlined',
   'expense-approval-outlined',
@@ -394,6 +397,7 @@ const IconList = [
   'speaker-outlined',
   'star-circle-outlined',
   'star-outlined',
+  'start-break-outlined',
   'stash-outlined',
   'stopwatch-outlined',
   'strikethrough',

package/src/components/RichTextEditor/__tests__/__snapshots__/MentionList.spec.tsx.snap

@@ -31,7 +31,7 @@ exports[`MentionList when search string is not empty should render mention list
       onScrollEndDrag={[Function]}
       removeClippedSubviews={false}
       renderItem={[Function]}
-      scrollEventThrottle={50}
+      scrollEventThrottle={0.0001}
       stickyHeaderIndices={[]}
       viewabilityConfigCallbackPairs={[]}
     >

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

@@ -61,7 +61,7 @@ exports[`OptionList render isLoading correctly 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,
@@ -935,7 +935,7 @@ exports[`OptionList renders correctly 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,
@@ -1656,7 +1656,7 @@ exports[`OptionList trigger onPress correctly on changing selection 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,
@@ -2405,7 +2405,7 @@ exports[`OptionList trigger onPress correctly on select additional value 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,

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

@@ -533,7 +533,7 @@ exports[`rendering allows custom renderer 1`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,
@@ -1795,12 +1795,6 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
       </View>
     </View>
   </View>
-  <Modal
-    hardwareAccelerated={false}
-    onRequestClose={[Function]}
-    transparent={true}
-    visible={false}
-  />
   <View
     pointerEvents="box-none"
     position="bottom"
@@ -2361,7 +2355,7 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,
@@ -3838,12 +3832,6 @@ exports[`rendering renders correctly when input is loading 1`] = `
       </View>
     </View>
   </View>
-  <Modal
-    hardwareAccelerated={false}
-    onRequestClose={[Function]}
-    transparent={true}
-    visible={false}
-  />
   <View
     pointerEvents="box-none"
     position="bottom"
@@ -4392,7 +4380,7 @@ exports[`rendering renders correctly when receives sections 1`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,
@@ -5710,7 +5698,7 @@ exports[`rendering renders correctly when receives sections 2`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,

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

@@ -61,7 +61,7 @@ exports[`OptionList render isLoading correctly 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,
@@ -912,7 +912,7 @@ exports[`OptionList renders correctly 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,
@@ -1610,7 +1610,7 @@ exports[`OptionList trigger onPress correctly on select new value 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,
@@ -2308,7 +2308,7 @@ exports[`OptionList trigger onPress correctly on unselect current value 1`] = `
     onScrollBeginDrag={[Function]}
     onScrollEndDrag={[Function]}
     renderItem={[Function]}
-    scrollEventThrottle={50}
+    scrollEventThrottle={0.0001}
     stickyHeaderIndices={
       [
         0,

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

@@ -532,7 +532,7 @@ exports[`rendering allows custom renderer 1`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,
@@ -1710,12 +1710,6 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
       </View>
     </View>
   </View>
-  <Modal
-    hardwareAccelerated={false}
-    onRequestClose={[Function]}
-    transparent={true}
-    visible={false}
-  />
   <View
     pointerEvents="box-none"
     position="bottom"
@@ -2276,7 +2270,7 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,
@@ -3613,12 +3607,6 @@ exports[`rendering renders correctly when input is loading 1`] = `
       </View>
     </View>
   </View>
-  <Modal
-    hardwareAccelerated={false}
-    onRequestClose={[Function]}
-    transparent={true}
-    visible={false}
-  />
   <View
     pointerEvents="box-none"
     position="bottom"
@@ -4167,7 +4155,7 @@ exports[`rendering renders correctly when receives sections 1`] = `
             onScrollEndDrag={[Function]}
             onScrollToIndexFailed={[Function]}
             renderItem={[Function]}
-            scrollEventThrottle={50}
+            scrollEventThrottle={0.0001}
             stickyHeaderIndices={
               [
                 0,

package/src/components/Tabs/ScrollableTabs.tsx

@@ -1,7 +1,7 @@
 import React, { useRef } from 'react';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import PagerView from 'react-native-pager-view';
-import { TabContainer, ContentWrapper } from './StyledScrollableTabs';
+import { TabContainer } from './StyledScrollableTabs';
 import type { TabsProps } from '.';
 import SceneView from './SceneView';
 import ScrollableTabHeader from './ScrollableTabsHeader/ScrollableTabsHeader';
@@ -68,7 +68,8 @@ const ScrollableTab = ({
           testID={componentTestID ? `${componentTestID}-tab-bar` : undefined}
           variant={variant}
         />
-        <ContentWrapper
+        <PagerView
+          useNext
           initialPage={selectedTabIndex}
           ref={pagerViewRef}
           onPageScrollStateChanged={(e) => {
@@ -89,6 +90,7 @@ const ScrollableTab = ({
             }
           }}
           scrollEnabled={swipeEnabled}
+          style={{ flex: 1 }}
         >
           {tabs.map((tab, index) => {
             const { key, component, testID } = tab;
@@ -107,7 +109,7 @@ const ScrollableTab = ({
               </ScreenContext.Provider>
             );
           })}
-        </ContentWrapper>
+        </PagerView>
       </TabContainer>
     </TabContext.Provider>
   );

package/src/components/Tabs/StyledScrollableTabs.tsx

@@ -1,6 +1,5 @@
 import { Animated, StyleSheet, View } from 'react-native';
 import styled from '@emotion/native';
-import PagerView from 'react-native-pager-view';
 
 const TabScreen = styled(View)({
   flex: 1,
@@ -11,10 +10,6 @@ const TabContainer = styled(View)({
   overflow: 'hidden',
 });
 
-const ContentWrapper = styled(PagerView)({
-  flex: 1,
-});
-
 const HeaderTabWrapper = styled(View)<{
   themeInsets: { top: number; right: number; bottom: number; left: number };
 }>(({ themeInsets }) => ({
@@ -64,7 +59,6 @@ export {
   TabScreen,
   TabContainer,
   HeaderTabWrapper,
-  ContentWrapper,
   HeaderTabItemOutlineWrapper,
   HeaderTabItemOutline,
   HeaderTabItemWrapper,

package/src/components/Tabs/StyledTabs.tsx

@@ -1,8 +1,5 @@
 import styled from '@emotion/native';
 import { Animated, View } from 'react-native';
-import PagerView from 'react-native-pager-view';
-
-const AnimatedPagerView = Animated.createAnimatedComponent(PagerView);
 
 const TabContainer = styled(View)({
   flex: 1,
@@ -27,10 +24,6 @@ const HeaderTabItem = styled(View)(({ theme }) => ({
   paddingVertical: theme.__hd__.tabs.space.itemVerticalPadding,
 }));
 
-const ContentWrapper = styled(AnimatedPagerView)({
-  flex: 1,
-});
-
 const TabScreen = styled(View)({
   flex: 1,
 });
@@ -55,7 +48,6 @@ export {
   HeaderTabWrapper,
   HeaderTab,
   HeaderTabItem,
-  ContentWrapper,
   TabScreen,
   StyledIndicator,
   StyledBadgeWrapper,