@razorpay/blade 9.3.0 → 9.4.1

package/build/components/index.web.js

@@ -22148,7 +22148,7 @@ var BaseInput = /*#__PURE__*/React__default.forwardRef(function (_ref11, ref) {
         })]
       })]
     }), !hideFormHint && /*#__PURE__*/jsx(BaseBox, {
-      marginLeft: makeSize(isLabelLeftPositioned ? 136 : 0),
+      marginLeft: makeSize(isLabelLeftPositioned && !hideLabelText ? 136 : 0),
       children: /*#__PURE__*/jsxs(BaseBox, {
         display: "flex",
         flexDirection: "row",
@@ -22210,7 +22210,7 @@ var Spinner = function Spinner(_ref) {
   }, styledProps));
 };
 
-var _excluded$h = ["label", "labelPosition", "placeholder", "type", "defaultValue", "name", "value", "maxCharacters", "onChange", "onFocus", "onBlur", "onSubmit", "isDisabled", "necessityIndicator", "validationState", "errorText", "helpText", "successText", "isRequired", "icon", "prefix", "showClearButton", "onClearButtonClick", "isLoading", "suffix", "autoFocus", "keyboardReturnKeyType", "autoCompleteSuggestionType", "autoCapitalize", "testID"];
+var _excluded$h = ["label", "accessibilityLabel", "labelPosition", "placeholder", "type", "defaultValue", "name", "value", "maxCharacters", "onChange", "onFocus", "onBlur", "onSubmit", "isDisabled", "necessityIndicator", "validationState", "errorText", "helpText", "successText", "isRequired", "icon", "prefix", "showClearButton", "onClearButtonClick", "isLoading", "suffix", "autoFocus", "keyboardReturnKeyType", "autoCompleteSuggestionType", "autoCapitalize", "testID"];
 
 function ownKeys$L(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -22298,6 +22298,7 @@ var isReactNative$2 = function isReactNative(_textInputRef) {
 
 var _TextInput = function _TextInput(_ref2, ref) {
   var label = _ref2.label,
+      accessibilityLabel = _ref2.accessibilityLabel,
       _ref2$labelPosition = _ref2.labelPosition,
       labelPosition = _ref2$labelPosition === void 0 ? 'top' : _ref2$labelPosition,
       placeholder = _ref2.placeholder,
@@ -22384,6 +22385,8 @@ var _TextInput = function _TextInput(_ref2, ref) {
     componentName: MetaConstants.TextInput,
     ref: textInputRef,
     label: label,
+    accessibilityLabel: accessibilityLabel,
+    hideLabelText: !Boolean(label),
     labelPosition: labelPosition,
     placeholder: placeholder,
     defaultValue: defaultValue,
@@ -22450,7 +22453,7 @@ var TextInput = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__defau
   displayName: 'TextInput'
 });
 
-var _excluded$g = ["label", "labelPosition", "showRevealButton", "maxCharacters", "validationState", "errorText", "successText", "helpText", "isDisabled", "defaultValue", "placeholder", "isRequired", "necessityIndicator", "value", "onChange", "onFocus", "onBlur", "onSubmit", "name", "autoFocus", "keyboardReturnKeyType", "autoCompleteSuggestionType", "testID"];
+var _excluded$g = ["label", "accessibilityLabel", "labelPosition", "showRevealButton", "maxCharacters", "validationState", "errorText", "successText", "helpText", "isDisabled", "defaultValue", "placeholder", "isRequired", "necessityIndicator", "value", "onChange", "onFocus", "onBlur", "onSubmit", "name", "autoFocus", "keyboardReturnKeyType", "autoCompleteSuggestionType", "testID"];
 
 function ownKeys$K(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -22458,6 +22461,7 @@ function _objectSpread$J(target) { for (var i = 1; i < arguments.length; i++) {
 
 var _PasswordInput = function _PasswordInput(_ref, ref) {
   var label = _ref.label,
+      accessibilityLabel = _ref.accessibilityLabel,
       _ref$labelPosition = _ref.labelPosition,
       labelPosition = _ref$labelPosition === void 0 ? 'top' : _ref$labelPosition,
       _ref$showRevealButton = _ref.showRevealButton,
@@ -22506,14 +22510,14 @@ var _PasswordInput = function _PasswordInput(_ref, ref) {
     });
   };
 
-  var accessibilityLabel = isRevealedAndEnabled ? 'Hide password' : 'Show password';
+  var iconAccessibilityLabel = isRevealedAndEnabled ? 'Hide password' : 'Show password';
   var type = isRevealedAndEnabled ? 'text' : 'password';
   var revealButtonIcon = isRevealedAndEnabled ? EyeOffIcon : EyeIcon;
   var revealButton = showRevealButton && !isDisabled ? /*#__PURE__*/jsx(IconButton, {
     size: "medium",
     icon: revealButtonIcon,
     onClick: toggleIsRevealed,
-    accessibilityLabel: accessibilityLabel
+    accessibilityLabel: iconAccessibilityLabel
   }) : null;
 
   var trailingFooterSlot = function trailingFooterSlot(value) {
@@ -22534,6 +22538,8 @@ var _PasswordInput = function _PasswordInput(_ref, ref) {
     componentName: MetaConstants.PasswordInput,
     id: "password-field",
     label: label,
+    accessibilityLabel: accessibilityLabel,
+    hideLabelText: !Boolean(label),
     labelPosition: labelPosition,
     type: type,
     interactionElement: revealButton,
@@ -22568,7 +22574,7 @@ var PasswordInput = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__d
   displayName: 'PasswordInput'
 });
 
-var _excluded$f = ["label", "labelPosition", "necessityIndicator", "errorText", "helpText", "successText", "validationState", "defaultValue", "isDisabled", "isRequired", "name", "onChange", "onFocus", "onBlur", "onSubmit", "placeholder", "value", "maxCharacters", "showClearButton", "onClearButtonClick", "autoFocus", "numberOfLines", "testID"];
+var _excluded$f = ["label", "accessibilityLabel", "labelPosition", "necessityIndicator", "errorText", "helpText", "successText", "validationState", "defaultValue", "isDisabled", "isRequired", "name", "onChange", "onFocus", "onBlur", "onSubmit", "placeholder", "value", "maxCharacters", "showClearButton", "onClearButtonClick", "autoFocus", "numberOfLines", "testID"];
 
 function ownKeys$J(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -22582,6 +22588,7 @@ var isReactNative$1 = function isReactNative(_textInputRef) {
 
 var _TextArea = function _TextArea(_ref, ref) {
   var label = _ref.label,
+      accessibilityLabel = _ref.accessibilityLabel,
       labelPosition = _ref.labelPosition,
       necessityIndicator = _ref.necessityIndicator,
       errorText = _ref.errorText,
@@ -22659,6 +22666,8 @@ var _TextArea = function _TextArea(_ref, ref) {
     autoFocus: autoFocus,
     ref: inputRef,
     label: label,
+    accessibilityLabel: accessibilityLabel,
+    hideLabelText: !Boolean(label),
     labelPosition: labelPosition,
     necessityIndicator: necessityIndicator,
     errorText: errorText,
@@ -22716,7 +22725,7 @@ var TextArea = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__defaul
   displayName: 'TextArea'
 });
 
-var _excluded$e = ["autoFocus", "errorText", "helpText", "isDisabled", "keyboardReturnKeyType", "keyboardType", "label", "labelPosition", "name", "onChange", "onFocus", "onBlur", "onOTPFilled", "otpLength", "placeholder", "successText", "validationState", "value", "isMasked", "autoCompleteSuggestionType", "testID"];
+var _excluded$e = ["autoFocus", "errorText", "helpText", "isDisabled", "keyboardReturnKeyType", "keyboardType", "label", "accessibilityLabel", "labelPosition", "name", "onChange", "onFocus", "onBlur", "onOTPFilled", "otpLength", "placeholder", "successText", "validationState", "value", "isMasked", "autoCompleteSuggestionType", "testID"];
 
 function ownKeys$I(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -22756,6 +22765,7 @@ var OTPInput = function OTPInput(_ref) {
       _ref$keyboardType = _ref.keyboardType,
       keyboardType = _ref$keyboardType === void 0 ? 'decimal' : _ref$keyboardType,
       label = _ref.label,
+      accessibilityLabel = _ref.accessibilityLabel,
       labelPosition = _ref.labelPosition,
       name = _ref.name,
       onChange = _ref.onChange,
@@ -22991,7 +23001,7 @@ var OTPInput = function OTPInput(_ref) {
         children: /*#__PURE__*/jsx(BaseInput // eslint-disable-next-line jsx-a11y/no-autofocus
         , {
           autoFocus: autoFocus && index === 0,
-          accessibilityLabel: "".concat(index === 0 ? label : '', " character ").concat(index + 1),
+          accessibilityLabel: "".concat(index === 0 ? label || accessibilityLabel : '', " character ").concat(index + 1),
           label: label,
           hideLabelText: true,
           id: "".concat(inputId, "-").concat(index),
@@ -23057,7 +23067,7 @@ var OTPInput = function OTPInput(_ref) {
       flexDirection: isLabelLeftPositioned ? 'row' : 'column',
       alignItems: isLabelLeftPositioned ? 'center' : undefined,
       position: "relative",
-      children: [/*#__PURE__*/jsx(FormLabel, {
+      children: [Boolean(label) && /*#__PURE__*/jsx(FormLabel, {
         as: "label",
         position: labelPosition,
         htmlFor: inputId,
@@ -23248,6 +23258,7 @@ var _SelectInput = function _SelectInput(props, ref) {
       })
     }) : null, /*#__PURE__*/jsx(BaseInput, _objectSpread$G(_objectSpread$G({}, baseInputProps), {}, {
       as: "button",
+      label: props.label,
       hideLabelText: ((_props$label = props.label) === null || _props$label === void 0 ? void 0 : _props$label.length) === 0,
       componentName: MetaConstants.SelectInput,
       ref: !isReactNative$4() ? triggererRef : null,
@@ -24313,7 +24324,9 @@ var Modal = function Modal(_ref2) {
       initialFocusRef = _ref2.initialFocusRef,
       _ref2$size = _ref2.size,
       size = _ref2$size === void 0 ? 'small' : _ref2$size,
-      accessibilityLabel = _ref2.accessibilityLabel;
+      accessibilityLabel = _ref2.accessibilityLabel,
+      _ref2$zIndex = _ref2.zIndex,
+      zIndex = _ref2$zIndex === void 0 ? modalHighestZIndex : _ref2$zIndex;
 
   var _useTheme = useTheme(),
       theme = _useTheme.theme,
@@ -24373,7 +24386,7 @@ var Modal = function Modal(_ref2) {
         context: context,
         modal: true,
         children: /*#__PURE__*/jsxs(Box, {
-          zIndex: modalHighestZIndex,
+          zIndex: zIndex,
           position: "fixed",
           testID: "modal-wrapper",
           children: [/*#__PURE__*/jsx(ModalBackdrop, {}), /*#__PURE__*/jsx(ModalContent, _objectSpread$y(_objectSpread$y(_objectSpread$y({}, metaAttribute({