@hero-design/rn 8.64.9-alpha.0 → 8.65.0

package/.turbo/turbo-build.log

@@ -0,0 +1,5 @@
+
+src/index.ts → lib/index.js, es/index.js...
+(!) Plugin replace: @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
+(!) Plugin node-resolve: preferring built-in module 'events' over local alternative at '/home/runner/work/hero-design/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
+created lib/index.js, es/index.js in 1m 0.2s

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @hero-design/rn
 
+## 8.65.0
+
+### Minor Changes
+
+- [#3377](https://github.com/Thinkei/hero-design/pull/3377) [`a05212a0d5c19ecdecca919e706447fb7c1298e5`](https://github.com/Thinkei/hero-design/commit/a05212a0d5c19ecdecca919e706447fb7c1298e5) Thanks [@vinhphan-eh](https://github.com/vinhphan-eh)! - [BottomNavigation] Bring back component
+
 ## 8.64.8
 
 ### Patch Changes

package/es/index.js

@@ -613,156 +613,231 @@ var hexRgb = function hexRgb(hex) {
   };
 };
 
-var colorName = {
-  "aliceblue": [240, 248, 255],
-  "antiquewhite": [250, 235, 215],
-  "aqua": [0, 255, 255],
-  "aquamarine": [127, 255, 212],
-  "azure": [240, 255, 255],
-  "beige": [245, 245, 220],
-  "bisque": [255, 228, 196],
-  "black": [0, 0, 0],
-  "blanchedalmond": [255, 235, 205],
-  "blue": [0, 0, 255],
-  "blueviolet": [138, 43, 226],
-  "brown": [165, 42, 42],
-  "burlywood": [222, 184, 135],
-  "cadetblue": [95, 158, 160],
-  "chartreuse": [127, 255, 0],
-  "chocolate": [210, 105, 30],
-  "coral": [255, 127, 80],
-  "cornflowerblue": [100, 149, 237],
-  "cornsilk": [255, 248, 220],
-  "crimson": [220, 20, 60],
-  "cyan": [0, 255, 255],
-  "darkblue": [0, 0, 139],
-  "darkcyan": [0, 139, 139],
-  "darkgoldenrod": [184, 134, 11],
-  "darkgray": [169, 169, 169],
-  "darkgreen": [0, 100, 0],
-  "darkgrey": [169, 169, 169],
-  "darkkhaki": [189, 183, 107],
-  "darkmagenta": [139, 0, 139],
-  "darkolivegreen": [85, 107, 47],
-  "darkorange": [255, 140, 0],
-  "darkorchid": [153, 50, 204],
-  "darkred": [139, 0, 0],
-  "darksalmon": [233, 150, 122],
-  "darkseagreen": [143, 188, 143],
-  "darkslateblue": [72, 61, 139],
-  "darkslategray": [47, 79, 79],
-  "darkslategrey": [47, 79, 79],
-  "darkturquoise": [0, 206, 209],
-  "darkviolet": [148, 0, 211],
-  "deeppink": [255, 20, 147],
-  "deepskyblue": [0, 191, 255],
-  "dimgray": [105, 105, 105],
-  "dimgrey": [105, 105, 105],
-  "dodgerblue": [30, 144, 255],
-  "firebrick": [178, 34, 34],
-  "floralwhite": [255, 250, 240],
-  "forestgreen": [34, 139, 34],
-  "fuchsia": [255, 0, 255],
-  "gainsboro": [220, 220, 220],
-  "ghostwhite": [248, 248, 255],
-  "gold": [255, 215, 0],
-  "goldenrod": [218, 165, 32],
-  "gray": [128, 128, 128],
-  "green": [0, 128, 0],
-  "greenyellow": [173, 255, 47],
-  "grey": [128, 128, 128],
-  "honeydew": [240, 255, 240],
-  "hotpink": [255, 105, 180],
-  "indianred": [205, 92, 92],
-  "indigo": [75, 0, 130],
-  "ivory": [255, 255, 240],
-  "khaki": [240, 230, 140],
-  "lavender": [230, 230, 250],
-  "lavenderblush": [255, 240, 245],
-  "lawngreen": [124, 252, 0],
-  "lemonchiffon": [255, 250, 205],
-  "lightblue": [173, 216, 230],
-  "lightcoral": [240, 128, 128],
-  "lightcyan": [224, 255, 255],
-  "lightgoldenrodyellow": [250, 250, 210],
-  "lightgray": [211, 211, 211],
-  "lightgreen": [144, 238, 144],
-  "lightgrey": [211, 211, 211],
-  "lightpink": [255, 182, 193],
-  "lightsalmon": [255, 160, 122],
-  "lightseagreen": [32, 178, 170],
-  "lightskyblue": [135, 206, 250],
-  "lightslategray": [119, 136, 153],
-  "lightslategrey": [119, 136, 153],
-  "lightsteelblue": [176, 196, 222],
-  "lightyellow": [255, 255, 224],
-  "lime": [0, 255, 0],
-  "limegreen": [50, 205, 50],
-  "linen": [250, 240, 230],
-  "magenta": [255, 0, 255],
-  "maroon": [128, 0, 0],
-  "mediumaquamarine": [102, 205, 170],
-  "mediumblue": [0, 0, 205],
-  "mediumorchid": [186, 85, 211],
-  "mediumpurple": [147, 112, 219],
-  "mediumseagreen": [60, 179, 113],
-  "mediumslateblue": [123, 104, 238],
-  "mediumspringgreen": [0, 250, 154],
-  "mediumturquoise": [72, 209, 204],
-  "mediumvioletred": [199, 21, 133],
-  "midnightblue": [25, 25, 112],
-  "mintcream": [245, 255, 250],
-  "mistyrose": [255, 228, 225],
-  "moccasin": [255, 228, 181],
-  "navajowhite": [255, 222, 173],
-  "navy": [0, 0, 128],
-  "oldlace": [253, 245, 230],
-  "olive": [128, 128, 0],
-  "olivedrab": [107, 142, 35],
-  "orange": [255, 165, 0],
-  "orangered": [255, 69, 0],
-  "orchid": [218, 112, 214],
-  "palegoldenrod": [238, 232, 170],
-  "palegreen": [152, 251, 152],
-  "paleturquoise": [175, 238, 238],
-  "palevioletred": [219, 112, 147],
-  "papayawhip": [255, 239, 213],
-  "peachpuff": [255, 218, 185],
-  "peru": [205, 133, 63],
-  "pink": [255, 192, 203],
-  "plum": [221, 160, 221],
-  "powderblue": [176, 224, 230],
-  "purple": [128, 0, 128],
-  "rebeccapurple": [102, 51, 153],
-  "red": [255, 0, 0],
-  "rosybrown": [188, 143, 143],
-  "royalblue": [65, 105, 225],
-  "saddlebrown": [139, 69, 19],
-  "salmon": [250, 128, 114],
-  "sandybrown": [244, 164, 96],
-  "seagreen": [46, 139, 87],
-  "seashell": [255, 245, 238],
-  "sienna": [160, 82, 45],
-  "silver": [192, 192, 192],
-  "skyblue": [135, 206, 235],
-  "slateblue": [106, 90, 205],
-  "slategray": [112, 128, 144],
-  "slategrey": [112, 128, 144],
-  "snow": [255, 250, 250],
-  "springgreen": [0, 255, 127],
-  "steelblue": [70, 130, 180],
-  "tan": [210, 180, 140],
-  "teal": [0, 128, 128],
-  "thistle": [216, 191, 216],
-  "tomato": [255, 99, 71],
-  "turquoise": [64, 224, 208],
-  "violet": [238, 130, 238],
-  "wheat": [245, 222, 179],
-  "white": [255, 255, 255],
-  "whitesmoke": [245, 245, 245],
-  "yellow": [255, 255, 0],
-  "yellowgreen": [154, 205, 50]
-};
+function hsl2rgb(hsl) {
+  var h = hsl[0] / 360,
+    s = hsl[1] / 100,
+    l = hsl[2] / 100,
+    t1,
+    t2,
+    t3,
+    rgb,
+    val;
+  if (s == 0) {
+    val = l * 255;
+    return [val, val, val];
+  }
+  if (l < 0.5) t2 = l * (1 + s);else t2 = l + s - l * s;
+  t1 = 2 * l - t2;
+  rgb = [0, 0, 0];
+  for (var i = 0; i < 3; i++) {
+    t3 = h + 1 / 3 * -(i - 1);
+    t3 < 0 && t3++;
+    t3 > 1 && t3--;
+    if (6 * t3 < 1) val = t1 + (t2 - t1) * 6 * t3;else if (2 * t3 < 1) val = t2;else if (3 * t3 < 2) val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;else val = t1;
+    rgb[i] = val * 255;
+  }
+  return rgb;
+}
+var hsl2rgb_1 = hsl2rgb;
+
+function clamp$3(val, min, max) {
+  return Math.min(Math.max(val, min), max);
+}
+var clamp_1 = clamp$3;
+
+var clamp$2 = clamp_1;
+function componentToHex(c) {
+  var value = Math.round(clamp$2(c, 0, 255));
+  var hex = value.toString(16);
+  return hex.length == 1 ? "0" + hex : hex;
+}
+function rgb2hex(rgb) {
+  var alpha = rgb.length === 4 ? componentToHex(rgb[3] * 255) : "";
+  return "#" + componentToHex(rgb[0]) + componentToHex(rgb[1]) + componentToHex(rgb[2]) + alpha;
+}
+var rgb2hex_1 = rgb2hex;
+
+function rgb2hsl(rgb) {
+  var r = rgb[0] / 255,
+    g = rgb[1] / 255,
+    b = rgb[2] / 255,
+    min = Math.min(r, g, b),
+    max = Math.max(r, g, b),
+    delta = max - min,
+    h,
+    s,
+    l;
+  if (max == min) h = 0;else if (r == max) h = (g - b) / delta;else if (g == max) h = 2 + (b - r) / delta;else if (b == max) h = 4 + (r - g) / delta;
+  h = Math.min(h * 60, 360);
+  if (h < 0) h += 360;
+  l = (min + max) / 2;
+  if (max == min) s = 0;else if (l <= 0.5) s = delta / (max + min);else s = delta / (2 - max - min);
+  return [h, s * 100, l * 100];
+}
+var rgb2hsl_1 = rgb2hsl;
+
+function getDefaultExportFromCjs$1(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+var colorName$1;
+var hasRequiredColorName;
+function requireColorName() {
+  if (hasRequiredColorName) return colorName$1;
+  hasRequiredColorName = 1;
+  colorName$1 = {
+    "aliceblue": [240, 248, 255],
+    "antiquewhite": [250, 235, 215],
+    "aqua": [0, 255, 255],
+    "aquamarine": [127, 255, 212],
+    "azure": [240, 255, 255],
+    "beige": [245, 245, 220],
+    "bisque": [255, 228, 196],
+    "black": [0, 0, 0],
+    "blanchedalmond": [255, 235, 205],
+    "blue": [0, 0, 255],
+    "blueviolet": [138, 43, 226],
+    "brown": [165, 42, 42],
+    "burlywood": [222, 184, 135],
+    "cadetblue": [95, 158, 160],
+    "chartreuse": [127, 255, 0],
+    "chocolate": [210, 105, 30],
+    "coral": [255, 127, 80],
+    "cornflowerblue": [100, 149, 237],
+    "cornsilk": [255, 248, 220],
+    "crimson": [220, 20, 60],
+    "cyan": [0, 255, 255],
+    "darkblue": [0, 0, 139],
+    "darkcyan": [0, 139, 139],
+    "darkgoldenrod": [184, 134, 11],
+    "darkgray": [169, 169, 169],
+    "darkgreen": [0, 100, 0],
+    "darkgrey": [169, 169, 169],
+    "darkkhaki": [189, 183, 107],
+    "darkmagenta": [139, 0, 139],
+    "darkolivegreen": [85, 107, 47],
+    "darkorange": [255, 140, 0],
+    "darkorchid": [153, 50, 204],
+    "darkred": [139, 0, 0],
+    "darksalmon": [233, 150, 122],
+    "darkseagreen": [143, 188, 143],
+    "darkslateblue": [72, 61, 139],
+    "darkslategray": [47, 79, 79],
+    "darkslategrey": [47, 79, 79],
+    "darkturquoise": [0, 206, 209],
+    "darkviolet": [148, 0, 211],
+    "deeppink": [255, 20, 147],
+    "deepskyblue": [0, 191, 255],
+    "dimgray": [105, 105, 105],
+    "dimgrey": [105, 105, 105],
+    "dodgerblue": [30, 144, 255],
+    "firebrick": [178, 34, 34],
+    "floralwhite": [255, 250, 240],
+    "forestgreen": [34, 139, 34],
+    "fuchsia": [255, 0, 255],
+    "gainsboro": [220, 220, 220],
+    "ghostwhite": [248, 248, 255],
+    "gold": [255, 215, 0],
+    "goldenrod": [218, 165, 32],
+    "gray": [128, 128, 128],
+    "green": [0, 128, 0],
+    "greenyellow": [173, 255, 47],
+    "grey": [128, 128, 128],
+    "honeydew": [240, 255, 240],
+    "hotpink": [255, 105, 180],
+    "indianred": [205, 92, 92],
+    "indigo": [75, 0, 130],
+    "ivory": [255, 255, 240],
+    "khaki": [240, 230, 140],
+    "lavender": [230, 230, 250],
+    "lavenderblush": [255, 240, 245],
+    "lawngreen": [124, 252, 0],
+    "lemonchiffon": [255, 250, 205],
+    "lightblue": [173, 216, 230],
+    "lightcoral": [240, 128, 128],
+    "lightcyan": [224, 255, 255],
+    "lightgoldenrodyellow": [250, 250, 210],
+    "lightgray": [211, 211, 211],
+    "lightgreen": [144, 238, 144],
+    "lightgrey": [211, 211, 211],
+    "lightpink": [255, 182, 193],
+    "lightsalmon": [255, 160, 122],
+    "lightseagreen": [32, 178, 170],
+    "lightskyblue": [135, 206, 250],
+    "lightslategray": [119, 136, 153],
+    "lightslategrey": [119, 136, 153],
+    "lightsteelblue": [176, 196, 222],
+    "lightyellow": [255, 255, 224],
+    "lime": [0, 255, 0],
+    "limegreen": [50, 205, 50],
+    "linen": [250, 240, 230],
+    "magenta": [255, 0, 255],
+    "maroon": [128, 0, 0],
+    "mediumaquamarine": [102, 205, 170],
+    "mediumblue": [0, 0, 205],
+    "mediumorchid": [186, 85, 211],
+    "mediumpurple": [147, 112, 219],
+    "mediumseagreen": [60, 179, 113],
+    "mediumslateblue": [123, 104, 238],
+    "mediumspringgreen": [0, 250, 154],
+    "mediumturquoise": [72, 209, 204],
+    "mediumvioletred": [199, 21, 133],
+    "midnightblue": [25, 25, 112],
+    "mintcream": [245, 255, 250],
+    "mistyrose": [255, 228, 225],
+    "moccasin": [255, 228, 181],
+    "navajowhite": [255, 222, 173],
+    "navy": [0, 0, 128],
+    "oldlace": [253, 245, 230],
+    "olive": [128, 128, 0],
+    "olivedrab": [107, 142, 35],
+    "orange": [255, 165, 0],
+    "orangered": [255, 69, 0],
+    "orchid": [218, 112, 214],
+    "palegoldenrod": [238, 232, 170],
+    "palegreen": [152, 251, 152],
+    "paleturquoise": [175, 238, 238],
+    "palevioletred": [219, 112, 147],
+    "papayawhip": [255, 239, 213],
+    "peachpuff": [255, 218, 185],
+    "peru": [205, 133, 63],
+    "pink": [255, 192, 203],
+    "plum": [221, 160, 221],
+    "powderblue": [176, 224, 230],
+    "purple": [128, 0, 128],
+    "rebeccapurple": [102, 51, 153],
+    "red": [255, 0, 0],
+    "rosybrown": [188, 143, 143],
+    "royalblue": [65, 105, 225],
+    "saddlebrown": [139, 69, 19],
+    "salmon": [250, 128, 114],
+    "sandybrown": [244, 164, 96],
+    "seagreen": [46, 139, 87],
+    "seashell": [255, 245, 238],
+    "sienna": [160, 82, 45],
+    "silver": [192, 192, 192],
+    "skyblue": [135, 206, 235],
+    "slateblue": [106, 90, 205],
+    "slategray": [112, 128, 144],
+    "slategrey": [112, 128, 144],
+    "snow": [255, 250, 250],
+    "springgreen": [0, 255, 127],
+    "steelblue": [70, 130, 180],
+    "tan": [210, 180, 140],
+    "teal": [0, 128, 128],
+    "thistle": [216, 191, 216],
+    "tomato": [255, 99, 71],
+    "turquoise": [64, 224, 208],
+    "violet": [238, 130, 238],
+    "wheat": [245, 222, 179],
+    "white": [255, 255, 255],
+    "whitesmoke": [245, 245, 245],
+    "yellow": [255, 255, 0],
+    "yellowgreen": [154, 205, 50]
+  };
+  return colorName$1;
+}
+var colorNameExports = requireColorName();
+var colorName = /*@__PURE__*/getDefaultExportFromCjs$1(colorNameExports);
 var pattern$8 = /^#([a-f0-9]{3,4}|[a-f0-9]{4}(?:[a-f0-9]{2}){1,2})\b$/;
 var hexRe$1 = new RegExp(pattern$8, 'i');
 var float$1 = '-?\\d*(?:\\.\\d+)';
@@ -783,7 +858,7 @@ var pattern$6$1 = "^\n  rgba?\\(\n    \\s*".concat(percentage$1, "\n    \\s+").c
 var rgb4PercentageRe$1 = new RegExp(pattern$6$1);
 var pattern$7$1 = /^transparent$/;
 var transparentRe$1 = new RegExp(pattern$7$1, 'i');
-var clamp$3 = function clamp$3(num, min, max) {
+var clamp$1 = function clamp$1(num, min, max) {
   return Math.min(Math.max(min, num), max);
 };
 
@@ -791,19 +866,19 @@ var clamp$3 = function clamp$3(num, min, max) {
 var parseRGB$1 = function parseRGB$1(num) {
   var n = num;
   if (typeof n !== 'number') n = n.endsWith('%') ? parseFloat(n) * 255 / 100 : parseFloat(n);
-  return clamp$3(Math.round(n), 0, 255);
+  return clamp$1(Math.round(n), 0, 255);
 };
 
 /* 200 => 100, -100 => 0, 50 => 50 */
 var parsePercentage$1 = function parsePercentage$1(percentage) {
-  return clamp$3(parseFloat(percentage), 0, 100);
+  return clamp$1(parseFloat(percentage), 0, 100);
 };
 
 /* '50%' => 5.0, 200 => 1, -10 => 0 */
 function parseAlpha$1(alpha) {
   var a = alpha;
   if (typeof a !== 'number') a = a.endsWith('%') ? parseFloat(a) / 100 : parseFloat(a);
-  return clamp$3(a, 0, 1);
+  return clamp$1(a, 0, 1);
 }
 function getHEX$1(hex) {
   var _hex2Rgb = hexRgb(hex, {
@@ -871,65 +946,6 @@ var parseCSSColor$1 = function parseCSSColor$1(str) {
   if (cn) return getRGB$1([null, cn[0], cn[1], cn[2], 1]);
   return null;
 };
-function hsl2rgb(hsl) {
-  var h = hsl[0] / 360,
-    s = hsl[1] / 100,
-    l = hsl[2] / 100,
-    t1,
-    t2,
-    t3,
-    rgb,
-    val;
-  if (s == 0) {
-    val = l * 255;
-    return [val, val, val];
-  }
-  if (l < 0.5) t2 = l * (1 + s);else t2 = l + s - l * s;
-  t1 = 2 * l - t2;
-  rgb = [0, 0, 0];
-  for (var i = 0; i < 3; i++) {
-    t3 = h + 1 / 3 * -(i - 1);
-    t3 < 0 && t3++;
-    t3 > 1 && t3--;
-    if (6 * t3 < 1) val = t1 + (t2 - t1) * 6 * t3;else if (2 * t3 < 1) val = t2;else if (3 * t3 < 2) val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;else val = t1;
-    rgb[i] = val * 255;
-  }
-  return rgb;
-}
-var hsl2rgb_1 = hsl2rgb;
-function clamp$2(val, min, max) {
-  return Math.min(Math.max(val, min), max);
-}
-var clamp_1 = clamp$2;
-var clamp$1 = clamp_1;
-function componentToHex(c) {
-  var value = Math.round(clamp$1(c, 0, 255));
-  var hex = value.toString(16);
-  return hex.length == 1 ? "0" + hex : hex;
-}
-function rgb2hex(rgb) {
-  var alpha = rgb.length === 4 ? componentToHex(rgb[3] * 255) : "";
-  return "#" + componentToHex(rgb[0]) + componentToHex(rgb[1]) + componentToHex(rgb[2]) + alpha;
-}
-var rgb2hex_1 = rgb2hex;
-function rgb2hsl(rgb) {
-  var r = rgb[0] / 255,
-    g = rgb[1] / 255,
-    b = rgb[2] / 255,
-    min = Math.min(r, g, b),
-    max = Math.max(r, g, b),
-    delta = max - min,
-    h,
-    s,
-    l;
-  if (max == min) h = 0;else if (r == max) h = (g - b) / delta;else if (g == max) h = 2 + (b - r) / delta;else if (b == max) h = 4 + (r - g) / delta;
-  h = Math.min(h * 60, 360);
-  if (h < 0) h += 360;
-  l = (min + max) / 2;
-  if (max == min) s = 0;else if (l <= 0.5) s = delta / (max + min);else s = delta / (2 - max - min);
-  return [h, s * 100, l * 100];
-}
-var rgb2hsl_1 = rgb2hsl;
 
 /**
  * mix-css-color
@@ -1211,9 +1227,8 @@ var Values = /*#__PURE__*/function () {
   return Values;
 }();
 Values.VERSION = 'v2.1.1';
-var Values$1 = Values;
 var mixColor = function mixColor(color) {
-  var colorValues = new Values$1(color);
+  var colorValues = new Values(color);
   return {
     tint: function tint(step) {
       return colorValues.tint(step).hexString();
@@ -2885,7 +2900,7 @@ var getPinInputTheme = function getPinInputTheme(theme) {
   var space = {
     spacer: theme.space.medium,
     errorMessagePadding: theme.space.xsmall,
-    hiddenInputText: theme.space.xsmall,
+    hiddenInputText: theme.space.xlarge,
     hiddenInputHorrizontalPadding: theme.space.small
   };
   var radii = {
@@ -8488,7 +8503,6 @@ var BottomNavigation = function BottomNavigation(_ref) {
     selectedTabKey = _ref.selectedTabKey,
     tabs = _ref.tabs,
     nativeProps = _objectWithoutProperties(_ref, _excluded$s);
-  useDeprecation('BottomNavigation is deprecated and will be removed in the next major release. Please remove it.');
   var insets = useSafeAreaInsets();
   /**
    * List of loaded tabs, tabs will be loaded when navigated to.
@@ -15526,7 +15540,6 @@ var StyledHiddenInput = index$9(TextInput$1)(function (_ref6) {
     top: 0,
     right: 0,
     width: themePinLength * cellWidth + (themePinLength - 1) * spacerWidth,
-    overflow: 'hidden',
     height: '100%',
     fontSize: theme.__hd__.pinInput.fontSizes.hiddenInputText,
     letterSpacing: theme.__hd__.pinInput.space.hiddenInputText,
@@ -15616,6 +15629,7 @@ var PinInput = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     error: error
   });
   var trimmedValue = normalizeValue(value, length);
+  var maskedValueWithExtraSpace = Platform.OS === 'android' && !trimmedValue ? '*' : trimmedValue;
   var focus = useCallback(function () {
     if (inputRef !== null && inputRef !== void 0 && inputRef.current) {
       inputRef.current.focus();
@@ -15629,20 +15643,13 @@ var PinInput = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     }
   }, []);
   var changeText = useCallback(function (text) {
+    // Prevent user from entering more than the length
     var trimmedPin = normalizeValue(text, length);
-    // If current value is already the length, replace it with the new text, starting from the length
-    if (trimmedValue.length === length && trimmedValue.length <= text.length) {
-      // Slice the text, starting from the length position
-      var slicedText = text.slice(length);
-      onChangeText === null || onChangeText === void 0 || onChangeText(normalizeValue(slicedText, length));
-    } else {
-      // Prevent user from entering more than the length
-      onChangeText === null || onChangeText === void 0 || onChangeText(trimmedPin);
-    }
+    onChangeText === null || onChangeText === void 0 || onChangeText(trimmedPin);
     if (trimmedPin.length === length) {
       onFulfill === null || onFulfill === void 0 || onFulfill(trimmedPin);
     }
-  }, [length, onChangeText, onFulfill, trimmedValue.length]);
+  }, [length, onChangeText, onFulfill]);
   useEffect(function () {
     // Must run after animations for keyboard to automatically open
     if (autoFocus) {
@@ -15675,7 +15682,7 @@ var PinInput = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   }), /*#__PURE__*/React__default.createElement(StyledErrorMessage, null, error)), /*#__PURE__*/React__default.createElement(StyledHiddenInput, {
     themePinLength: length,
     ref: inputRef,
-    value: trimmedValue,
+    value: maskedValueWithExtraSpace,
     onChangeText: changeText,
     secureTextEntry: secure,
     editable: !disabled,
@@ -15687,11 +15694,7 @@ var PinInput = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     testID: "pin-hidden-input",
     textContentType: textContentType,
     autoComplete: autoComplete,
-    selectTextOnFocus: false,
-    selection: {
-      start: trimmedValue.length,
-      end: trimmedValue.length + 1
-    }
+    selectTextOnFocus: false
   }));
 });
 PinInput.displayName = 'PinInput';