@hero-design/rn 8.9.1 → 8.11.0

package/lib/index.js

@@ -1855,6 +1855,36 @@ var getCarouselTheme = function getCarouselTheme(theme) {
   };
 };
 
+var getCardCarouselTheme = function getCardCarouselTheme(theme) {
+  var space = {
+    pageControlMarginTop: theme.space.medium,
+    carouselItemSpacing: theme.space.small,
+    contentContainerPaddingHorizontal: theme.space.large
+  };
+  var colors = {
+    shadow: theme.colors.primaryOutline,
+    carouselItemBackground: theme.colors.defaultSurface
+  };
+  var shadows = {
+    offset: {
+      width: 0,
+      height: 2
+    },
+    opacity: 0.12,
+    radius: theme.radii.medium,
+    elevation: 4
+  };
+  var radii = {
+    card: theme.radii.medium
+  };
+  return {
+    shadows: shadows,
+    colors: colors,
+    space: space,
+    radii: radii
+  };
+};
+
 var getCheckboxTheme = function getCheckboxTheme(theme) {
   var colors = {
     "default": theme.colors.primaryOutline,
@@ -2580,7 +2610,8 @@ var getTextInputTheme = function getTextInputTheme(theme) {
     errorMarginLeft: theme.space.xsmall,
     maxLengthLabelMarginLeft: theme.space.xsmall,
     errorAndHelpTextContainerPaddingLeft: theme.space.medium,
-    containerMarginTop: theme.space.small
+    containerMarginTop: theme.space.small,
+    labelInsideTextInputMarginTop: -theme.space.xxsmall
   };
   var fontSizes = {
     text: theme.fontSizes.medium,
@@ -2589,10 +2620,6 @@ var getTextInputTheme = function getTextInputTheme(theme) {
     maxLength: theme.fontSizes.small,
     asteriskLabel: theme.fontSizes.medium
   };
-  var lineHeights = {
-    text: theme.lineHeights.xsmall,
-    labelInsideTextInput: theme.lineHeights.xsmall
-  };
   var borderWidths = {
     container: {
       normal: theme.borderWidths.base,
@@ -2611,7 +2638,6 @@ var getTextInputTheme = function getTextInputTheme(theme) {
     fontSizes: fontSizes,
     borderWidths: borderWidths,
     radii: radii,
-    lineHeights: lineHeights,
     sizes: sizes
   };
 };
@@ -2758,6 +2784,7 @@ var getTheme$1 = function getTheme() {
       calendar: getCalendarTheme(globalTheme),
       card: getCardTheme(globalTheme),
       carousel: getCarouselTheme(globalTheme),
+      cardCarousel: getCardCarouselTheme(globalTheme),
       checkbox: getCheckboxTheme(globalTheme),
       contentNavigator: getContentNavigatorTheme(globalTheme),
       datePicker: getDatePickerTheme(globalTheme),
@@ -5653,7 +5680,7 @@ var index$a = components.reduce(function (acc, comp) {
   });
 }, styled);
 
-var StyledWrapper$b = index$a(reactNative.Animated.View)(function () {
+var StyledWrapper$c = index$a(reactNative.Animated.View)(function () {
   return {
     margin: 0,
     padding: 0,
@@ -5727,7 +5754,7 @@ var Collapse = function Collapse(_ref) {
     var height = _ref2.height;
     setContentHeight(height);
   }, []);
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$b, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$c, {
     style: {
       height: collapseAnim
     },
@@ -5740,10 +5767,10 @@ var Collapse = function Collapse(_ref) {
   }, children)));
 };
 
-var StyledWrapper$a = index$a(reactNative.View)(function () {
+var StyledWrapper$b = index$a(reactNative.View)(function () {
   return {};
 });
-var StyledItemWrapper = index$a(reactNative.View)(function (_ref) {
+var StyledItemWrapper$1 = index$a(reactNative.View)(function (_ref) {
   var theme = _ref.theme,
     themeVariant = _ref.themeVariant;
   return {
@@ -5818,7 +5845,7 @@ var Typography = {
 };
 
 // 🔴 DO NOT EDIT — This file is generated automatically.
-var IconList = ['activate', 'add-emoji', 'add-person', 'adjustment', 'alignment', 'antenna', 'archive', 'assignment-warning', 'bank', 'bell', 'billing', 'bookmark-added', 'bookmark', 'box-check', 'box', 'bpay', 'buildings', 'cake', 'calendar-clock', 'calendar', 'candy-box-menu', 'caret-down-small', 'caret-down', 'caret-left-small', 'caret-left', 'caret-right-small', 'caret-right', 'caret-up-small', 'caret-up', 'check-radio', 'circle-add', 'circle-cancel', 'circle-check', 'circle-down', 'circle-info', 'circle-left', 'circle-ok', 'circle-pencil', 'circle-question', 'circle-remove', 'circle-right', 'circle-up', 'circle-warning', 'clock-3', 'clock', 'cloud-download', 'cloud-upload', 'cog', 'coin', 'contacts', 'credit-card', 'diamond', 'direction-arrows', 'directory', 'document', 'dollar-coin-shine', 'double-buildings', 'edit-template', 'envelope', 'exclude', 'expense', 'eye-circle', 'eye-invisible', 'eye', 'face-meh', 'face-sad', 'face-smiley', 'feed', 'feedbacks', 'file-certified', 'file-clone', 'file-copy', 'file-csv', 'file-dispose', 'file-doc', 'file-excel', 'file-export', 'file-lock', 'file-pdf', 'file-powerpoint', 'file-search', 'file-secured', 'file-sheets', 'file-slide', 'file-verified', 'file-word', 'file', 'filter', 'folder-user', 'folder', 'format-bold', 'format-heading1', 'format-heading2', 'format-italic', 'format-list-bulleted', 'format-list-numbered', 'format-underlined', 'funnel-filter', 'global-dollar', 'globe', 'graduation-cap', 'graph', 'happy-sun', 'health-bag', 'heart', 'home', 'image', 'import', 'incident-siren', 'instapay', 'list', 'loading-2', 'loading', 'location', 'lock', 'looks-one', 'looks-two', 'media-content', 'menu', 'money-notes', 'moneybag', 'moon', 'multiple-stars', 'multiple-users', 'node', 'open-folder', 'paperclip', 'payment-summary', 'pencil', 'phone', 'piggy-bank', 'plane', 'play-circle', 'print', 'raising-hands', 'reply-arrow', 'reply', 'reschedule', 'rostering', 'save', 'schedule-send', 'schedule', 'search-person', 'send', 'speaker-active', 'speaker', 'star-award', 'star-badge', 'star-circle', 'star-medal', 'star', 'steps-circle', 'stopwatch', 'suitcase', 'survey', 'swag', 'switch', 'tag', 'target', 'teams', 'timesheet', 'touch-id', 'trash-bin', 'unlock', 'user', 'video-1', 'video-2', 'wallet', 'warning', 'activate-outlined', 'add-credit-card-outlined', 'add-person-outlined', 'add-section-outlined', 'add-time-outlined', 'add', 'adjustment-outlined', 'alignment-2-outlined', 'alignment-outlined', 'all-caps', 'arrow-down', 'arrow-downwards', 'arrow-left', 'arrow-leftwards', 'arrow-right', 'arrow-rightwards', 'arrow-up', 'arrow-upwards', 'article-outlined', 'at-sign', 'auto-graph-outlined', 'bell-active-outlined', 'bell-outlined', 'bell-slash-outlined', 'billing-outlined', 'body-outlined', 'bold', 'bookmark-added-outlined', 'bookmark-outlined', 'box-check-outlined', 'box-outlined', 'bullet-points', 'cake-outlined', 'calendar-dates-outlined', 'calendar-star-outlined', 'call-split-outlined', 'camera-outlined', 'cancel', 'charging-station-outlined', 'chat-bubble-outlined', 'chat-unread-outlined', 'checkmark', 'circle-add-outlined', 'circle-cancel-outlined', 'circle-down-outlined', 'circle-info-outlined', 'circle-left-outlined', 'circle-ok-outlined', 'circle-question-outlined', 'circle-remove-outlined', 'circle-right-outlined', 'circle-up-outlined', 'circle-warning-outlined', 'clock-2-outlined', 'clock-outlined', 'cog-outlined', 'coin-outlined', 'comment-outlined', 'contacts-outlined', 'contacts-user-outlined', 'credit-card-outlined', 'cup-outlined', 'direction-arrows-outlined', 'directory-outlined', 'document-outlined', 'dollar-box-outlined', 'dollar-card-outlined', 'dollar-coin-shine-outlined', 'dollar-credit-card-outlined', 'dollar-sign', 'double-buildings-outlined', 'double-left-arrows', 'double-right-arrows', 'download-outlined', 'edit-template-outlined', 'email-outlined', 'enter-arrow', 'envelope-outlined', 'expense-outlined', 'explore-outlined', 'external-link', 'eye-invisible-outlined', 'eye-outlined', 'face-id', 'face-meh-outlined', 'face-open-smiley-outlined', 'face-sad-outlined', 'face-smiley-outlined', 'feed-outlined', 'file-certified-outlined', 'file-clone-outlined', 'file-copy-outlined', 'file-dispose-outlined', 'file-dollar-certified-outlined', 'file-dollar-outlined', 'file-download-outlined', 'file-export-outlined', 'file-lock-outlined', 'file-outlined', 'file-search-outlined', 'file-secured-outlined', 'file-statutory-outlined', 'file-verified-outlined', 'filter-outlined', 'folder-outlined', 'folder-user-outlined', 'funnel-filter-outline', 'graph-outlined', 'hand-holding-user-outlined', 'happy-sun-outlined', 'health-bag-outlined', 'heart-outlined', 'home-active-outlined', 'home-outlined', 'id-card-outlined', 'image-outlined', 'import-outlined', 'instapay-outlined', 'italic', 'link-1', 'link-2', 'list-outlined', 'live-help-outlined', 'location-on-outlined', 'location-outlined', 'lock-outlined', 'locked-file-outlined', 'log-out', 'media-content-outlined', 'menu-close', 'menu-expand', 'menu-fold-outlined', 'menu-unfold-outlined', 'moneybag-outlined', 'moon-outlined', 'more-horizontal', 'more-vertical', 'multiple-folders-outlined', 'multiple-users-outlined', 'near-me-outlined', 'node-outlined', 'number-points', 'number', 'overview-outlined', 'payment-summary-outlined', 'payslip-outlined', 'pencil-outlined', 'percentage', 'phone-outlined', 'piggy-bank-outlined', 'plane-outlined', 'play-circle-outlined', 'print-outlined', 'qr-code-outlined', 'qualification-outlined', 're-assign', 'redeem', 'refresh', 'remove', 'reply-outlined', 'restart', 'return-arrow', 'rostering-outlined', 'save-outlined', 'schedule-outlined', 'search-outlined', 'search-secured-outlined', 'send-outlined', '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', 'suitcase-clock-outlined', 'suitcase-outlined', 'survey-outlined', 'switch-outlined', 'sync', 'target-outlined', 'timesheet-outlined', 'today-outlined', 'transfer', 'trash-bin-outlined', 'umbrela-outlined', 'unavailable', 'underline', 'union-outlined', 'unlock-outlined', 'upload-outlined', 'user-circle-outlined', 'user-gear-outlined', 'user-outlined', 'user-rectangle-outlined', 'video-1-outlined', 'video-2-outlined', 'wallet-outlined'];
+var IconList = ['activate', 'add-emoji', 'add-person', 'adjustment', 'alignment', 'antenna', 'archive', 'assignment-warning', 'bank', 'bell', 'billing', 'bookmark-added', 'bookmark', 'box-check', 'box', 'bpay', 'buildings', 'cake', 'calendar-clock', 'calendar', 'candy-box-menu', 'caret-down-small', 'caret-down', 'caret-left-small', 'caret-left', 'caret-right-small', 'caret-right', 'caret-up-small', 'caret-up', 'check-radio', 'circle-add', 'circle-cancel', 'circle-check', 'circle-down', 'circle-info', 'circle-left', 'circle-ok', 'circle-pencil', 'circle-question', 'circle-remove', 'circle-right', 'circle-up', 'circle-warning', 'clock-3', 'clock', 'cloud-download', 'cloud-upload', 'cog', 'coin', 'contacts', 'credit-card', 'diamond', 'direction-arrows', 'directory', 'document', 'dollar-coin-shine', 'double-buildings', 'edit-template', 'envelope', 'exclude', 'expense', 'eye-circle', 'eye-invisible', 'eye', 'face-meh', 'face-sad', 'face-smiley', 'feed', 'feedbacks', 'file-certified', 'file-clone', 'file-copy', 'file-csv', 'file-dispose', 'file-doc', 'file-excel', 'file-export', 'file-lock', 'file-pdf', 'file-powerpoint', 'file-search', 'file-secured', 'file-sheets', 'file-slide', 'file-verified', 'file-word', 'file', 'filter', 'folder-user', 'folder', 'format-bold', 'format-heading1', 'format-heading2', 'format-italic', 'format-list-bulleted', 'format-list-numbered', 'format-underlined', 'funnel-filter', 'global-dollar', 'globe', 'graduation-cap', 'graph', 'happy-sun', 'health-bag', 'heart', 'home', 'image', 'import', 'incident-siren', 'instapay', 'list', 'loading-2', 'loading', 'location', 'lock', 'looks-one', 'looks-two', 'media-content', 'menu', 'money-notes', 'moneybag', 'moon', 'multiple-stars', 'multiple-users', 'node', 'open-folder', 'paperclip', 'payment-summary', 'pencil', 'phone', 'piggy-bank', 'plane-up', 'plane', 'play-circle', 'print', 'raising-hands', 'reply-arrow', 'reply', 'reschedule', 'rostering', 'save', 'schedule-send', 'schedule', 'search-person', 'send', 'speaker-active', 'speaker', 'star-award', 'star-badge', 'star-circle', 'star-medal', 'star', 'steps-circle', 'stopwatch', 'suitcase', 'survey', 'swag-pillar-benefit', 'swag-pillar-career', 'swag-pillar-money', 'swag-pillar-work', 'swag', 'switch', 'tag', 'target', 'teams', 'timesheet', 'touch-id', 'trash-bin', 'unlock', 'user', 'video-1', 'video-2', 'wallet', 'warning', 'activate-outlined', 'add-credit-card-outlined', 'add-person-outlined', 'add-section-outlined', 'add-time-outlined', 'add', 'adjustment-outlined', 'alignment-2-outlined', 'alignment-outlined', 'all-caps', 'arrow-down', 'arrow-downwards', 'arrow-left', 'arrow-leftwards', 'arrow-right', 'arrow-rightwards', 'arrow-up', 'arrow-upwards', 'article-outlined', 'at-sign', 'auto-graph-outlined', 'bell-active-outlined', 'bell-outlined', 'bell-slash-outlined', 'billing-outlined', 'body-outlined', 'bold', 'bookmark-added-outlined', 'bookmark-outlined', 'box-check-outlined', 'box-outlined', 'bullet-points', 'cake-outlined', 'calendar-dates-outlined', 'calendar-star-outlined', 'call-split-outlined', 'camera-outlined', 'cancel', 'car-forward-outlined', 'charging-station-outlined', 'chat-bubble-outlined', 'chat-unread-outlined', 'checkmark', 'circle-add-outlined', 'circle-cancel-outlined', 'circle-down-outlined', 'circle-info-outlined', 'circle-left-outlined', 'circle-ok-outlined', 'circle-question-outlined', 'circle-remove-outlined', 'circle-right-outlined', 'circle-up-outlined', 'circle-warning-outlined', 'clock-2-outlined', 'clock-outlined', 'cog-outlined', 'coin-outlined', 'comment-outlined', 'contacts-outlined', 'contacts-user-outlined', 'credit-card-outlined', 'cup-outlined', 'direction-arrows-outlined', 'directory-outlined', 'document-outlined', 'dollar-box-outlined', 'dollar-card-outlined', 'dollar-coin-shine-outlined', 'dollar-credit-card-outlined', 'dollar-sign', 'double-buildings-outlined', 'double-left-arrows', 'double-right-arrows', 'download-outlined', 'edit-template-outlined', 'email-outlined', 'enter-arrow', 'envelope-outlined', 'expense-outlined', 'explore-outlined', 'external-link', 'eye-invisible-outlined', 'eye-outlined', 'face-id', 'face-meh-outlined', 'face-open-smiley-outlined', 'face-sad-outlined', 'face-smiley-outlined', 'feed-outlined', 'file-certified-outlined', 'file-clone-outlined', 'file-copy-outlined', 'file-dispose-outlined', 'file-dollar-certified-outlined', 'file-dollar-outlined', 'file-download-outlined', 'file-export-outlined', 'file-lock-outlined', 'file-outlined', 'file-search-outlined', 'file-secured-outlined', 'file-statutory-outlined', 'file-verified-outlined', 'filter-outlined', 'folder-outlined', 'folder-user-outlined', 'funnel-filter-outline', 'graph-outlined', 'hand-holding-user-outlined', 'happy-sun-outlined', 'health-bag-outlined', 'heart-outlined', 'home-active-outlined', 'home-outlined', 'id-card-outlined', 'image-outlined', 'import-outlined', 'instapay-outlined', 'italic', 'link-1', 'link-2', 'list-outlined', 'live-help-outlined', 'location-on-outlined', 'location-outlined', 'lock-outlined', 'locked-file-outlined', 'log-out', 'media-content-outlined', 'menu-close', 'menu-expand', 'menu-fold-outlined', 'menu-unfold-outlined', 'moneybag-outlined', 'moon-outlined', 'more-horizontal', 'more-vertical', 'multiple-folders-outlined', 'multiple-users-outlined', 'near-me-outlined', 'node-outlined', 'number-points', 'number', 'overview-outlined', 'payment-summary-outlined', 'payslip-outlined', 'pencil-outlined', 'percentage', 'phone-outlined', 'piggy-bank-outlined', 'plane-outlined', 'play-circle-outlined', 'print-outlined', 'qr-code-outlined', 'qualification-outlined', 're-assign', 'redeem', 'refresh', 'remove', 'reply-outlined', 'restart', 'return-arrow', 'rostering-outlined', 'save-outlined', 'schedule-outlined', 'search-outlined', 'search-secured-outlined', 'send-outlined', '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', 'suitcase-clock-outlined', 'suitcase-outlined', 'survey-outlined', 'switch-outlined', 'sync', 'target-outlined', 'timesheet-outlined', 'today-outlined', 'transfer', 'trash-bin-outlined', 'umbrela-outlined', 'unavailable', 'underline', 'union-outlined', 'unlock-outlined', 'upload-outlined', 'user-circle-outlined', 'user-gear-outlined', 'user-outlined', 'user-rectangle-outlined', 'video-1-outlined', 'video-2-outlined', 'wallet-outlined'];
 
 var activate = 59000;
 var adjustment = 59003;
@@ -5867,44 +5894,44 @@ var node = 59124;
 var paperclip = 59126;
 var pencil = 59128;
 var phone = 59129;
-var plane = 59131;
-var print = 59133;
-var reply = 59136;
-var reschedule = 59137;
-var rostering = 59138;
-var save = 59139;
-var schedule = 59141;
-var send = 59143;
-var speaker = 59145;
-var star = 59150;
-var stopwatch = 59152;
-var suitcase = 59153;
-var survey = 59154;
-var swag = 59155;
-var tag = 59157;
-var target = 59158;
-var teams = 59159;
-var timesheet = 59160;
-var unlock = 59163;
-var user = 59164;
-var wallet = 59167;
-var warning = 59168;
-var add = 59174;
-var bold = 59195;
-var cancel = 59206;
-var checkmark = 59210;
-var italic = 59287;
-var number = 59311;
-var percentage = 59316;
-var redeem = 59325;
-var refresh = 59326;
-var remove = 59327;
-var restart = 59329;
-var strikethrough = 59350;
-var sync = 59355;
-var transfer = 59359;
-var unavailable = 59362;
-var underline = 59363;
+var plane = 59132;
+var print = 59134;
+var reply = 59137;
+var reschedule = 59138;
+var rostering = 59139;
+var save = 59140;
+var schedule = 59142;
+var send = 59144;
+var speaker = 59146;
+var star = 59151;
+var stopwatch = 59153;
+var suitcase = 59154;
+var survey = 59155;
+var swag = 59160;
+var tag = 59162;
+var target = 59163;
+var teams = 59164;
+var timesheet = 59165;
+var unlock = 59168;
+var user = 59169;
+var wallet = 59172;
+var warning = 59173;
+var add = 59179;
+var bold = 59200;
+var cancel = 59211;
+var checkmark = 59216;
+var italic = 59293;
+var number = 59317;
+var percentage = 59322;
+var redeem = 59331;
+var refresh = 59332;
+var remove = 59333;
+var restart = 59335;
+var strikethrough = 59356;
+var sync = 59361;
+var transfer = 59365;
+var unavailable = 59368;
+var underline = 59369;
 var glyphMap = {
 	activate: activate,
 	"add-emoji": 59001,
@@ -6037,249 +6064,255 @@ var glyphMap = {
 	pencil: pencil,
 	phone: phone,
 	"piggy-bank": 59130,
+	"plane-up": 59131,
 	plane: plane,
-	"play-circle": 59132,
+	"play-circle": 59133,
 	print: print,
-	"raising-hands": 59134,
-	"reply-arrow": 59135,
+	"raising-hands": 59135,
+	"reply-arrow": 59136,
 	reply: reply,
 	reschedule: reschedule,
 	rostering: rostering,
 	save: save,
-	"schedule-send": 59140,
+	"schedule-send": 59141,
 	schedule: schedule,
-	"search-person": 59142,
+	"search-person": 59143,
 	send: send,
-	"speaker-active": 59144,
+	"speaker-active": 59145,
 	speaker: speaker,
-	"star-award": 59146,
-	"star-badge": 59147,
-	"star-circle": 59148,
-	"star-medal": 59149,
+	"star-award": 59147,
+	"star-badge": 59148,
+	"star-circle": 59149,
+	"star-medal": 59150,
 	star: star,
-	"steps-circle": 59151,
+	"steps-circle": 59152,
 	stopwatch: stopwatch,
 	suitcase: suitcase,
 	survey: survey,
+	"swag-pillar-benefit": 59156,
+	"swag-pillar-career": 59157,
+	"swag-pillar-money": 59158,
+	"swag-pillar-work": 59159,
 	swag: swag,
-	"switch": 59156,
+	"switch": 59161,
 	tag: tag,
 	target: target,
 	teams: teams,
 	timesheet: timesheet,
-	"touch-id": 59161,
-	"trash-bin": 59162,
+	"touch-id": 59166,
+	"trash-bin": 59167,
 	unlock: unlock,
 	user: user,
-	"video-1": 59165,
-	"video-2": 59166,
+	"video-1": 59170,
+	"video-2": 59171,
 	wallet: wallet,
 	warning: warning,
-	"activate-outlined": 59169,
-	"add-credit-card-outlined": 59170,
-	"add-person-outlined": 59171,
-	"add-section-outlined": 59172,
-	"add-time-outlined": 59173,
+	"activate-outlined": 59174,
+	"add-credit-card-outlined": 59175,
+	"add-person-outlined": 59176,
+	"add-section-outlined": 59177,
+	"add-time-outlined": 59178,
 	add: add,
-	"adjustment-outlined": 59175,
-	"alignment-2-outlined": 59176,
-	"alignment-outlined": 59177,
-	"all-caps": 59178,
-	"arrow-down": 59179,
-	"arrow-downwards": 59180,
-	"arrow-left": 59181,
-	"arrow-leftwards": 59182,
-	"arrow-right": 59183,
-	"arrow-rightwards": 59184,
-	"arrow-up": 59185,
-	"arrow-upwards": 59186,
-	"article-outlined": 59187,
-	"at-sign": 59188,
-	"auto-graph-outlined": 59189,
-	"bell-active-outlined": 59190,
-	"bell-outlined": 59191,
-	"bell-slash-outlined": 59192,
-	"billing-outlined": 59193,
-	"body-outlined": 59194,
+	"adjustment-outlined": 59180,
+	"alignment-2-outlined": 59181,
+	"alignment-outlined": 59182,
+	"all-caps": 59183,
+	"arrow-down": 59184,
+	"arrow-downwards": 59185,
+	"arrow-left": 59186,
+	"arrow-leftwards": 59187,
+	"arrow-right": 59188,
+	"arrow-rightwards": 59189,
+	"arrow-up": 59190,
+	"arrow-upwards": 59191,
+	"article-outlined": 59192,
+	"at-sign": 59193,
+	"auto-graph-outlined": 59194,
+	"bell-active-outlined": 59195,
+	"bell-outlined": 59196,
+	"bell-slash-outlined": 59197,
+	"billing-outlined": 59198,
+	"body-outlined": 59199,
 	bold: bold,
-	"bookmark-added-outlined": 59196,
-	"bookmark-outlined": 59197,
-	"box-check-outlined": 59198,
-	"box-outlined": 59199,
-	"bullet-points": 59200,
-	"cake-outlined": 59201,
-	"calendar-dates-outlined": 59202,
-	"calendar-star-outlined": 59203,
-	"call-split-outlined": 59204,
-	"camera-outlined": 59205,
+	"bookmark-added-outlined": 59201,
+	"bookmark-outlined": 59202,
+	"box-check-outlined": 59203,
+	"box-outlined": 59204,
+	"bullet-points": 59205,
+	"cake-outlined": 59206,
+	"calendar-dates-outlined": 59207,
+	"calendar-star-outlined": 59208,
+	"call-split-outlined": 59209,
+	"camera-outlined": 59210,
 	cancel: cancel,
-	"charging-station-outlined": 59207,
-	"chat-bubble-outlined": 59208,
-	"chat-unread-outlined": 59209,
+	"car-forward-outlined": 59212,
+	"charging-station-outlined": 59213,
+	"chat-bubble-outlined": 59214,
+	"chat-unread-outlined": 59215,
 	checkmark: checkmark,
-	"circle-add-outlined": 59211,
-	"circle-cancel-outlined": 59212,
-	"circle-down-outlined": 59213,
-	"circle-info-outlined": 59214,
-	"circle-left-outlined": 59215,
-	"circle-ok-outlined": 59216,
-	"circle-question-outlined": 59217,
-	"circle-remove-outlined": 59218,
-	"circle-right-outlined": 59219,
-	"circle-up-outlined": 59220,
-	"circle-warning-outlined": 59221,
-	"clock-2-outlined": 59222,
-	"clock-outlined": 59223,
-	"cog-outlined": 59224,
-	"coin-outlined": 59225,
-	"comment-outlined": 59226,
-	"contacts-outlined": 59227,
-	"contacts-user-outlined": 59228,
-	"credit-card-outlined": 59229,
-	"cup-outlined": 59230,
-	"direction-arrows-outlined": 59231,
-	"directory-outlined": 59232,
-	"document-outlined": 59233,
-	"dollar-box-outlined": 59234,
-	"dollar-card-outlined": 59235,
-	"dollar-coin-shine-outlined": 59236,
-	"dollar-credit-card-outlined": 59237,
-	"dollar-sign": 59238,
-	"double-buildings-outlined": 59239,
-	"double-left-arrows": 59240,
-	"double-right-arrows": 59241,
-	"download-outlined": 59242,
-	"edit-template-outlined": 59243,
-	"email-outlined": 59244,
-	"enter-arrow": 59245,
-	"envelope-outlined": 59246,
-	"expense-outlined": 59247,
-	"explore-outlined": 59248,
-	"external-link": 59249,
-	"eye-invisible-outlined": 59250,
-	"eye-outlined": 59251,
-	"face-id": 59252,
-	"face-meh-outlined": 59253,
-	"face-open-smiley-outlined": 59254,
-	"face-sad-outlined": 59255,
-	"face-smiley-outlined": 59256,
-	"feed-outlined": 59257,
-	"file-certified-outlined": 59258,
-	"file-clone-outlined": 59259,
-	"file-copy-outlined": 59260,
-	"file-dispose-outlined": 59261,
-	"file-dollar-certified-outlined": 59262,
-	"file-dollar-outlined": 59263,
-	"file-download-outlined": 59264,
-	"file-export-outlined": 59265,
-	"file-lock-outlined": 59266,
-	"file-outlined": 59267,
-	"file-search-outlined": 59268,
-	"file-secured-outlined": 59269,
-	"file-statutory-outlined": 59270,
-	"file-verified-outlined": 59271,
-	"filter-outlined": 59272,
-	"folder-outlined": 59273,
-	"folder-user-outlined": 59274,
-	"funnel-filter-outline": 59275,
-	"graph-outlined": 59276,
-	"hand-holding-user-outlined": 59277,
-	"happy-sun-outlined": 59278,
-	"health-bag-outlined": 59279,
-	"heart-outlined": 59280,
-	"home-active-outlined": 59281,
-	"home-outlined": 59282,
-	"id-card-outlined": 59283,
-	"image-outlined": 59284,
-	"import-outlined": 59285,
-	"instapay-outlined": 59286,
+	"circle-add-outlined": 59217,
+	"circle-cancel-outlined": 59218,
+	"circle-down-outlined": 59219,
+	"circle-info-outlined": 59220,
+	"circle-left-outlined": 59221,
+	"circle-ok-outlined": 59222,
+	"circle-question-outlined": 59223,
+	"circle-remove-outlined": 59224,
+	"circle-right-outlined": 59225,
+	"circle-up-outlined": 59226,
+	"circle-warning-outlined": 59227,
+	"clock-2-outlined": 59228,
+	"clock-outlined": 59229,
+	"cog-outlined": 59230,
+	"coin-outlined": 59231,
+	"comment-outlined": 59232,
+	"contacts-outlined": 59233,
+	"contacts-user-outlined": 59234,
+	"credit-card-outlined": 59235,
+	"cup-outlined": 59236,
+	"direction-arrows-outlined": 59237,
+	"directory-outlined": 59238,
+	"document-outlined": 59239,
+	"dollar-box-outlined": 59240,
+	"dollar-card-outlined": 59241,
+	"dollar-coin-shine-outlined": 59242,
+	"dollar-credit-card-outlined": 59243,
+	"dollar-sign": 59244,
+	"double-buildings-outlined": 59245,
+	"double-left-arrows": 59246,
+	"double-right-arrows": 59247,
+	"download-outlined": 59248,
+	"edit-template-outlined": 59249,
+	"email-outlined": 59250,
+	"enter-arrow": 59251,
+	"envelope-outlined": 59252,
+	"expense-outlined": 59253,
+	"explore-outlined": 59254,
+	"external-link": 59255,
+	"eye-invisible-outlined": 59256,
+	"eye-outlined": 59257,
+	"face-id": 59258,
+	"face-meh-outlined": 59259,
+	"face-open-smiley-outlined": 59260,
+	"face-sad-outlined": 59261,
+	"face-smiley-outlined": 59262,
+	"feed-outlined": 59263,
+	"file-certified-outlined": 59264,
+	"file-clone-outlined": 59265,
+	"file-copy-outlined": 59266,
+	"file-dispose-outlined": 59267,
+	"file-dollar-certified-outlined": 59268,
+	"file-dollar-outlined": 59269,
+	"file-download-outlined": 59270,
+	"file-export-outlined": 59271,
+	"file-lock-outlined": 59272,
+	"file-outlined": 59273,
+	"file-search-outlined": 59274,
+	"file-secured-outlined": 59275,
+	"file-statutory-outlined": 59276,
+	"file-verified-outlined": 59277,
+	"filter-outlined": 59278,
+	"folder-outlined": 59279,
+	"folder-user-outlined": 59280,
+	"funnel-filter-outline": 59281,
+	"graph-outlined": 59282,
+	"hand-holding-user-outlined": 59283,
+	"happy-sun-outlined": 59284,
+	"health-bag-outlined": 59285,
+	"heart-outlined": 59286,
+	"home-active-outlined": 59287,
+	"home-outlined": 59288,
+	"id-card-outlined": 59289,
+	"image-outlined": 59290,
+	"import-outlined": 59291,
+	"instapay-outlined": 59292,
 	italic: italic,
-	"link-1": 59288,
-	"link-2": 59289,
-	"list-outlined": 59290,
-	"live-help-outlined": 59291,
-	"location-on-outlined": 59292,
-	"location-outlined": 59293,
-	"lock-outlined": 59294,
-	"locked-file-outlined": 59295,
-	"log-out": 59296,
-	"media-content-outlined": 59297,
-	"menu-close": 59298,
-	"menu-expand": 59299,
-	"menu-fold-outlined": 59300,
-	"menu-unfold-outlined": 59301,
-	"moneybag-outlined": 59302,
-	"moon-outlined": 59303,
-	"more-horizontal": 59304,
-	"more-vertical": 59305,
-	"multiple-folders-outlined": 59306,
-	"multiple-users-outlined": 59307,
-	"near-me-outlined": 59308,
-	"node-outlined": 59309,
-	"number-points": 59310,
+	"link-1": 59294,
+	"link-2": 59295,
+	"list-outlined": 59296,
+	"live-help-outlined": 59297,
+	"location-on-outlined": 59298,
+	"location-outlined": 59299,
+	"lock-outlined": 59300,
+	"locked-file-outlined": 59301,
+	"log-out": 59302,
+	"media-content-outlined": 59303,
+	"menu-close": 59304,
+	"menu-expand": 59305,
+	"menu-fold-outlined": 59306,
+	"menu-unfold-outlined": 59307,
+	"moneybag-outlined": 59308,
+	"moon-outlined": 59309,
+	"more-horizontal": 59310,
+	"more-vertical": 59311,
+	"multiple-folders-outlined": 59312,
+	"multiple-users-outlined": 59313,
+	"near-me-outlined": 59314,
+	"node-outlined": 59315,
+	"number-points": 59316,
 	number: number,
-	"overview-outlined": 59312,
-	"payment-summary-outlined": 59313,
-	"payslip-outlined": 59314,
-	"pencil-outlined": 59315,
+	"overview-outlined": 59318,
+	"payment-summary-outlined": 59319,
+	"payslip-outlined": 59320,
+	"pencil-outlined": 59321,
 	percentage: percentage,
-	"phone-outlined": 59317,
-	"piggy-bank-outlined": 59318,
-	"plane-outlined": 59319,
-	"play-circle-outlined": 59320,
-	"print-outlined": 59321,
-	"qr-code-outlined": 59322,
-	"qualification-outlined": 59323,
-	"re-assign": 59324,
+	"phone-outlined": 59323,
+	"piggy-bank-outlined": 59324,
+	"plane-outlined": 59325,
+	"play-circle-outlined": 59326,
+	"print-outlined": 59327,
+	"qr-code-outlined": 59328,
+	"qualification-outlined": 59329,
+	"re-assign": 59330,
 	redeem: redeem,
 	refresh: refresh,
 	remove: remove,
-	"reply-outlined": 59328,
+	"reply-outlined": 59334,
 	restart: restart,
-	"return-arrow": 59330,
-	"rostering-outlined": 59331,
-	"save-outlined": 59332,
-	"schedule-outlined": 59333,
-	"search-outlined": 59334,
-	"search-secured-outlined": 59335,
-	"send-outlined": 59336,
-	"share-1": 59337,
-	"share-2": 59338,
-	"share-outlined": 59339,
-	"show-chart-outlined": 59340,
-	"single-down-arrow": 59341,
-	"single-left-arrow": 59342,
-	"single-right-arrow": 59343,
-	"single-up-arrow": 59344,
-	"speaker-active-outlined": 59345,
-	"speaker-outlined": 59346,
-	"star-circle-outlined": 59347,
-	"star-outlined": 59348,
-	"stopwatch-outlined": 59349,
+	"return-arrow": 59336,
+	"rostering-outlined": 59337,
+	"save-outlined": 59338,
+	"schedule-outlined": 59339,
+	"search-outlined": 59340,
+	"search-secured-outlined": 59341,
+	"send-outlined": 59342,
+	"share-1": 59343,
+	"share-2": 59344,
+	"share-outlined": 59345,
+	"show-chart-outlined": 59346,
+	"single-down-arrow": 59347,
+	"single-left-arrow": 59348,
+	"single-right-arrow": 59349,
+	"single-up-arrow": 59350,
+	"speaker-active-outlined": 59351,
+	"speaker-outlined": 59352,
+	"star-circle-outlined": 59353,
+	"star-outlined": 59354,
+	"stopwatch-outlined": 59355,
 	strikethrough: strikethrough,
-	"suitcase-clock-outlined": 59351,
-	"suitcase-outlined": 59352,
-	"survey-outlined": 59353,
-	"switch-outlined": 59354,
+	"suitcase-clock-outlined": 59357,
+	"suitcase-outlined": 59358,
+	"survey-outlined": 59359,
+	"switch-outlined": 59360,
 	sync: sync,
-	"target-outlined": 59356,
-	"timesheet-outlined": 59357,
-	"today-outlined": 59358,
+	"target-outlined": 59362,
+	"timesheet-outlined": 59363,
+	"today-outlined": 59364,
 	transfer: transfer,
-	"trash-bin-outlined": 59360,
-	"umbrela-outlined": 59361,
+	"trash-bin-outlined": 59366,
+	"umbrela-outlined": 59367,
 	unavailable: unavailable,
 	underline: underline,
-	"union-outlined": 59364,
-	"unlock-outlined": 59365,
-	"upload-outlined": 59366,
-	"user-circle-outlined": 59367,
-	"user-gear-outlined": 59368,
-	"user-outlined": 59369,
-	"user-rectangle-outlined": 59370,
-	"video-1-outlined": 59371,
-	"video-2-outlined": 59372,
-	"wallet-outlined": 59373
+	"union-outlined": 59370,
+	"unlock-outlined": 59371,
+	"upload-outlined": 59372,
+	"user-circle-outlined": 59373,
+	"user-gear-outlined": 59374,
+	"user-outlined": 59375,
+	"user-rectangle-outlined": 59376,
+	"video-1-outlined": 59377,
+	"video-2-outlined": 59378,
+	"wallet-outlined": 59379
 };
 
 var HeroIcon = reactNativeVectorIcons.createIconSet(glyphMap, 'hero-icons-mobile', 'hero-icons-mobile.ttf');
@@ -6395,7 +6428,7 @@ var AccordionItem = function AccordionItem(_ref) {
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
     style = _ref.style,
     testID = _ref.testID;
-  return /*#__PURE__*/React__default["default"].createElement(StyledItemWrapper, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledItemWrapper$1, {
     themeVariant: variant,
     style: style,
     testID: testID
@@ -6429,7 +6462,7 @@ var Accordion = function Accordion(_ref) {
     _usePropsOrInternalSt2 = _slicedToArray(_usePropsOrInternalSt, 2),
     _activeItemKey = _usePropsOrInternalSt2[0],
     _onItemPress = _usePropsOrInternalSt2[1];
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$a, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$b, {
     style: style,
     testID: testID
   }, items.map(function (_ref2, index) {
@@ -6616,7 +6649,7 @@ var Attachment = function Attachment(_ref) {
   })) : null);
 };
 
-var StyledWrapper$9 = index$a(reactNative.TouchableOpacity)(function (_ref) {
+var StyledWrapper$a = index$a(reactNative.TouchableOpacity)(function (_ref) {
   var themeSize = _ref.themeSize,
     themeIntent = _ref.themeIntent,
     theme = _ref.theme;
@@ -6671,7 +6704,7 @@ var Avatar = function Avatar(_ref) {
     hasImageError = _useState2[0],
     setHasImageError = _useState2[1];
   if (title === undefined && source === undefined) return null;
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$9, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$a, {
     testID: testID,
     onPress: onPress,
     disabled: onPress === undefined,
@@ -6695,7 +6728,7 @@ var Avatar = function Avatar(_ref) {
 };
 
 var VISIBLE_RATIO = 0.7;
-var StyledWrapper$8 = index$a(reactNative.View)(function (_ref) {
+var StyledWrapper$9 = index$a(reactNative.View)(function (_ref) {
   var theme = _ref.theme,
     themeSize = _ref.themeSize,
     themeAvatarCount = _ref.themeAvatarCount;
@@ -6757,7 +6790,7 @@ var AvatarStack = function AvatarStack(_ref) {
     });
     avatars.push(remainingAvatar);
   }
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$8, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$9, {
     themeSize: size,
     themeAvatarCount: avatars.length,
     style: style,
@@ -7092,7 +7125,7 @@ var Divider = function Divider(_ref) {
 
 var AnimatedPressable$1 = reactNative.Animated.createAnimatedComponent(reactNative.Pressable);
 var AnimatedSafeAreaView = reactNative.Animated.createAnimatedComponent(reactNative.SafeAreaView);
-var StyledWrapper$7 = index$a(reactNative.View)(_objectSpread2(_objectSpread2({}, reactNative.StyleSheet.absoluteFillObject), {}, {
+var StyledWrapper$8 = index$a(reactNative.View)(_objectSpread2(_objectSpread2({}, reactNative.StyleSheet.absoluteFillObject), {}, {
   flexDirection: 'column-reverse'
 }));
 var StyledKeyboardAvoidingView = index$a(reactNative.KeyboardAvoidingView)(function () {
@@ -7751,7 +7784,7 @@ var BottomSheet = function BottomSheet(_ref) {
     transparent: true,
     testID: testID,
     onShow: onOpen
-  }, /*#__PURE__*/React__default["default"].createElement(StyledWrapper$7, {
+  }, /*#__PURE__*/React__default["default"].createElement(StyledWrapper$8, {
     pointerEvents: "box-none"
   }, /*#__PURE__*/React__default["default"].createElement(StyledKeyboardAvoidingView, _extends$1({
     behavior: reactNative.Platform.OS === 'ios' ? 'padding' : 'height'
@@ -10582,7 +10615,7 @@ var Image = function Image(_ref) {
   }, imageNativeProps));
 };
 
-var StyledPageControl$1 = index$a(reactNative.View)(function () {
+var StyledPageControl$2 = index$a(reactNative.View)(function () {
   return {
     flexDirection: 'row',
     alignItems: 'center'
@@ -10610,7 +10643,7 @@ var PageControl = function PageControl(_ref) {
   React__default["default"].useEffect(function () {
     animatedValue.setValue(currentPage);
   }, [currentPage]);
-  return /*#__PURE__*/React__default["default"].createElement(StyledPageControl$1, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledPageControl$2, {
     testID: testID,
     style: style
   }, new Array(numberOfPages).fill('').map(function (_, index) {
@@ -10699,7 +10732,7 @@ var StyledCarouselFooterWrapper = index$a(reactNative.View)(function (_ref5) {
     marginBottom: theme.__hd__.carousel.space.footerMarginBottom
   };
 });
-var StyledPageControl = index$a(PageControl)({
+var StyledPageControl$1 = index$a(PageControl)({
   marginStart: 'auto'
 });
 
@@ -10734,7 +10767,243 @@ var CarouselItem = function CarouselItem(_ref) {
   }, body) : null));
 };
 
-var _excluded$d = ["items", "onItemIndexChange", "renderActions", "selectedItemIndex", "style", "shouldShowPagination"];
+/*
+ * Carousel item width.
+ * the percentage of the Card Carousel width
+ */
+var ITEM_WIDTH_RATE = 0.85;
+/*
+ * view position when scroll to Index
+ */
+var VIEW_POSITION_CENTER = 0.5;
+
+var StyledDataCard = index$a(reactNative.View)(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    borderRadius: theme.__hd__.card.radii["default"],
+    overflow: 'hidden',
+    flexDirection: 'row'
+  };
+});
+var Indicator = index$a(reactNative.View)(function (_ref2) {
+  var theme = _ref2.theme,
+    themeIntent = _ref2.themeIntent;
+  return {
+    backgroundColor: theme.__hd__.card.colors[themeIntent],
+    width: theme.__hd__.card.sizes.indicatorWidth,
+    height: '100%'
+  };
+});
+
+var _excluded$d = ["intent", "children"];
+var DataCard = function DataCard(_ref) {
+  var _ref$intent = _ref.intent,
+    intent = _ref$intent === void 0 ? 'info' : _ref$intent,
+    children = _ref.children,
+    nativeProps = _objectWithoutProperties(_ref, _excluded$d);
+  return /*#__PURE__*/React__default["default"].createElement(StyledDataCard, nativeProps, /*#__PURE__*/React__default["default"].createElement(Indicator, {
+    themeIntent: intent,
+    testID: "data-card-indicator"
+  }), children);
+};
+
+var StyledCard$1 = index$a(reactNative.View)(function (_ref) {
+  var theme = _ref.theme,
+    themeIntent = _ref.themeIntent;
+  return _objectSpread2(_objectSpread2({}, themeIntent !== undefined && {
+    backgroundColor: theme.__hd__.card.colors[themeIntent]
+  }), {}, {
+    borderRadius: theme.__hd__.card.radii["default"],
+    overflow: 'hidden'
+  });
+});
+
+var _excluded$c = ["intent", "children"];
+var Card = function Card(_ref) {
+  var intent = _ref.intent,
+    children = _ref.children,
+    nativeProps = _objectWithoutProperties(_ref, _excluded$c);
+  return /*#__PURE__*/React__default["default"].createElement(StyledCard$1, _extends$1({}, nativeProps, {
+    themeIntent: intent
+  }), children);
+};
+var Card$1 = Object.assign(Card, {
+  Data: DataCard
+});
+
+var StyledPageControl = index$a(PageControl)(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    alignSelf: 'center',
+    marginTop: theme.__hd__.cardCarousel.space.pageControlMarginTop
+  };
+});
+var StyledWrapper$7 = index$a(reactNative.View)({});
+var StyledCard = index$a(Card$1)(function (_ref2) {
+  var theme = _ref2.theme;
+  return {
+    borderRadius: theme.__hd__.cardCarousel.radii.card,
+    overflow: 'hidden',
+    flex: 1
+  };
+});
+var StyledShadow = index$a(reactNative.View)(function (_ref3) {
+  var theme = _ref3.theme;
+  return {
+    borderRadius: theme.__hd__.cardCarousel.radii.card,
+    shadowColor: theme.__hd__.cardCarousel.colors.shadow,
+    shadowOffset: theme.__hd__.cardCarousel.shadows.offset,
+    shadowRadius: theme.__hd__.cardCarousel.shadows.radius,
+    shadowOpacity: theme.__hd__.cardCarousel.shadows.opacity,
+    elevation: theme.__hd__.cardCarousel.shadows.elevation,
+    flex: 1
+  };
+});
+var StyledItemWrapper = index$a(reactNative.View)(function (_ref4) {
+  var theme = _ref4.theme;
+  return {
+    padding: theme.__hd__.cardCarousel.space.carouselItemSpacing
+  };
+});
+
+var CardCarousel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var onItemIndexChange = _ref.onItemIndexChange,
+    items = _ref.items,
+    _ref$hidePageControl = _ref.hidePageControl,
+    hidePageControl = _ref$hidePageControl === void 0 ? false : _ref$hidePageControl,
+    style = _ref.style,
+    testID = _ref.testID,
+    _ref$autoPlay = _ref.autoPlay,
+    autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
+    _ref$autoPlayInterval = _ref.autoPlayInterval,
+    autoPlayInterval = _ref$autoPlayInterval === void 0 ? 3000 : _ref$autoPlayInterval;
+  var _useState = React.useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentIndex = _useState2[0],
+    setCurrentIndex = _useState2[1];
+  var theme = useTheme();
+  var _useState3 = React.useState(0),
+    _useState4 = _slicedToArray(_useState3, 2),
+    flatListWidth = _useState4[0],
+    setFlatListWidth = _useState4[1];
+  var itemWidth = flatListWidth * ITEM_WIDTH_RATE;
+  var carouselRef = React.useRef(null);
+  var _snapToIndex = React.useCallback(function (index) {
+    var _carouselRef$current;
+    var validIndex = 0;
+    if (index < 0) {
+      validIndex = 0;
+    } else if (index >= items.length) {
+      validIndex = items.length - 1;
+    } else {
+      validIndex = index;
+    }
+    (_carouselRef$current = carouselRef.current) === null || _carouselRef$current === void 0 ? void 0 : _carouselRef$current.scrollToIndex({
+      index: validIndex,
+      animated: true,
+      viewPosition: VIEW_POSITION_CENTER
+    });
+  }, [carouselRef, itemWidth]);
+  /*
+   * snap to the next index. If the curent index is the last one, snap to the first one.
+   */
+  var snapToNext = React.useCallback(function () {
+    var _carouselRef$current2;
+    var nextIndex = currentIndex + 1;
+    if (nextIndex >= items.length) {
+      nextIndex = 0;
+    }
+    (_carouselRef$current2 = carouselRef.current) === null || _carouselRef$current2 === void 0 ? void 0 : _carouselRef$current2.scrollToIndex({
+      index: nextIndex,
+      animated: true,
+      viewPosition: VIEW_POSITION_CENTER
+    });
+  }, [carouselRef, currentIndex, itemWidth, items.length]);
+  React__default["default"].useImperativeHandle(ref, function () {
+    return {
+      snapToIndex: function snapToIndex(index) {
+        _snapToIndex(index);
+      },
+      // we don't expose this method, it's for testing https://medium.com/developer-rants/how-to-test-useref-without-mocking-useref-699165f4994e
+      getFlatListRef: function getFlatListRef() {
+        return carouselRef.current;
+      }
+    };
+  }, [_snapToIndex]);
+  React.useEffect(function () {
+    var timer;
+    if (autoPlay) {
+      timer = setInterval(function () {
+        snapToNext();
+      }, autoPlayInterval);
+    }
+    return function () {
+      clearInterval(timer);
+    };
+  }, [autoPlay, snapToNext, currentIndex, autoPlayInterval]);
+  var visibleSlideChanged = React.useCallback(function (_ref2) {
+    var viewableItems = _ref2.viewableItems;
+    if (!viewableItems || viewableItems && !viewableItems.length) return;
+    var index = viewableItems[0].index;
+    setCurrentIndex(index);
+    if (onItemIndexChange) {
+      onItemIndexChange(index);
+    }
+  }, [onItemIndexChange]);
+  var getItemLayout = React.useCallback(function (_, index) {
+    return {
+      length: itemWidth,
+      offset: itemWidth * index,
+      index: index
+    };
+  }, [itemWidth]);
+  var onLayout = React.useCallback(function (e) {
+    setFlatListWidth(e.nativeEvent.layout.width);
+  }, [setFlatListWidth]);
+  var renderItem = React.useCallback(function (_ref3) {
+    var item = _ref3.item;
+    return /*#__PURE__*/React__default["default"].createElement(StyledItemWrapper, {
+      style: {
+        width: itemWidth
+      }
+    }, /*#__PURE__*/React__default["default"].createElement(StyledShadow, null, /*#__PURE__*/React__default["default"].createElement(StyledCard, null, item)));
+  }, [itemWidth]);
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$7, {
+    style: style,
+    testID: testID
+  }, /*#__PURE__*/React__default["default"].createElement(reactNative.FlatList, {
+    contentContainerStyle: {
+      paddingHorizontal: theme.__hd__.cardCarousel.space.contentContainerPaddingHorizontal
+    },
+    onLayout: onLayout,
+    data: items,
+    horizontal: true,
+    showsHorizontalScrollIndicator: false,
+    pagingEnabled: true,
+    bounces: false,
+    scrollEventThrottle: 32,
+    snapToAlignment: "center",
+    getItemLayout: getItemLayout,
+    ref: carouselRef,
+    renderItem: renderItem,
+    keyExtractor: function keyExtractor(_, index) {
+      return "".concat(index);
+    },
+    decelerationRate: "fast",
+    renderToHardwareTextureAndroid: true,
+    snapToInterval: itemWidth + theme.__hd__.cardCarousel.space.carouselItemSpacing,
+    onViewableItemsChanged: visibleSlideChanged,
+    viewabilityConfig: {
+      itemVisiblePercentThreshold: 80
+    }
+  }), !hidePageControl && /*#__PURE__*/React__default["default"].createElement(StyledPageControl, {
+    testID: "pageControl",
+    currentPage: currentIndex,
+    numberOfPages: items.length
+  }));
+});
+
+var _excluded$b = ["items", "onItemIndexChange", "renderActions", "selectedItemIndex", "style", "shouldShowPagination"];
 function useStateFromProp(initialValue) {
   var _useState = React.useState(initialValue),
     _useState2 = _slicedToArray(_useState, 2),
@@ -10756,7 +11025,7 @@ var Carousel = function Carousel(_ref) {
     shouldShowPagination = _ref$shouldShowPagina === void 0 ? function () {
       return true;
     } : _ref$shouldShowPagina,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$d);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$b);
   var carouselRef = React.useRef(null);
   var _useStateFromProp = useStateFromProp(selectedItemIndex),
     _useStateFromProp2 = _slicedToArray(_useStateFromProp, 2),
@@ -10832,64 +11101,13 @@ var Carousel = function Carousel(_ref) {
         width: width
       });
     }
-  }), /*#__PURE__*/React__default["default"].createElement(StyledCarouselFooterWrapper, null, renderActions && renderActions(currentSlideIndex), shouldShowPagination(currentSlideIndex) && /*#__PURE__*/React__default["default"].createElement(StyledPageControl, {
+  }), /*#__PURE__*/React__default["default"].createElement(StyledCarouselFooterWrapper, null, renderActions && renderActions(currentSlideIndex), shouldShowPagination(currentSlideIndex) && /*#__PURE__*/React__default["default"].createElement(StyledPageControl$1, {
     numberOfPages: items.length,
     currentPage: currentSlideIndex
   }))));
 };
-
-var StyledDataCard = index$a(reactNative.View)(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    borderRadius: theme.__hd__.card.radii["default"],
-    overflow: 'hidden',
-    flexDirection: 'row'
-  };
-});
-var Indicator = index$a(reactNative.View)(function (_ref2) {
-  var theme = _ref2.theme,
-    themeIntent = _ref2.themeIntent;
-  return {
-    backgroundColor: theme.__hd__.card.colors[themeIntent],
-    width: theme.__hd__.card.sizes.indicatorWidth,
-    height: '100%'
-  };
-});
-
-var _excluded$c = ["intent", "children"];
-var DataCard = function DataCard(_ref) {
-  var _ref$intent = _ref.intent,
-    intent = _ref$intent === void 0 ? 'info' : _ref$intent,
-    children = _ref.children,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$c);
-  return /*#__PURE__*/React__default["default"].createElement(StyledDataCard, nativeProps, /*#__PURE__*/React__default["default"].createElement(Indicator, {
-    themeIntent: intent,
-    testID: "data-card-indicator"
-  }), children);
-};
-
-var StyledCard = index$a(reactNative.View)(function (_ref) {
-  var theme = _ref.theme,
-    themeIntent = _ref.themeIntent;
-  return _objectSpread2(_objectSpread2({}, themeIntent !== undefined && {
-    backgroundColor: theme.__hd__.card.colors[themeIntent]
-  }), {}, {
-    borderRadius: theme.__hd__.card.radii["default"],
-    overflow: 'hidden'
-  });
-});
-
-var _excluded$b = ["intent", "children"];
-var Card = function Card(_ref) {
-  var intent = _ref.intent,
-    children = _ref.children,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$b);
-  return /*#__PURE__*/React__default["default"].createElement(StyledCard, _extends$1({}, nativeProps, {
-    themeIntent: intent
-  }), children);
-};
-var index$8 = Object.assign(Card, {
-  Data: DataCard
+var index$8 = Object.assign(Carousel, {
+  Card: CardCarousel
 });
 
 var StyledWrapper$6 = index$a(reactNative.TouchableOpacity)(function (_ref) {
@@ -11014,9 +11232,9 @@ var StyledLabelInsideTextInput = index$a(Typography.Text)(function (_ref5) {
     textAlignVertical: 'center',
     alignContent: 'center',
     fontSize: theme.__hd__.textInput.fontSizes.labelInsideTextInput,
-    lineHeight: theme.__hd__.textInput.lineHeights.labelInsideTextInput,
     alignItems: 'center',
-    color: theme.__hd__.textInput.colors.labelsInsideTextInput[themeVariant]
+    color: theme.__hd__.textInput.colors.labelsInsideTextInput[themeVariant],
+    marginTop: theme.__hd__.textInput.space.labelInsideTextInputMarginTop
   };
 });
 var StyledAsteriskLabelInsideTextInput = index$a(Typography.Text)(function (_ref6) {
@@ -11069,7 +11287,6 @@ var StyledTextInput = index$a(reactNative.TextInput)(function (_ref11) {
   return {
     textAlignVertical: 'center',
     fontSize: theme.__hd__.textInput.fontSizes.text,
-    lineHeight: theme.__hd__.textInput.lineHeights.text,
     alignSelf: 'stretch',
     flexGrow: 2,
     marginHorizontal: theme.__hd__.textInput.space.inputHorizontalMargin,
@@ -31362,8 +31579,8 @@ exports.BottomSheet = BottomSheet$1;
 exports.Box = Box;
 exports.Button = CompoundButton;
 exports.Calendar = Calendar;
-exports.Card = index$8;
-exports.Carousel = Carousel;
+exports.Card = Card$1;
+exports.Carousel = index$8;
 exports.Checkbox = Checkbox;
 exports.Collapse = Collapse;
 exports.ContentNavigator = ContentNavigator;