@razorpay/blade 12.38.0 → 12.39.0

package/build/types/components/index.native.d.ts

@@ -9881,6 +9881,25 @@ type FormInputLabelProps = {
      * Displays `(optional)` when `optional` is passed or `*` when `required` is passed
      */
     necessityIndicator?: 'required' | 'optional' | 'none';
+    /**
+     * Suffix element to be shown for the input field
+     *
+     * @example
+     * ```jsx
+     * labelSuffix={
+     *  <Tooltip content="This is a tooltip" placement="right">
+     *    <TooltipInteractiveWrapper>
+     *        <InfoIcon size="small" color="surface.icon.gray.subtle" />
+     *    </TooltipInteractiveWrapper>
+     *  </Tooltip>
+     * }
+     * ```
+     */
+    labelSuffix?: React__default.ReactNode;
+    /**
+     * Trailing element to be shown for the input field
+     */
+    labelTrailing?: React__default.ReactNode;
 };
 
 type FormInputOnEvent = ({ name, value, rawValue, }: {
@@ -10263,7 +10282,7 @@ type TaggedInputProps = {
 };
 
 type Type = Exclude<BaseInputProps['type'], 'password'>;
-type TextInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'necessityIndicator' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'value' | 'isDisabled' | 'isRequired' | 'prefix' | 'suffix' | 'maxCharacters' | 'autoFocus' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'onSubmit' | 'autoCapitalize' | 'testID' | 'onClick' | 'size' | 'leadingIcon' | 'trailingButton' | 'trailingIcon' | 'textAlign' | keyof DataAnalyticsAttribute> & {
+type TextInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'labelSuffix' | 'labelTrailing' | 'necessityIndicator' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'value' | 'isDisabled' | 'isRequired' | 'prefix' | 'suffix' | 'maxCharacters' | 'autoFocus' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'onSubmit' | 'autoCapitalize' | 'testID' | 'onClick' | 'size' | 'leadingIcon' | 'trailingButton' | 'trailingIcon' | 'textAlign' | keyof DataAnalyticsAttribute> & {
     /**
      * Decides whether to render a clear icon button
      */
@@ -10506,7 +10525,7 @@ type DatePickerCommonInputProps = {
     labelPosition?: BaseInputProps['labelPosition'];
     inputRef: React.Ref<any>;
     referenceProps: any;
-} & Pick<TextInputProps, 'size' | 'isRequired' | 'necessityIndicator' | 'autoFocus' | 'isDisabled' | 'accessibilityLabel'> & FormInputValidationProps;
+} & Pick<TextInputProps, 'size' | 'isRequired' | 'necessityIndicator' | 'autoFocus' | 'isDisabled' | 'accessibilityLabel' | 'labelSuffix' | 'labelTrailing'> & FormInputValidationProps;
 
 declare const Dropdown: React__default.ForwardRefExoticComponent<{
     isOpen?: boolean | undefined;
@@ -11857,7 +11876,7 @@ type FormInputOnEventWithIndex = ({ name, value, inputIndex, }: {
     value?: string;
     inputIndex: number;
 }) => void;
-type OTPInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'name' | 'onChange' | 'value' | 'isDisabled' | 'autoFocus' | 'keyboardReturnKeyType' | 'keyboardType' | 'placeholder' | 'testID' | 'size' | keyof DataAnalyticsAttribute> & {
+type OTPInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'labelSuffix' | 'labelTrailing' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'name' | 'onChange' | 'value' | 'isDisabled' | 'autoFocus' | 'keyboardReturnKeyType' | 'keyboardType' | 'placeholder' | 'testID' | 'size' | keyof DataAnalyticsAttribute> & {
     /**
      * Determines the number of input fields to show for the OTP
      * @default 6
@@ -11947,7 +11966,7 @@ type PasswordInputExtraProps = {
      */
     autoCompleteSuggestionType?: Extract<BaseInputProps['autoCompleteSuggestionType'], 'none' | 'password' | 'newPassword'>;
 };
-type PasswordInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'maxCharacters' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'isDisabled' | 'defaultValue' | 'placeholder' | 'isRequired' | 'value' | 'onChange' | 'onBlur' | 'onSubmit' | 'onFocus' | 'name' | 'autoFocus' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'testID' | 'size' | keyof DataAnalyticsAttribute> & PasswordInputExtraProps & StyledPropsBlade;
+type PasswordInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'labelSuffix' | 'labelTrailing' | 'maxCharacters' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'isDisabled' | 'defaultValue' | 'placeholder' | 'isRequired' | 'value' | 'onChange' | 'onBlur' | 'onSubmit' | 'onFocus' | 'name' | 'autoFocus' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'testID' | 'size' | keyof DataAnalyticsAttribute> & PasswordInputExtraProps & StyledPropsBlade;
 type PasswordInputPropsWithA11yLabel = {
     /**
      * Label to be shown for the input field
@@ -11971,7 +11990,7 @@ type PasswordInputPropsWithLabel = {
 type PasswordInputProps = (PasswordInputPropsWithA11yLabel | PasswordInputPropsWithLabel) & PasswordInputCommonProps;
 declare const PasswordInput: React__default.ForwardRefExoticComponent<PasswordInputProps & React__default.RefAttributes<BladeElementRef>>;
 
-type TextAreaCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'necessityIndicator' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'onSubmit' | 'value' | 'isDisabled' | 'isRequired' | 'maxCharacters' | 'autoFocus' | 'numberOfLines' | 'testID' | 'size' | keyof DataAnalyticsAttribute> & {
+type TextAreaCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'labelSuffix' | 'labelTrailing' | 'necessityIndicator' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'onSubmit' | 'value' | 'isDisabled' | 'isRequired' | 'maxCharacters' | 'autoFocus' | 'numberOfLines' | 'testID' | 'size' | keyof DataAnalyticsAttribute> & {
     /**
      * Decides whether to render a clear icon button
      */
@@ -12009,7 +12028,7 @@ type TextAreaPropsWithLabel = {
 type TextAreaProps = (TextAreaPropsWithA11yLabel | TextAreaPropsWithLabel) & TextAreaCommonProps;
 declare const TextArea: React__default.ForwardRefExoticComponent<TextAreaProps & React__default.RefAttributes<BladeElementRef>>;
 
-type SearchInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'helpText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'value' | 'isDisabled' | 'autoFocus' | 'onSubmit' | 'autoCapitalize' | 'testID' | 'onClick' | 'size' | keyof DataAnalyticsAttribute> & {
+type SearchInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'labelSuffix' | 'labelTrailing' | 'helpText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'value' | 'isDisabled' | 'autoFocus' | 'onSubmit' | 'autoCapitalize' | 'testID' | 'onClick' | 'size' | keyof DataAnalyticsAttribute> & {
     /**
      * Event handler to handle the onClick event for clear button.
      */
@@ -12052,7 +12071,7 @@ type SearchInputPropsWithLabel = {
 type SearchInputProps = (SearchInputPropsWithA11yLabel | SearchInputPropsWithLabel) & SearchInputCommonProps;
 declare const SearchInput: React__default.ForwardRefExoticComponent<SearchInputProps & React__default.RefAttributes<BladeElementRef>>;
 
-type CommonProps = Pick<BaseInputProps, 'size' | 'label' | 'labelPosition' | 'name' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'defaultValue' | 'necessityIndicator' | 'isRequired' | 'isDisabled' | 'onFocus' | 'onBlur' | 'onClick' | 'leadingIcon' | 'trailingIcon' | 'accessibilityLabel' | 'autoFocus' | 'testID' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'placeholder' | keyof DataAnalyticsAttribute>;
+type CommonProps = Pick<BaseInputProps, 'size' | 'label' | 'labelPosition' | 'labelSuffix' | 'labelTrailing' | 'name' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'defaultValue' | 'necessityIndicator' | 'isRequired' | 'isDisabled' | 'onFocus' | 'onBlur' | 'onClick' | 'leadingIcon' | 'trailingIcon' | 'accessibilityLabel' | 'autoFocus' | 'testID' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'placeholder' | keyof DataAnalyticsAttribute>;
 type PhoneNumberInputProps = StyledPropsBlade & CommonProps & {
     /**
      * Default value of the input, Used to set the default value of input field when it's uncontrolled

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@razorpay/blade",
   "description": "The Design System that powers Razorpay",
-  "version": "12.38.0",
+  "version": "12.39.0",
   "license": "MIT",
   "engines": {
     "node": ">=18.12.1"