@hero-design/rn 7.8.0 → 7.10.1

package/lib/index.js

@@ -2648,6 +2648,7 @@ var systemPalette = {
   backgroundLight: palette$6.greyLight95,
   backgroundDark: palette$6.greyDark75,
   text: palette$6.greyDark75,
+  subduedText: palette$6.greyDark30,
   disabledText: palette$6.greyDark15,
   disabledLightText: palette$6.greyLight45,
   invertedText: palette$6.white,
@@ -2948,7 +2949,9 @@ var getButtonTheme = function getButtonTheme(theme) {
     "default": theme.fonts.semiBold
   };
   var fontSize = {
-    "default": theme.fontSizes.xlarge
+    "default": theme.fontSizes.xlarge,
+    utility: theme.fontSizes.large,
+    textVariant: theme.fontSizes.large
   };
   var lineHeight = {
     "default": theme.lineHeights.large
@@ -2958,13 +2961,16 @@ var getButtonTheme = function getButtonTheme(theme) {
   };
   var space = {
     buttonPadding: theme.space.medium,
-    iconPadding: theme.space.small
+    iconPadding: theme.space.small,
+    utilityPadding: theme.space.small,
+    utilityIconPadding: theme.space.smallMedium
   };
   var sizes = {
     iconSize: theme.fontSizes.xxlarge
   };
   var radii = {
-    "default": theme.space.xlarge
+    "default": theme.space.xlarge,
+    utilityRadii: theme.space.small
   };
   var colors = {
     primary: theme.colors.primary,
@@ -2977,7 +2983,8 @@ var getButtonTheme = function getButtonTheme(theme) {
     disabledText: theme.colors.disabledLightText,
     disabledBorder: theme.colors.disabledLightText,
     disabledBackground: theme.colors.disabledLightText,
-    invertedText: theme.colors.invertedText
+    invertedText: theme.colors.invertedText,
+    utilityBackground: theme.colors.backgroundLight
   };
   return {
     borderWidth: borderWidth,
@@ -3002,11 +3009,15 @@ var getCardTheme = function getCardTheme(theme) {
       danger: theme.colors.dangerMediumLight
     }
   };
+  var sizes = {
+    indicatorWidth: theme.space.medium
+  };
   var radii = {
     "default": theme.radii.large
   };
   return {
     colors: colors,
+    sizes: sizes,
     radii: radii
   };
 };
@@ -3162,7 +3173,8 @@ var getIconTheme = function getIconTheme(theme) {
     danger: theme.colors.danger,
     success: theme.colors.success,
     warning: theme.colors.warning,
-    disabledText: theme.colors.disabledText
+    disabledText: theme.colors.disabledText,
+    invertedText: theme.colors.invertedText
   };
   var sizes = {
     xsmall: theme.fontSizes.large,
@@ -3402,20 +3414,79 @@ var getTagTheme = function getTagTheme(theme) {
 var getTextInputTheme = function getTextInputTheme(theme) {
   var colors = {
     labelBackground: theme.colors.platformBackground,
-    border: theme.colors.text
+    asterisks: {
+      "default": theme.colors.danger,
+      error: theme.colors.danger,
+      disabled: theme.colors.disabledLightText,
+      readonly: theme.colors.disabledText,
+      filled: theme.colors.danger,
+      focused: theme.colors.danger
+    },
+    error: theme.colors.danger,
+    placeholderIfNotFocused: theme.colors.text,
+    placeholderIfFocued: theme.colors.disabledText,
+    label: theme.colors.text,
+    readonlyLabel: theme.colors.disabledText,
+    disabledLabel: theme.colors.disabledLightText,
+    text: theme.colors.text,
+    borders: {
+      "default": theme.colors.text,
+      error: theme.colors.danger,
+      disabled: theme.colors.disabledLightText,
+      readonly: theme.colors.disabledText,
+      filled: theme.colors.text,
+      focused: theme.colors.text
+    },
+    labels: {
+      "default": theme.colors.text,
+      error: theme.colors.text,
+      disabled: theme.colors.disabledLightText,
+      readonly: theme.colors.disabledText,
+      filled: theme.colors.text,
+      focused: theme.colors.text
+    },
+    labelsInsideTextInput: {
+      "default": theme.colors.text,
+      error: theme.colors.text,
+      disabled: theme.colors.disabledLightText,
+      readonly: theme.colors.disabledText,
+      filled: theme.colors.text,
+      focused: theme.colors.text
+    },
+    maxLengthLabels: {
+      "default": theme.colors.text,
+      error: theme.colors.danger,
+      disabled: theme.colors.disabledLightText,
+      readonly: theme.colors.disabledText,
+      filled: theme.colors.text,
+      focused: theme.colors.text
+    }
   };
   var space = {
     containerPadding: theme.space.medium,
     labelLeft: theme.space.medium,
     labelTop: theme.lineHeights.small / -2,
+    labelPaddingBottom: theme.space.small,
     labelHorizontalPadding: theme.space.xsmall,
-    inputHorizontalMargin: theme.space.small
+    inputHorizontalMargin: theme.space.small,
+    containerMarginVertical: theme.space.small,
+    errorContainerMarginLeft: theme.space.medium,
+    errorContainerMarginRight: theme.space.xsmall,
+    errorMarginLeft: theme.space.xsmall,
+    maxLengthLabelMarginLeft: theme.space.xsmall
   };
   var fontSizes = {
-    text: theme.fontSizes.large
+    text: theme.fontSizes.medium,
+    labelInsideTextInput: theme.fontSizes.medium,
+    error: theme.fontSizes.small,
+    maxLength: theme.fontSizes.small,
+    asteriskLabel: theme.fontSizes.medium
   };
   var borderWidths = {
-    container: theme.borderWidths.base
+    container: {
+      normal: theme.borderWidths.base,
+      focused: theme.borderWidths.medium
+    }
   };
   var radii = {
     container: theme.radii.medium
@@ -9960,6 +10031,68 @@ var icons = [
 		setId: 0,
 		iconIdx: 94
 	},
+	{
+		icon: {
+			paths: [
+				"M810.667 128h-597.333c-46.933 0-85.333 38.4-85.333 85.333v597.333c0 46.933 38.4 85.333 85.333 85.333h597.333c46.933 0 85.333-38.4 85.333-85.333v-597.333c0-46.933-38.4-85.333-85.333-85.333zM597.333 725.333h-85.333v-341.333h-85.333v-85.333h170.667v426.667z"
+			],
+			attrs: [
+				{
+				}
+			],
+			isMulticolor: false,
+			isMulticolor2: false,
+			grid: 0,
+			tags: [
+				"looks-one"
+			]
+		},
+		attrs: [
+			{
+			}
+		],
+		properties: {
+			order: 2599,
+			id: 306,
+			name: "looks-one",
+			prevSize: 32,
+			code: 59950
+		},
+		setIdx: 0,
+		setId: 0,
+		iconIdx: 95
+	},
+	{
+		icon: {
+			paths: [
+				"M810.667 128h-597.333c-46.933 0-85.333 38.4-85.333 85.333v597.333c0 46.933 38.4 85.333 85.333 85.333h597.333c46.933 0 85.333-38.4 85.333-85.333v-597.333c0-46.933-38.4-85.333-85.333-85.333zM640 469.333c0 47.36-38.4 85.333-85.333 85.333h-85.333v85.333h170.667v85.333h-256v-170.667c0-47.36 38.4-85.333 85.333-85.333h85.333v-85.333h-170.667v-85.333h170.667c46.933 0 85.333 37.973 85.333 85.333v85.333z"
+			],
+			attrs: [
+				{
+				}
+			],
+			isMulticolor: false,
+			isMulticolor2: false,
+			grid: 0,
+			tags: [
+				"looks-two"
+			]
+		},
+		attrs: [
+			{
+			}
+		],
+		properties: {
+			order: 2598,
+			id: 305,
+			name: "looks-two",
+			prevSize: 32,
+			code: 59951
+		},
+		setIdx: 0,
+		setId: 0,
+		iconIdx: 96
+	},
 	{
 		icon: {
 			paths: [
@@ -9983,7 +10116,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 95
+		iconIdx: 97
 	},
 	{
 		icon: {
@@ -10010,7 +10143,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 96
+		iconIdx: 98
 	},
 	{
 		icon: {
@@ -10035,7 +10168,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 97
+		iconIdx: 99
 	},
 	{
 		icon: {
@@ -10060,7 +10193,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 98
+		iconIdx: 100
 	},
 	{
 		icon: {
@@ -10087,7 +10220,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 99
+		iconIdx: 101
 	},
 	{
 		icon: {
@@ -10117,7 +10250,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 100
+		iconIdx: 102
 	},
 	{
 		icon: {
@@ -10142,7 +10275,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 101
+		iconIdx: 103
 	},
 	{
 		icon: {
@@ -10167,7 +10300,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 102
+		iconIdx: 104
 	},
 	{
 		icon: {
@@ -10192,7 +10325,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 103
+		iconIdx: 105
 	},
 	{
 		icon: {
@@ -10217,7 +10350,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 104
+		iconIdx: 106
 	},
 	{
 		icon: {
@@ -10243,7 +10376,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 105
+		iconIdx: 107
 	},
 	{
 		icon: {
@@ -10268,7 +10401,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 106
+		iconIdx: 108
 	},
 	{
 		icon: {
@@ -10293,7 +10426,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 107
+		iconIdx: 109
 	},
 	{
 		icon: {
@@ -10318,7 +10451,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 108
+		iconIdx: 110
 	},
 	{
 		icon: {
@@ -10343,7 +10476,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 109
+		iconIdx: 111
 	},
 	{
 		icon: {
@@ -10368,7 +10501,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 110
+		iconIdx: 112
 	},
 	{
 		icon: {
@@ -10397,7 +10530,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 111
+		iconIdx: 113
 	},
 	{
 		icon: {
@@ -10422,7 +10555,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 112
+		iconIdx: 114
 	},
 	{
 		icon: {
@@ -10447,7 +10580,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 113
+		iconIdx: 115
 	},
 	{
 		icon: {
@@ -10472,7 +10605,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 114
+		iconIdx: 116
 	},
 	{
 		icon: {
@@ -10497,7 +10630,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 115
+		iconIdx: 117
 	},
 	{
 		icon: {
@@ -10522,7 +10655,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 116
+		iconIdx: 118
 	},
 	{
 		icon: {
@@ -10553,7 +10686,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 117
+		iconIdx: 119
 	},
 	{
 		icon: {
@@ -10578,7 +10711,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 118
+		iconIdx: 120
 	},
 	{
 		icon: {
@@ -10609,7 +10742,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 119
+		iconIdx: 121
 	},
 	{
 		icon: {
@@ -10634,7 +10767,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 120
+		iconIdx: 122
 	},
 	{
 		icon: {
@@ -10659,7 +10792,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 121
+		iconIdx: 123
 	},
 	{
 		icon: {
@@ -10684,7 +10817,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 122
+		iconIdx: 124
 	},
 	{
 		icon: {
@@ -10709,7 +10842,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 123
+		iconIdx: 125
 	},
 	{
 		icon: {
@@ -10741,7 +10874,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 124
+		iconIdx: 126
 	},
 	{
 		icon: {
@@ -10766,7 +10899,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 125
+		iconIdx: 127
 	},
 	{
 		icon: {
@@ -10800,7 +10933,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 126
+		iconIdx: 128
 	},
 	{
 		icon: {
@@ -10826,7 +10959,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 127
+		iconIdx: 129
 	},
 	{
 		icon: {
@@ -10851,7 +10984,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 128
+		iconIdx: 130
 	},
 	{
 		icon: {
@@ -10878,7 +11011,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 129
+		iconIdx: 131
 	},
 	{
 		icon: {
@@ -10908,7 +11041,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 130
+		iconIdx: 132
 	},
 	{
 		icon: {
@@ -10933,7 +11066,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 131
+		iconIdx: 133
 	},
 	{
 		icon: {
@@ -10958,7 +11091,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 132
+		iconIdx: 134
 	},
 	{
 		icon: {
@@ -10984,7 +11117,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 133
+		iconIdx: 135
 	},
 	{
 		icon: {
@@ -11009,7 +11142,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 134
+		iconIdx: 136
 	},
 	{
 		icon: {
@@ -11035,7 +11168,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 135
+		iconIdx: 137
 	},
 	{
 		icon: {
@@ -11060,7 +11193,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 136
+		iconIdx: 138
 	},
 	{
 		icon: {
@@ -11085,7 +11218,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 137
+		iconIdx: 139
 	},
 	{
 		icon: {
@@ -11116,7 +11249,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 138
+		iconIdx: 140
 	},
 	{
 		icon: {
@@ -11141,7 +11274,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 139
+		iconIdx: 141
 	},
 	{
 		icon: {
@@ -11166,7 +11299,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 140
+		iconIdx: 142
 	},
 	{
 		icon: {
@@ -11191,7 +11324,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 141
+		iconIdx: 143
 	},
 	{
 		icon: {
@@ -11216,7 +11349,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 142
+		iconIdx: 144
 	},
 	{
 		icon: {
@@ -11242,7 +11375,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 143
+		iconIdx: 145
 	},
 	{
 		icon: {
@@ -11267,7 +11400,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 144
+		iconIdx: 146
 	},
 	{
 		icon: {
@@ -11292,7 +11425,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 145
+		iconIdx: 147
 	},
 	{
 		icon: {
@@ -11322,7 +11455,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 146
+		iconIdx: 148
 	},
 	{
 		icon: {
@@ -11347,7 +11480,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 147
+		iconIdx: 149
 	},
 	{
 		icon: {
@@ -11372,7 +11505,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 148
+		iconIdx: 150
 	},
 	{
 		icon: {
@@ -11397,7 +11530,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 149
+		iconIdx: 151
 	},
 	{
 		icon: {
@@ -11422,7 +11555,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 150
+		iconIdx: 152
 	},
 	{
 		icon: {
@@ -11447,7 +11580,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 151
+		iconIdx: 153
 	},
 	{
 		icon: {
@@ -11472,7 +11605,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 152
+		iconIdx: 154
 	},
 	{
 		icon: {
@@ -11497,7 +11630,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 153
+		iconIdx: 155
 	},
 	{
 		icon: {
@@ -11525,7 +11658,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 154
+		iconIdx: 156
 	},
 	{
 		icon: {
@@ -11550,7 +11683,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 155
+		iconIdx: 157
 	},
 	{
 		icon: {
@@ -11575,7 +11708,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 156
+		iconIdx: 158
 	},
 	{
 		icon: {
@@ -11600,7 +11733,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 157
+		iconIdx: 159
 	},
 	{
 		icon: {
@@ -11625,7 +11758,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 158
+		iconIdx: 160
 	},
 	{
 		icon: {
@@ -11652,7 +11785,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 159
+		iconIdx: 161
 	},
 	{
 		icon: {
@@ -11682,7 +11815,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 160
+		iconIdx: 162
 	},
 	{
 		icon: {
@@ -11707,7 +11840,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 161
+		iconIdx: 163
 	},
 	{
 		icon: {
@@ -11732,7 +11865,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 162
+		iconIdx: 164
 	},
 	{
 		icon: {
@@ -11757,7 +11890,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 163
+		iconIdx: 165
 	},
 	{
 		icon: {
@@ -11782,7 +11915,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 164
+		iconIdx: 166
 	},
 	{
 		icon: {
@@ -11808,7 +11941,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 165
+		iconIdx: 167
 	},
 	{
 		icon: {
@@ -11833,7 +11966,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 166
+		iconIdx: 168
 	},
 	{
 		icon: {
@@ -11859,7 +11992,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 167
+		iconIdx: 169
 	},
 	{
 		icon: {
@@ -11885,7 +12018,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 168
+		iconIdx: 170
 	},
 	{
 		icon: {
@@ -11911,7 +12044,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 169
+		iconIdx: 171
 	},
 	{
 		icon: {
@@ -11938,7 +12071,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 170
+		iconIdx: 172
 	},
 	{
 		icon: {
@@ -11964,7 +12097,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 171
+		iconIdx: 173
 	},
 	{
 		icon: {
@@ -11990,7 +12123,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 172
+		iconIdx: 174
 	},
 	{
 		icon: {
@@ -12017,7 +12150,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 173
+		iconIdx: 175
 	},
 	{
 		icon: {
@@ -12042,7 +12175,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 174
+		iconIdx: 176
 	},
 	{
 		icon: {
@@ -12068,7 +12201,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 175
+		iconIdx: 177
 	},
 	{
 		icon: {
@@ -12094,7 +12227,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 176
+		iconIdx: 178
 	},
 	{
 		icon: {
@@ -12121,7 +12254,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 177
+		iconIdx: 179
 	},
 	{
 		icon: {
@@ -12146,7 +12279,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 178
+		iconIdx: 180
 	},
 	{
 		icon: {
@@ -12172,7 +12305,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 179
+		iconIdx: 181
 	},
 	{
 		icon: {
@@ -12197,7 +12330,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 180
+		iconIdx: 182
 	},
 	{
 		icon: {
@@ -12223,7 +12356,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 181
+		iconIdx: 183
 	},
 	{
 		icon: {
@@ -12251,7 +12384,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 182
+		iconIdx: 184
 	},
 	{
 		icon: {
@@ -12281,7 +12414,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 183
+		iconIdx: 185
 	},
 	{
 		icon: {
@@ -12306,7 +12439,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 184
+		iconIdx: 186
 	},
 	{
 		icon: {
@@ -12331,7 +12464,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 185
+		iconIdx: 187
 	},
 	{
 		icon: {
@@ -12356,7 +12489,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 186
+		iconIdx: 188
 	},
 	{
 		icon: {
@@ -12383,7 +12516,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 187
+		iconIdx: 189
 	},
 	{
 		icon: {
@@ -12408,7 +12541,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 188
+		iconIdx: 190
 	},
 	{
 		icon: {
@@ -12433,7 +12566,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 189
+		iconIdx: 191
 	},
 	{
 		icon: {
@@ -12458,7 +12591,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 190
+		iconIdx: 192
 	},
 	{
 		icon: {
@@ -12484,7 +12617,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 191
+		iconIdx: 193
 	},
 	{
 		icon: {
@@ -12510,7 +12643,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 192
+		iconIdx: 194
 	},
 	{
 		icon: {
@@ -12537,7 +12670,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 193
+		iconIdx: 195
 	},
 	{
 		icon: {
@@ -12563,7 +12696,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 194
+		iconIdx: 196
 	},
 	{
 		icon: {
@@ -12588,7 +12721,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 195
+		iconIdx: 197
 	},
 	{
 		icon: {
@@ -12613,7 +12746,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 196
+		iconIdx: 198
 	},
 	{
 		icon: {
@@ -12638,7 +12771,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 197
+		iconIdx: 199
 	},
 	{
 		icon: {
@@ -12664,7 +12797,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 198
+		iconIdx: 200
 	},
 	{
 		icon: {
@@ -12689,7 +12822,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 199
+		iconIdx: 201
 	},
 	{
 		icon: {
@@ -12717,7 +12850,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 200
+		iconIdx: 202
 	},
 	{
 		icon: {
@@ -12743,7 +12876,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 201
+		iconIdx: 203
 	},
 	{
 		icon: {
@@ -12768,7 +12901,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 202
+		iconIdx: 204
 	},
 	{
 		icon: {
@@ -12796,7 +12929,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 203
+		iconIdx: 205
 	},
 	{
 		icon: {
@@ -12824,7 +12957,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 204
+		iconIdx: 206
 	},
 	{
 		icon: {
@@ -12852,7 +12985,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 205
+		iconIdx: 207
 	},
 	{
 		icon: {
@@ -12880,7 +13013,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 206
+		iconIdx: 208
 	},
 	{
 		icon: {
@@ -12905,7 +13038,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 207
+		iconIdx: 209
 	},
 	{
 		icon: {
@@ -12930,7 +13063,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 208
+		iconIdx: 210
 	},
 	{
 		icon: {
@@ -12957,7 +13090,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 209
+		iconIdx: 211
 	},
 	{
 		icon: {
@@ -12983,7 +13116,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 210
+		iconIdx: 212
 	},
 	{
 		icon: {
@@ -13008,7 +13141,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 211
+		iconIdx: 213
 	},
 	{
 		icon: {
@@ -13033,7 +13166,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 212
+		iconIdx: 214
 	},
 	{
 		icon: {
@@ -13058,7 +13191,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 213
+		iconIdx: 215
 	},
 	{
 		icon: {
@@ -13084,7 +13217,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 214
+		iconIdx: 216
 	},
 	{
 		icon: {
@@ -13109,7 +13242,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 215
+		iconIdx: 217
 	},
 	{
 		icon: {
@@ -13134,7 +13267,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 216
+		iconIdx: 218
 	},
 	{
 		icon: {
@@ -13159,7 +13292,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 217
+		iconIdx: 219
 	},
 	{
 		icon: {
@@ -13185,7 +13318,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 218
+		iconIdx: 220
 	},
 	{
 		icon: {
@@ -13210,7 +13343,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 219
+		iconIdx: 221
 	},
 	{
 		icon: {
@@ -13235,7 +13368,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 220
+		iconIdx: 222
 	},
 	{
 		icon: {
@@ -13260,7 +13393,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 221
+		iconIdx: 223
 	},
 	{
 		icon: {
@@ -13288,7 +13421,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 222
+		iconIdx: 224
 	},
 	{
 		icon: {
@@ -13313,7 +13446,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 223
+		iconIdx: 225
 	},
 	{
 		icon: {
@@ -13341,7 +13474,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 224
+		iconIdx: 226
 	},
 	{
 		icon: {
@@ -13366,7 +13499,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 225
+		iconIdx: 227
 	},
 	{
 		icon: {
@@ -13391,7 +13524,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 226
+		iconIdx: 228
 	},
 	{
 		icon: {
@@ -13416,7 +13549,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 227
+		iconIdx: 229
 	},
 	{
 		icon: {
@@ -13441,7 +13574,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 228
+		iconIdx: 230
 	},
 	{
 		icon: {
@@ -13466,7 +13599,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 229
+		iconIdx: 231
 	},
 	{
 		icon: {
@@ -13491,7 +13624,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 230
+		iconIdx: 232
 	},
 	{
 		icon: {
@@ -13516,7 +13649,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 231
+		iconIdx: 233
 	},
 	{
 		icon: {
@@ -13541,7 +13674,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 232
+		iconIdx: 234
 	},
 	{
 		icon: {
@@ -13566,7 +13699,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 233
+		iconIdx: 235
 	},
 	{
 		icon: {
@@ -13591,7 +13724,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 234
+		iconIdx: 236
 	},
 	{
 		icon: {
@@ -13618,7 +13751,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 235
+		iconIdx: 237
 	},
 	{
 		icon: {
@@ -13643,7 +13776,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 236
+		iconIdx: 238
 	},
 	{
 		icon: {
@@ -13668,7 +13801,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 237
+		iconIdx: 239
 	},
 	{
 		icon: {
@@ -13693,7 +13826,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 238
+		iconIdx: 240
 	},
 	{
 		icon: {
@@ -13718,7 +13851,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 239
+		iconIdx: 241
 	},
 	{
 		icon: {
@@ -13743,7 +13876,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 240
+		iconIdx: 242
 	},
 	{
 		icon: {
@@ -13772,7 +13905,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 241
+		iconIdx: 243
 	},
 	{
 		icon: {
@@ -13801,7 +13934,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 242
+		iconIdx: 244
 	},
 	{
 		icon: {
@@ -13826,7 +13959,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 243
+		iconIdx: 245
 	},
 	{
 		icon: {
@@ -13851,7 +13984,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 244
+		iconIdx: 246
 	},
 	{
 		icon: {
@@ -13878,7 +14011,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 245
+		iconIdx: 247
 	},
 	{
 		icon: {
@@ -13905,7 +14038,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 246
+		iconIdx: 248
 	},
 	{
 		icon: {
@@ -13930,7 +14063,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 247
+		iconIdx: 249
 	},
 	{
 		icon: {
@@ -13960,7 +14093,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 248
+		iconIdx: 250
 	},
 	{
 		icon: {
@@ -13985,7 +14118,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 249
+		iconIdx: 251
 	},
 	{
 		icon: {
@@ -14010,7 +14143,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 250
+		iconIdx: 252
 	},
 	{
 		icon: {
@@ -14038,7 +14171,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 251
+		iconIdx: 253
 	},
 	{
 		icon: {
@@ -14063,7 +14196,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 252
+		iconIdx: 254
 	},
 	{
 		icon: {
@@ -14094,7 +14227,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 253
+		iconIdx: 255
 	},
 	{
 		icon: {
@@ -14120,7 +14253,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 254
+		iconIdx: 256
 	},
 	{
 		icon: {
@@ -14145,7 +14278,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 255
+		iconIdx: 257
 	},
 	{
 		icon: {
@@ -14170,7 +14303,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 256
+		iconIdx: 258
 	},
 	{
 		icon: {
@@ -14198,7 +14331,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 257
+		iconIdx: 259
 	},
 	{
 		icon: {
@@ -14223,7 +14356,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 258
+		iconIdx: 260
 	},
 	{
 		icon: {
@@ -14248,7 +14381,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 259
+		iconIdx: 261
 	},
 	{
 		icon: {
@@ -14278,7 +14411,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 260
+		iconIdx: 262
 	},
 	{
 		icon: {
@@ -14311,7 +14444,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 261
+		iconIdx: 263
 	},
 	{
 		icon: {
@@ -14336,7 +14469,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 262
+		iconIdx: 264
 	},
 	{
 		icon: {
@@ -14368,7 +14501,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 263
+		iconIdx: 265
 	},
 	{
 		icon: {
@@ -14393,7 +14526,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 264
+		iconIdx: 266
 	},
 	{
 		icon: {
@@ -14418,7 +14551,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 265
+		iconIdx: 267
 	},
 	{
 		icon: {
@@ -14443,7 +14576,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 266
+		iconIdx: 268
 	},
 	{
 		icon: {
@@ -14468,7 +14601,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 267
+		iconIdx: 269
 	},
 	{
 		icon: {
@@ -14493,7 +14626,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 268
+		iconIdx: 270
 	},
 	{
 		icon: {
@@ -14518,7 +14651,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 269
+		iconIdx: 271
 	},
 	{
 		icon: {
@@ -14543,7 +14676,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 270
+		iconIdx: 272
 	},
 	{
 		icon: {
@@ -14568,7 +14701,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 271
+		iconIdx: 273
 	},
 	{
 		icon: {
@@ -14595,7 +14728,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 272
+		iconIdx: 274
 	},
 	{
 		icon: {
@@ -14620,7 +14753,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 273
+		iconIdx: 275
 	},
 	{
 		icon: {
@@ -14645,7 +14778,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 274
+		iconIdx: 276
 	},
 	{
 		icon: {
@@ -14674,7 +14807,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 275
+		iconIdx: 277
 	},
 	{
 		icon: {
@@ -14699,7 +14832,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 276
+		iconIdx: 278
 	},
 	{
 		icon: {
@@ -14724,7 +14857,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 277
+		iconIdx: 279
 	},
 	{
 		icon: {
@@ -14749,7 +14882,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 278
+		iconIdx: 280
 	},
 	{
 		icon: {
@@ -14774,7 +14907,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 279
+		iconIdx: 281
 	},
 	{
 		icon: {
@@ -14799,7 +14932,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 280
+		iconIdx: 282
 	},
 	{
 		icon: {
@@ -14824,7 +14957,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 281
+		iconIdx: 283
 	},
 	{
 		icon: {
@@ -14852,7 +14985,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 282
+		iconIdx: 284
 	},
 	{
 		icon: {
@@ -14877,7 +15010,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 283
+		iconIdx: 285
 	},
 	{
 		icon: {
@@ -14909,7 +15042,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 284
+		iconIdx: 286
 	},
 	{
 		icon: {
@@ -14934,7 +15067,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 285
+		iconIdx: 287
 	},
 	{
 		icon: {
@@ -14962,7 +15095,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 286
+		iconIdx: 288
 	},
 	{
 		icon: {
@@ -14987,7 +15120,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 287
+		iconIdx: 289
 	},
 	{
 		icon: {
@@ -15015,7 +15148,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 288
+		iconIdx: 290
 	},
 	{
 		icon: {
@@ -15040,7 +15173,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 289
+		iconIdx: 291
 	},
 	{
 		icon: {
@@ -15066,7 +15199,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 290
+		iconIdx: 292
 	},
 	{
 		icon: {
@@ -15094,7 +15227,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 291
+		iconIdx: 293
 	},
 	{
 		icon: {
@@ -15119,7 +15252,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 292
+		iconIdx: 294
 	},
 	{
 		icon: {
@@ -15144,7 +15277,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 293
+		iconIdx: 295
 	},
 	{
 		icon: {
@@ -15171,7 +15304,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 294
+		iconIdx: 296
 	},
 	{
 		icon: {
@@ -15196,7 +15329,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 295
+		iconIdx: 297
 	},
 	{
 		icon: {
@@ -15228,7 +15361,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 296
+		iconIdx: 298
 	},
 	{
 		icon: {
@@ -15254,7 +15387,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 297
+		iconIdx: 299
 	},
 	{
 		icon: {
@@ -15285,7 +15418,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 298
+		iconIdx: 300
 	},
 	{
 		icon: {
@@ -15310,7 +15443,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 299
+		iconIdx: 301
 	},
 	{
 		icon: {
@@ -15335,7 +15468,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 300
+		iconIdx: 302
 	},
 	{
 		icon: {
@@ -15366,7 +15499,7 @@ var icons = [
 		},
 		setIdx: 0,
 		setId: 0,
-		iconIdx: 301
+		iconIdx: 303
 	}
 ];
 var height = 1024;
@@ -15426,7 +15559,8 @@ var COLOR_INTENTS = {
   danger: 'danger',
   success: 'success',
   warning: 'warning',
-  'disabled-text': 'disabledText'
+  'disabled-text': 'disabledText',
+  'text-inverted': 'invertedText'
 };
 var StyledHeroIcon = index$5(HeroIcon)(function (_ref) {
   var themeIntent = _ref.themeIntent,
@@ -15499,7 +15633,7 @@ var Typography = {
   Text: Text
 };
 
-var Container$2 = index$5(ReactNative.View)(function (_ref) {
+var Container$1 = index$5(ReactNative.View)(function (_ref) {
   var theme = _ref.theme,
       _ref$themeVariant = _ref.themeVariant,
       themeVariant = _ref$themeVariant === void 0 ? 'default' : _ref$themeVariant,
@@ -15571,7 +15705,7 @@ var Alert = function Alert(_ref) {
       variant = _ref$variant === void 0 ? 'default' : _ref$variant,
       style = _ref.style,
       testID = _ref.testID;
-  return /*#__PURE__*/React__default["default"].createElement(Container$2, {
+  return /*#__PURE__*/React__default["default"].createElement(Container$1, {
     themeVariant: variant,
     themeIntent: intent,
     style: style,
@@ -15817,7 +15951,7 @@ var Badge$1 = Object.assign(Badge, {
   Status: Status
 });
 
-var IconList = ['activate', 'add-person', 'adjustment', 'alignment', 'bank', 'bell', 'billing', 'bookmark', 'box-check', 'box', 'buildings', 'cake', 'calendar-clock', 'calendar', 'candy-box-menu', 'carat-down-small', 'carat-down', 'carat-left', 'carat-right', 'carat-up', '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', 'cloud-download', 'cloud-upload', 'cog', 'coin', 'contacts', 'credit-card', 'diamond', 'direction-arrows', 'directory', 'document', 'dollar-coin-shine', 'double-buildings', 'edit-template', 'envelope', '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', 'folder-user', 'folder', 'funnel-filter', 'global-dollar', 'globe', 'graduation-cap', 'graph', 'happy-sun', 'health-bag', 'heart', 'home', 'image', 'import', 'incident-siren', 'instapay', 'list', 'loading', 'loading-2', 'location', 'lock', 'media-content', 'menu', 'moneybag', 'moon', 'multiple-stars', 'multiple-users', 'node', 'open-folder', 'paperclip', 'payment-summary', 'pencil', 'phone', 'piggy-bank', 'plane', 'play-circle', 'print', 'raising-hands', 'reply', 'reschedule', 'rostering', 'save', 'schedule', 'search-person', 'send', 'speaker', 'star-medal', 'star', 'steps-circle', 'stopwatch', 'suitcase', 'survey', 'swag', 'switch', 'tag', 'target', 'teams', 'timesheet', 'touch-id', 'trash-bin', 'unlock', 'user', 'video-1', 'video-2', 'activate-outlined', 'add-person-outlined', 'add-section-outlined', 'add-time-outlined', 'add', 'adjustment-outlined', 'alignment-2-outlined', 'alignment-outlined', 'all-caps', 'arrow-down', 'arrow-left', 'arrow-right', 'arrow-up', 'at-sign', 'bell-outlined', 'billing-outlined', 'body-outlined', 'bold', 'bookmark-outlined', 'box-check-outlined', 'box-outlined', 'bullet-points', 'cake-outlined', 'calendar-dates-outlined', 'calendar-star-outlined', 'camera-outlined', 'cancel', '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', 'credit-card-outlined', 'direction-arrows-outlined', 'directory-outlined', 'document-outlined', 'dollar-coin-shine-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', '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-download-outlined', 'file-export-outlined', 'file-lock-outlined', 'file-outlined', 'file-search-outlined', 'file-secured-outlined', 'file-verified-outlined', 'folder-outlined', 'folder-user-outlined', 'funnel-filter-outline', 'graph-outlined', 'happy-sun-outlined', 'health-bag-outlined', 'heart-outlined', 'home-outlined', 'image-outlined', 'import-outlined', 'instapay-outlined', 'italic', 'link-1', 'link-2', 'list-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', 'node-outlined', 'number-points', 'number', 'payment-summary-outlined', 'payslip-outlined', 'pencil-outlined', 'percentage', 'phone-outlined', 'piggy-bank-outlined', 'plane-outlined', 'play-circle-outlined', 'print-outlined', 'qr-code-outlined', 're-assign', 'redeem', 'refresh', 'remove', 'reply-outlined', 'restart', 'return-arrow', 'rostering-outlined', 'save-outlined', 'schedule-outlined', 'search-outlined', 'send-outlined', 'share-1', 'share-2', 'single-down-arrow', 'single-left-arrow', 'single-right-arrow', 'single-up-arrow', 'speaker-outlined', 'star-outlined', 'stopwatch-outlined', 'strikethrough', 'suitcase-outlined', 'survey-outlined', 'switch-outlined', 'sync', 'target-outlined', 'timesheet-outlined', 'transfer', 'trash-bin-outlined', 'unavailable', 'underline', 'unlock-outlined', 'upload-outlined', 'user-circle-outlined', 'user-outlined', 'user-rectangle-outlined', 'video-1-outlined', 'video-2-outlined', 'wallet-outlined', 'warning'];
+var IconList = ['activate', 'add-person', 'adjustment', 'alignment', 'bank', 'bell', 'billing', 'bookmark', 'box-check', 'box', 'buildings', 'cake', 'calendar-clock', 'calendar', 'candy-box-menu', 'carat-down-small', 'carat-down', 'carat-left', 'carat-right', 'carat-up', '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', 'cloud-download', 'cloud-upload', 'cog', 'coin', 'contacts', 'credit-card', 'diamond', 'direction-arrows', 'directory', 'document', 'dollar-coin-shine', 'double-buildings', 'edit-template', 'envelope', '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', 'folder-user', 'folder', 'funnel-filter', 'global-dollar', 'globe', 'graduation-cap', 'graph', 'happy-sun', 'health-bag', 'heart', 'home', 'image', 'import', 'incident-siren', 'instapay', 'list', 'loading', 'loading-2', 'location', 'lock', 'looks-one', 'looks-two', 'media-content', 'menu', 'moneybag', 'moon', 'multiple-stars', 'multiple-users', 'node', 'open-folder', 'paperclip', 'payment-summary', 'pencil', 'phone', 'piggy-bank', 'plane', 'play-circle', 'print', 'raising-hands', 'reply', 'reschedule', 'rostering', 'save', 'schedule', 'search-person', 'send', 'speaker', 'star-medal', 'star', 'steps-circle', 'stopwatch', 'suitcase', 'survey', 'swag', 'switch', 'tag', 'target', 'teams', 'timesheet', 'touch-id', 'trash-bin', 'unlock', 'user', 'video-1', 'video-2', 'activate-outlined', 'add-person-outlined', 'add-section-outlined', 'add-time-outlined', 'add', 'adjustment-outlined', 'alignment-2-outlined', 'alignment-outlined', 'all-caps', 'arrow-down', 'arrow-left', 'arrow-right', 'arrow-up', 'at-sign', 'bell-outlined', 'billing-outlined', 'body-outlined', 'bold', 'bookmark-outlined', 'box-check-outlined', 'box-outlined', 'bullet-points', 'cake-outlined', 'calendar-dates-outlined', 'calendar-star-outlined', 'camera-outlined', 'cancel', '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', 'credit-card-outlined', 'direction-arrows-outlined', 'directory-outlined', 'document-outlined', 'dollar-coin-shine-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', '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-download-outlined', 'file-export-outlined', 'file-lock-outlined', 'file-outlined', 'file-search-outlined', 'file-secured-outlined', 'file-verified-outlined', 'folder-outlined', 'folder-user-outlined', 'funnel-filter-outline', 'graph-outlined', 'happy-sun-outlined', 'health-bag-outlined', 'heart-outlined', 'home-outlined', 'image-outlined', 'import-outlined', 'instapay-outlined', 'italic', 'link-1', 'link-2', 'list-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', 'node-outlined', 'number-points', 'number', 'payment-summary-outlined', 'payslip-outlined', 'pencil-outlined', 'percentage', 'phone-outlined', 'piggy-bank-outlined', 'plane-outlined', 'play-circle-outlined', 'print-outlined', 'qr-code-outlined', 're-assign', 'redeem', 'refresh', 'remove', 'reply-outlined', 'restart', 'return-arrow', 'rostering-outlined', 'save-outlined', 'schedule-outlined', 'search-outlined', 'send-outlined', 'share-1', 'share-2', 'single-down-arrow', 'single-left-arrow', 'single-right-arrow', 'single-up-arrow', 'speaker-outlined', 'star-outlined', 'stopwatch-outlined', 'strikethrough', 'suitcase-outlined', 'survey-outlined', 'switch-outlined', 'sync', 'target-outlined', 'timesheet-outlined', 'transfer', 'trash-bin-outlined', 'unavailable', 'underline', 'unlock-outlined', 'upload-outlined', 'user-circle-outlined', 'user-outlined', 'user-rectangle-outlined', 'video-1-outlined', 'video-2-outlined', 'wallet-outlined', 'warning'];
 
 var isHeroIcon = function isHeroIcon(x) {
   return IconList.includes(x);
@@ -16096,12 +16230,15 @@ var StyledLoadingDot = index$5(ReactNative.View)(function (_ref2) {
         };
 
       case 'outlined-primary':
+      case 'text-primary':
         return genLoadingIndicatorStyles(theme, 'primary');
 
       case 'outlined-secondary':
+      case 'text-secondary':
         return genLoadingIndicatorStyles(theme, 'secondary');
 
       case 'outlined-danger':
+      case 'text-danger':
         return genLoadingIndicatorStyles(theme, 'danger');
     }
   };
@@ -16302,6 +16439,31 @@ var genOutlineTextStyles = function genOutlineTextStyles(theme, intent, pressed,
   }, textColorStyling());
 };
 
+var genTextVariantTextStyles = function genTextVariantTextStyles(theme, intent, pressed, disabled) {
+  var textColorStyling = function textColorStyling() {
+    if (disabled) {
+      return {
+        color: theme.__hd__.button.colors.disabledText
+      };
+    }
+
+    if (pressed) {
+      return {
+        color: theme.__hd__.button.colors[PRESSED_COLORS[intent]]
+      };
+    }
+
+    return {
+      color: theme.__hd__.button.colors[intent]
+    };
+  };
+
+  return _objectSpread2({
+    fontSize: theme.__hd__.button.fontSize.textVariant,
+    lineHeight: theme.__hd__.button.lineHeight["default"]
+  }, textColorStyling());
+};
+
 var StyledButtonContainer = index$5(ReactNative.View)(function (_ref) {
   var _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
@@ -16331,6 +16493,19 @@ var StyledButtonContainer = index$5(ReactNative.View)(function (_ref) {
 
     case 'outlined-danger':
       return genOutlineContainerStyles(theme, 'danger', pressed, disabled);
+
+    case 'text-primary':
+    case 'text-secondary':
+    case 'text-danger':
+      return {
+        width: '100%',
+        flexDirection: 'row',
+        justifyContent: 'center',
+        alignItems: 'center',
+        padding: theme.__hd__.button.space.buttonPadding,
+        borderWidth: 0,
+        backgroundColor: 'transparent'
+      };
   }
 });
 var StyledButtonText = index$5(Typography.Text)(function (_ref2) {
@@ -16365,6 +16540,15 @@ var StyledButtonText = index$5(Typography.Text)(function (_ref2) {
 
       case 'outlined-danger':
         return genOutlineTextStyles(theme, 'danger', pressed, disabled);
+
+      case 'text-primary':
+        return genTextVariantTextStyles(theme, 'primary', pressed, disabled);
+
+      case 'text-secondary':
+        return genTextVariantTextStyles(theme, 'secondary', pressed, disabled);
+
+      case 'text-danger':
+        return genTextVariantTextStyles(theme, 'danger', pressed, disabled);
     }
   };
 
@@ -16418,6 +16602,15 @@ var StyledButtonIcon = index$5(Icon)(function (_ref4) {
 
       case 'outlined-danger':
         return genOutlineTextStyles(theme, 'danger', pressed, disabled);
+
+      case 'text-primary':
+        return genTextVariantTextStyles(theme, 'primary', pressed, disabled);
+
+      case 'text-secondary':
+        return genTextVariantTextStyles(theme, 'secondary', pressed, disabled);
+
+      case 'text-danger':
+        return genTextVariantTextStyles(theme, 'danger', pressed, disabled);
     }
   };
 
@@ -16436,6 +16629,11 @@ var OUTLINED_VARIANTS = {
   secondary: 'outlined-secondary',
   danger: 'outlined-danger'
 };
+var TEXT_VARIANTS = {
+  primary: 'text-primary',
+  secondary: 'text-secondary',
+  danger: 'text-danger'
+};
 var getThemeVariant = function getThemeVariant(variant, intent) {
   switch (variant) {
     case 'basic-transparent':
@@ -16446,6 +16644,9 @@ var getThemeVariant = function getThemeVariant(variant, intent) {
 
     case 'outlined':
       return OUTLINED_VARIANTS[intent];
+
+    case 'text':
+      return TEXT_VARIANTS[intent];
   }
 };
 
@@ -16530,8 +16731,65 @@ var IconButton = function IconButton(_ref) {
   }));
 };
 
+var ButtonContainer = index$5(ReactNative.TouchableOpacity)(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    width: '100%',
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: theme.__hd__.button.space.utilityPadding,
+    borderRadius: theme.__hd__.button.radii.utilityRadii,
+    backgroundColor: theme.__hd__.button.colors.utilityBackground
+  };
+});
+var IconWrapper = index$5(ReactNative.View)(function (_ref2) {
+  var theme = _ref2.theme;
+  return {
+    paddingRight: theme.__hd__.button.space.utilityIconPadding
+  };
+});
+var ButtonText = index$5(Typography.Text)(function (_ref3) {
+  var theme = _ref3.theme;
+  return {
+    flexShrink: 1,
+    textAlign: 'center',
+    fontSize: theme.__hd__.button.fontSize.utility,
+    fontFamily: theme.__hd__.button.fonts["default"]
+  };
+});
+
+var TEXT_INTENTS = {
+  primary: 'primary',
+  text: 'body'
+};
+
+var UtilityButton = function UtilityButton(_ref) {
+  var icon = _ref.icon,
+      onPress = _ref.onPress,
+      text = _ref.text,
+      testID = _ref.testID,
+      _ref$intent = _ref.intent,
+      intent = _ref$intent === void 0 ? 'text' : _ref$intent,
+      style = _ref.style,
+      hitSlop = _ref.hitSlop;
+  return /*#__PURE__*/React__default["default"].createElement(ButtonContainer, {
+    style: style,
+    onPress: onPress,
+    testID: testID,
+    hitSlop: hitSlop
+  }, /*#__PURE__*/React__default["default"].createElement(IconWrapper, null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+    icon: icon,
+    intent: intent,
+    testID: "".concat(testID, "-icon")
+  })), /*#__PURE__*/React__default["default"].createElement(ButtonText, {
+    intent: TEXT_INTENTS[intent]
+  }, text));
+};
+
 var CompoundButton = Button;
 CompoundButton.Icon = IconButton;
+CompoundButton.Utility = UtilityButton;
 
 var Header = function Header(_ref) {
   var content = _ref.content,
@@ -16667,7 +16925,6 @@ var StyledDataCard = index$5(ReactNative.View)(function (_ref) {
   return {
     borderRadius: theme.__hd__.card.radii["default"],
     overflow: 'hidden',
-    flex: 1,
     flexDirection: 'row'
   };
 });
@@ -16676,7 +16933,7 @@ var Indicator = index$5(ReactNative.View)(function (_ref2) {
       themeIntent = _ref2.themeIntent;
   return {
     backgroundColor: theme.__hd__.card.colors.indicator[themeIntent],
-    width: scale(16),
+    width: theme.__hd__.card.sizes.indicatorWidth,
     height: '100%'
   };
 });
@@ -16703,7 +16960,6 @@ var StyledCard = index$5(ReactNative.View)(function (_ref) {
     overflow: 'hidden'
   };
   var dataStyles = {
-    flex: 1,
     flexDirection: 'row'
   };
 
@@ -16719,7 +16975,7 @@ var LeftDataCard = index$5(ReactNative.View)(function (_ref2) {
   var theme = _ref2.theme;
   return {
     backgroundColor: theme.__hd__.card.colors.dataCardIndicator,
-    width: scale(16),
+    width: theme.__hd__.card.sizes.indicatorWidth,
     height: '100%'
   };
 });
@@ -16898,7 +17154,7 @@ function ContentNavigator(_ref) {
 }
 
 var AnimatedPressable = ReactNative.Animated.createAnimatedComponent(ReactNative.Pressable);
-var StyledContainer$1 = index$5(ReactNative.View)(function (_ref) {
+var StyledContainer$2 = index$5(ReactNative.View)(function (_ref) {
   var theme = _ref.theme,
       enableShadow = _ref.enableShadow;
   return _objectSpread2(_objectSpread2({}, ReactNative.StyleSheet.absoluteFillObject), {}, {
@@ -16963,7 +17219,7 @@ var Drawer = function Drawer(_ref) {
       return animation.stop();
     };
   }, [visible]);
-  return /*#__PURE__*/React__default["default"].createElement(StyledContainer$1, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledContainer$2, {
     testID: testID,
     enableShadow: enableShadow,
     pointerEvents: "box-none"
@@ -17149,7 +17405,7 @@ var ActionItem = function ActionItem(_ref) {
   }), /*#__PURE__*/React__default["default"].createElement(StyledActionItemText, null, title));
 };
 
-var StyledContainer = index$5(ReactNative.View)({
+var StyledContainer$1 = index$5(ReactNative.View)({
   position: 'absolute',
   left: 0,
   right: 0,
@@ -17230,7 +17486,7 @@ var ActionGroup = function ActionGroup(_ref2) {
     inputRange: [0, 1],
     outputRange: [0, 0.9]
   });
-  return /*#__PURE__*/React__default["default"].createElement(StyledContainer, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledContainer$1, {
     testID: testID,
     pointerEvents: "box-none",
     style: style
@@ -18081,22 +18337,18 @@ var OptionList$1 = function OptionList(_ref) {
   }));
 };
 
-var Container$1 = index$5(ReactNative.View)(function (_ref) {
+var StyledContainer = index$5(ReactNative.View)(function (_ref) {
   var theme = _ref.theme;
   return {
-    position: 'relative',
     width: '100%',
-    borderWidth: theme.__hd__.textInput.borderWidths.container,
-    borderRadius: theme.__hd__.textInput.radii.container,
-    padding: theme.__hd__.textInput.space.containerPadding,
-    flexDirection: 'row',
-    alignItems: 'center'
+    marginVertical: theme.__hd__.textInput.space.containerMarginVertical
   };
 });
-var Label = index$5(Typography.Text)(function (_ref2) {
+var StyledLabelContainer = index$5(ReactNative.View)(function (_ref2) {
   var theme = _ref2.theme;
   return {
     position: 'absolute',
+    flexDirection: 'row',
     left: theme.__hd__.textInput.space.labelLeft,
     top: theme.__hd__.textInput.space.labelTop,
     backgroundColor: theme.__hd__.textInput.colors.labelBackground,
@@ -18104,48 +18356,279 @@ var Label = index$5(Typography.Text)(function (_ref2) {
     paddingHorizontal: theme.__hd__.textInput.space.labelHorizontalPadding
   };
 });
-var StyledTextInput = index$5(ReactNative.TextInput)(function (_ref3) {
-  var theme = _ref3.theme;
+var StyledLabel = index$5(Typography.Text)(function (_ref3) {
+  var theme = _ref3.theme,
+      themeVariant = _ref3.themeVariant;
+  return {
+    color: theme.__hd__.textInput.colors.labels[themeVariant]
+  };
+});
+var StyledAsteriskLabel = index$5(Typography.Text)(function (_ref4) {
+  var theme = _ref4.theme,
+      themeVariant = _ref4.themeVariant;
+  return {
+    color: theme.__hd__.textInput.colors.asterisks[themeVariant]
+  };
+});
+var StyledLabelContainerInsideTextInput = index$5(ReactNative.View)(function () {
+  return _objectSpread2({
+    flexDirection: 'row',
+    zIndex: 9999,
+    alignItems: 'center'
+  }, ReactNative.StyleSheet.absoluteFillObject);
+});
+var StyledLabelInsideTextInput = index$5(Typography.Text)(function (_ref5) {
+  var theme = _ref5.theme,
+      themeVariant = _ref5.themeVariant;
+  return {
+    textAlignVertical: 'center',
+    alignContent: 'center',
+    fontSize: theme.__hd__.textInput.fontSizes.labelInsideTextInput,
+    alignItems: 'center',
+    color: theme.__hd__.textInput.colors.labelsInsideTextInput[themeVariant]
+  };
+});
+var StyledAsteriskLabelInsideTextInput = index$5(Typography.Text)(function (_ref6) {
+  var theme = _ref6.theme,
+      themeVariant = _ref6.themeVariant;
+  return {
+    color: theme.__hd__.textInput.colors.asterisks[themeVariant],
+    fontSize: theme.__hd__.textInput.fontSizes.asteriskLabel
+  };
+});
+var StyledErrorContainer = index$5(ReactNative.View)(function (_ref7) {
+  var theme = _ref7.theme;
+  return {
+    marginLeft: theme.__hd__.textInput.space.errorContainerMarginLeft,
+    marginRight: theme.__hd__.textInput.space.errorContainerMarginRight,
+    flexDirection: 'row',
+    alignItems: 'center',
+    flex: 1,
+    flexGrow: 4
+  };
+});
+var StyledError = index$5(Typography.Text)(function (_ref8) {
+  var theme = _ref8.theme;
+  return {
+    color: theme.__hd__.textInput.colors.error,
+    fontSize: theme.__hd__.textInput.fontSizes.error,
+    marginLeft: theme.__hd__.textInput.space.errorMarginLeft
+  };
+});
+var StyledMaxLengthMessage = index$5(Typography.Text)(function (_ref9) {
+  var theme = _ref9.theme,
+      themeVariant = _ref9.themeVariant;
   return {
+    color: theme.__hd__.textInput.colors.maxLengthLabels[themeVariant],
+    fontSize: theme.__hd__.textInput.fontSizes.maxLength,
+    marginRight: theme.__hd__.textInput.space.maxLengthLabelMarginLeft,
+    alignSelf: 'flex-end',
     flex: 1,
+    flexGrow: 1,
+    textAlign: 'right'
+  };
+});
+var StyledHelperText = index$5(Typography.Text)(function (_ref10) {
+  var theme = _ref10.theme;
+  return {
+    fontSize: theme.__hd__.textInput.fontSizes.error,
+    marginLeft: theme.__hd__.textInput.space.errorMarginLeft
+  };
+});
+var StyledTextInput = index$5(ReactNative.TextInput)(function (_ref11) {
+  var theme = _ref11.theme;
+  return {
+    textAlignVertical: 'center',
     fontSize: theme.__hd__.textInput.fontSizes.text,
+    alignSelf: 'stretch',
+    flexGrow: 2,
     marginHorizontal: theme.__hd__.textInput.space.inputHorizontalMargin
   };
 });
+var StyledBorderBackDrop = index$5(ReactNative.View)(function (_ref12) {
+  var _theme$__hd__$textInp;
+
+  var theme = _ref12.theme,
+      themeVariant = _ref12.themeVariant;
+  return _objectSpread2(_objectSpread2({}, ReactNative.StyleSheet.absoluteFillObject), {}, {
+    borderWidth: themeVariant === 'focused' ? theme.__hd__.textInput.borderWidths.container.focused : theme.__hd__.textInput.borderWidths.container.normal,
+    borderRadius: theme.__hd__.textInput.radii.container,
+    borderColor: (_theme$__hd__$textInp = theme.__hd__.textInput.colors.borders[themeVariant]) !== null && _theme$__hd__$textInp !== void 0 ? _theme$__hd__$textInp : theme.__hd__.textInput.colors.borders["default"]
+  });
+});
+var StyledTextInputContainer = index$5(ReactNative.View)(function (_ref13) {
+  var theme = _ref13.theme;
+  return {
+    flexDirection: 'row',
+    alignItems: 'center',
+    padding: theme.__hd__.textInput.space.containerPadding
+  };
+});
+var StyledTextInputAndLabelContainer = index$5(ReactNative.View)(function () {
+  return {
+    flexDirection: 'row',
+    alignItems: 'center',
+    alignSelf: 'stretch',
+    flexGrow: 2
+  };
+});
+var StyledErrorAndHelpTextContainer = index$5(ReactNative.View)(function () {
+  return {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between'
+  };
+});
 
-var _excluded$1 = ["label", "prefix", "suffix", "style", "textStyle", "testID", "accessibilityLabelledBy"];
+var _excluded$1 = ["label", "prefix", "suffix", "style", "textStyle", "testID", "accessibilityLabelledBy", "error", "required", "editable", "disabled", "maxLength", "helpText", "value"];
+var getVariant = function getVariant(_ref) {
+  var disabled = _ref.disabled,
+      error = _ref.error,
+      editable = _ref.editable,
+      isFocused = _ref.isFocused,
+      isEmptyValue = _ref.isEmptyValue;
 
-var TextInput = function TextInput(_ref) {
-  var label = _ref.label,
-      prefix = _ref.prefix,
-      suffix = _ref.suffix,
-      style = _ref.style,
-      textStyle = _ref.textStyle,
-      testID = _ref.testID,
-      accessibilityLabelledBy = _ref.accessibilityLabelledBy,
-      nativeProps = _objectWithoutProperties$1(_ref, _excluded$1);
+  if (disabled) {
+    return 'disabled';
+  }
 
-  return /*#__PURE__*/React__default["default"].createElement(Container$1, {
+  if (error) {
+    return 'error';
+  }
+
+  if (!editable) {
+    return 'readonly';
+  }
+
+  if (isFocused) {
+    return 'focused';
+  }
+
+  if (!isEmptyValue) {
+    return 'filled';
+  }
+
+  return 'default';
+};
+
+var TextInput = function TextInput(_ref2) {
+  var label = _ref2.label,
+      prefix = _ref2.prefix,
+      suffix = _ref2.suffix,
+      style = _ref2.style,
+      textStyle = _ref2.textStyle,
+      testID = _ref2.testID,
+      accessibilityLabelledBy = _ref2.accessibilityLabelledBy,
+      error = _ref2.error,
+      required = _ref2.required,
+      _ref2$editable = _ref2.editable,
+      editable = _ref2$editable === void 0 ? true : _ref2$editable,
+      _ref2$disabled = _ref2.disabled,
+      disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
+      maxLength = _ref2.maxLength,
+      helpText = _ref2.helpText,
+      _ref2$value = _ref2.value,
+      value = _ref2$value === void 0 ? '' : _ref2$value,
+      nativeProps = _objectWithoutProperties$1(_ref2, _excluded$1);
+
+  var textInputReference = React.useRef(null);
+  var isEmptyValue = value.length === 0;
+
+  var _React$useState = React__default["default"].useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      isFocused = _React$useState2[0],
+      setIsFocused = _React$useState2[1];
+
+  var variant = getVariant({
+    disabled: disabled,
+    error: error,
+    editable: editable,
+    isFocused: isFocused,
+    isEmptyValue: isEmptyValue
+  });
+  var shouldShowMaxLength = maxLength !== undefined;
+  var theme = useTheme();
+  return /*#__PURE__*/React__default["default"].createElement(StyledContainer, {
     style: style,
+    pointerEvents: variant === 'disabled' ? 'none' : 'auto',
     testID: testID
-  }, label && /*#__PURE__*/React__default["default"].createElement(Label, {
+  }, /*#__PURE__*/React__default["default"].createElement(StyledTextInputContainer, null, /*#__PURE__*/React__default["default"].createElement(StyledBorderBackDrop, {
+    themeVariant: variant
+  }), (isFocused || label && !isEmptyValue) && /*#__PURE__*/React__default["default"].createElement(StyledLabelContainer, {
+    pointerEvents: "none"
+  }, required && /*#__PURE__*/React__default["default"].createElement(StyledAsteriskLabel, {
+    themeVariant: variant,
+    fontSize: "small"
+  }, "*"), /*#__PURE__*/React__default["default"].createElement(StyledLabel, {
     nativeID: accessibilityLabelledBy,
     testID: "input-label",
-    fontSize: "small"
-  }, label), prefix && /*#__PURE__*/React__default["default"].createElement(Icon, {
+    fontSize: "small",
+    themeVariant: variant
+  }, label)), typeof prefix === 'string' ? /*#__PURE__*/React__default["default"].createElement(Icon, {
+    intent: disabled ? 'disabled-text' : 'text',
     testID: "input-prefix",
     icon: prefix,
     size: "xsmall"
-  }), /*#__PURE__*/React__default["default"].createElement(StyledTextInput, _extends$3({
-    style: textStyle,
-    testID: "text-input" // @ts-ignore
+  }) : prefix, /*#__PURE__*/React__default["default"].createElement(StyledTextInputAndLabelContainer, null, !isFocused && isEmptyValue && /*#__PURE__*/React__default["default"].createElement(StyledLabelContainerInsideTextInput, {
+    pointerEvents: "none"
+  }, required && /*#__PURE__*/React__default["default"].createElement(StyledAsteriskLabelInsideTextInput, {
+    themeVariant: variant
+  }, "*"), /*#__PURE__*/React__default["default"].createElement(StyledLabelInsideTextInput, {
+    nativeID: accessibilityLabelledBy,
+    testID: "input-label",
+    fontSize: "medium",
+    themeVariant: variant
+  }, label)), /*#__PURE__*/React__default["default"].createElement(StyledTextInput // when input is not editable on Android, the text color is gray
+  // hence, adding this to make the text color the same as iOS
+  , _extends$3({
+    style: ReactNative.StyleSheet.flatten([{
+      color: theme.__hd__.textInput.colors.text
+    }, textStyle]),
+    testID: "text-input",
+    accessibilityState: {
+      disabled: disabled
+    } // @ts-ignore
     ,
     accessibilityLabelledBy: accessibilityLabelledBy
-  }, nativeProps)), suffix && /*#__PURE__*/React__default["default"].createElement(Icon, {
+  }, nativeProps, {
+    onFocus: function onFocus(event) {
+      var _nativeProps$onFocus;
+
+      setIsFocused(true);
+      (_nativeProps$onFocus = nativeProps.onFocus) === null || _nativeProps$onFocus === void 0 ? void 0 : _nativeProps$onFocus.call(nativeProps, event);
+    },
+    onBlur: function onBlur(event) {
+      var _nativeProps$onBlur;
+
+      setIsFocused(false);
+      (_nativeProps$onBlur = nativeProps.onBlur) === null || _nativeProps$onBlur === void 0 ? void 0 : _nativeProps$onBlur.call(nativeProps, event);
+    },
+    ref: textInputReference,
+    editable: editable,
+    maxLength: maxLength,
+    value: value,
+    onChangeText: function onChangeText(text) {
+      var _nativeProps$onChange;
+
+      (_nativeProps$onChange = nativeProps.onChangeText) === null || _nativeProps$onChange === void 0 ? void 0 : _nativeProps$onChange.call(nativeProps, text);
+    },
+    placeholder: variant === 'focused' ? nativeProps.placeholder : undefined
+  }))), typeof suffix === 'string' ? /*#__PURE__*/React__default["default"].createElement(Icon, {
+    intent: disabled ? 'disabled-text' : 'text',
     testID: "input-suffix",
     icon: suffix,
     size: "xsmall"
-  }));
+  }) : suffix), /*#__PURE__*/React__default["default"].createElement(StyledErrorAndHelpTextContainer, null, error && /*#__PURE__*/React__default["default"].createElement(StyledErrorContainer, null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+    testID: "input-error-icon",
+    icon: "circle-info",
+    size: "xsmall",
+    intent: "danger"
+  }), /*#__PURE__*/React__default["default"].createElement(StyledError, {
+    testID: "input-error-message"
+  }, error)), shouldShowMaxLength && /*#__PURE__*/React__default["default"].createElement(StyledMaxLengthMessage, {
+    themeVariant: variant,
+    fontSize: "small"
+  }, value.length, "/", maxLength), helpText && /*#__PURE__*/React__default["default"].createElement(StyledHelperText, null, helpText)));
 };
 
 function MultiSelect(_ref) {