@razorpay/blade 6.5.0 → 6.5.2

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @razorpay/blade
 
+## 6.5.2
+
+### Patch Changes
+
+- 2700667f: fix(SelectInput): call user passed onBlur callback
+- 3855a583: fix(Card): CardHeader title alignment when subtitle is not present
+
+## 6.5.1
+
+### Patch Changes
+
+- 86cd05a6: chore(blade): update meta constant of Box
+
 ## 6.5.0
 
 ### Minor Changes

package/build/components/index.d.ts

@@ -3878,7 +3878,7 @@ declare type TextInputProps = Pick<BaseInputProps, 'label' | 'labelPosition' | '
      */
     type?: Type;
 } & StyledPropsBlade;
-declare const TextInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "value" | "onFocus" | "onBlur" | "onChange" | "onSubmit" | "autoFocus" | "defaultValue" | "prefix" | "autoCapitalize" | "isDisabled" | "labelPosition" | "validationState" | "helpText" | "errorText" | "necessityIndicator" | "successText" | "isRequired" | "suffix" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & {
+declare const TextInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "value" | "onFocus" | "onBlur" | "onChange" | "onSubmit" | "autoFocus" | "defaultValue" | "prefix" | "autoCapitalize" | "isDisabled" | "labelPosition" | "helpText" | "errorText" | "successText" | "necessityIndicator" | "suffix" | "validationState" | "isRequired" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & {
     /**
      * Decides whether to render a clear icon button
      */
@@ -4012,7 +4012,7 @@ declare type PasswordInputExtraProps = {
     autoCompleteSuggestionType?: Extract<BaseInputProps['autoCompleteSuggestionType'], 'none' | 'password' | 'newPassword'>;
 };
 declare type PasswordInputProps = Pick<BaseInputProps, 'label' | 'labelPosition' | 'maxCharacters' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'isDisabled' | 'defaultValue' | 'placeholder' | 'isRequired' | 'value' | 'onChange' | 'onBlur' | 'onSubmit' | 'onFocus' | 'name' | 'autoFocus' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'testID'> & PasswordInputExtraProps & StyledPropsBlade;
-declare const PasswordInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "value" | "onFocus" | "onBlur" | "onChange" | "onSubmit" | "autoFocus" | "defaultValue" | "isDisabled" | "labelPosition" | "validationState" | "helpText" | "errorText" | "successText" | "isRequired" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & PasswordInputExtraProps & Partial<MakeObjectResponsive<{
+declare const PasswordInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "value" | "onFocus" | "onBlur" | "onChange" | "onSubmit" | "autoFocus" | "defaultValue" | "isDisabled" | "labelPosition" | "helpText" | "errorText" | "successText" | "validationState" | "isRequired" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & PasswordInputExtraProps & Partial<MakeObjectResponsive<{
     margin: SpacingValueType | ArrayOfMaxLength4<SpacingValueType>;
     marginX: SpacingValueType;
     marginY: SpacingValueType;
@@ -4102,7 +4102,7 @@ declare type TextAreaProps = Pick<BaseInputProps, 'label' | 'labelPosition' | 'n
      */
     onClearButtonClick?: () => void;
 } & StyledPropsBlade;
-declare const TextArea: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "value" | "onFocus" | "onBlur" | "onChange" | "onSubmit" | "autoFocus" | "defaultValue" | "numberOfLines" | "isDisabled" | "labelPosition" | "validationState" | "helpText" | "errorText" | "necessityIndicator" | "successText" | "isRequired" | "maxCharacters"> & {
+declare const TextArea: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "value" | "onFocus" | "onBlur" | "onChange" | "onSubmit" | "autoFocus" | "defaultValue" | "numberOfLines" | "isDisabled" | "labelPosition" | "helpText" | "errorText" | "successText" | "necessityIndicator" | "validationState" | "isRequired" | "maxCharacters"> & {
     /**
      * Decides whether to render a clear icon button
      */
@@ -4270,7 +4270,7 @@ declare type SelectInputProps = Pick<BaseInputProps, 'label' | 'labelPosition' |
  *
  * Checkout {@link https://blade.razorpay.com/?path=/docs/components-dropdown-with-select--with-single-select SelectInput Documentation}.
  */
-declare const SelectInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "onFocus" | "onBlur" | "onClick" | "autoFocus" | "prefix" | "isDisabled" | "labelPosition" | "validationState" | "helpText" | "errorText" | "necessityIndicator" | "successText" | "isRequired" | "suffix"> & {
+declare const SelectInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "name" | "testID" | "placeholder" | "label" | "onFocus" | "onBlur" | "onClick" | "autoFocus" | "prefix" | "isDisabled" | "labelPosition" | "helpText" | "errorText" | "successText" | "necessityIndicator" | "suffix" | "validationState" | "isRequired"> & {
     icon?: IconComponent$1 | undefined;
     onChange?: (({ name, values }: {
         name?: string | undefined;

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

@@ -3812,7 +3812,7 @@ declare type TextInputProps = Pick<BaseInputProps, 'label' | 'labelPosition' | '
      */
     type?: Type;
 } & StyledPropsBlade;
-declare const TextInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "value" | "name" | "onBlur" | "onFocus" | "defaultValue" | "prefix" | "autoCapitalize" | "onChange" | "onSubmit" | "isDisabled" | "autoFocus" | "labelPosition" | "validationState" | "helpText" | "errorText" | "necessityIndicator" | "successText" | "isRequired" | "suffix" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & {
+declare const TextInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "value" | "name" | "onBlur" | "onFocus" | "defaultValue" | "prefix" | "autoCapitalize" | "onChange" | "onSubmit" | "isDisabled" | "autoFocus" | "labelPosition" | "helpText" | "errorText" | "successText" | "necessityIndicator" | "suffix" | "validationState" | "isRequired" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & {
     /**
      * Decides whether to render a clear icon button
      */
@@ -3901,7 +3901,7 @@ declare type PasswordInputExtraProps = {
     autoCompleteSuggestionType?: Extract<BaseInputProps['autoCompleteSuggestionType'], 'none' | 'password' | 'newPassword'>;
 };
 declare type PasswordInputProps = Pick<BaseInputProps, 'label' | 'labelPosition' | 'maxCharacters' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'isDisabled' | 'defaultValue' | 'placeholder' | 'isRequired' | 'value' | 'onChange' | 'onBlur' | 'onSubmit' | 'onFocus' | 'name' | 'autoFocus' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'testID'> & PasswordInputExtraProps & StyledPropsBlade;
-declare const PasswordInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "value" | "name" | "onBlur" | "onFocus" | "defaultValue" | "onChange" | "onSubmit" | "isDisabled" | "autoFocus" | "labelPosition" | "validationState" | "helpText" | "errorText" | "successText" | "isRequired" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & PasswordInputExtraProps & Partial<MakeObjectResponsive<{
+declare const PasswordInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "value" | "name" | "onBlur" | "onFocus" | "defaultValue" | "onChange" | "onSubmit" | "isDisabled" | "autoFocus" | "labelPosition" | "helpText" | "errorText" | "successText" | "validationState" | "isRequired" | "maxCharacters" | "keyboardReturnKeyType" | "autoCompleteSuggestionType"> & PasswordInputExtraProps & Partial<MakeObjectResponsive<{
     margin: SpacingValueType | ArrayOfMaxLength4<SpacingValueType>;
     marginX: SpacingValueType;
     marginY: SpacingValueType;
@@ -3946,7 +3946,7 @@ declare type TextAreaProps = Pick<BaseInputProps, 'label' | 'labelPosition' | 'n
      */
     onClearButtonClick?: () => void;
 } & StyledPropsBlade;
-declare const TextArea: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "value" | "name" | "onBlur" | "onFocus" | "numberOfLines" | "defaultValue" | "onChange" | "onSubmit" | "isDisabled" | "autoFocus" | "labelPosition" | "validationState" | "helpText" | "errorText" | "necessityIndicator" | "successText" | "isRequired" | "maxCharacters"> & {
+declare const TextArea: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "value" | "name" | "onBlur" | "onFocus" | "numberOfLines" | "defaultValue" | "onChange" | "onSubmit" | "isDisabled" | "autoFocus" | "labelPosition" | "helpText" | "errorText" | "successText" | "necessityIndicator" | "validationState" | "isRequired" | "maxCharacters"> & {
     /**
      * Decides whether to render a clear icon button
      */
@@ -4069,7 +4069,7 @@ declare type SelectInputProps = Pick<BaseInputProps, 'label' | 'labelPosition' |
  *
  * Checkout {@link https://blade.razorpay.com/?path=/docs/components-dropdown-with-select--with-single-select SelectInput Documentation}.
  */
-declare const SelectInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "name" | "onBlur" | "onFocus" | "onClick" | "prefix" | "isDisabled" | "autoFocus" | "labelPosition" | "validationState" | "helpText" | "errorText" | "necessityIndicator" | "successText" | "isRequired" | "suffix"> & {
+declare const SelectInput: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "testID" | "placeholder" | "label" | "name" | "onBlur" | "onFocus" | "onClick" | "prefix" | "isDisabled" | "autoFocus" | "labelPosition" | "helpText" | "errorText" | "successText" | "necessityIndicator" | "suffix" | "validationState" | "isRequired"> & {
     icon?: IconComponent$1 | undefined;
     onChange?: (({ name, values }: {
         name?: string | undefined;

package/build/components/index.native.js

@@ -2043,7 +2043,7 @@ nodeUtil && nodeUtil.isSet;
 
 var metaAttribute=function metaAttribute(_ref){var testID=_ref.testID;return _extends({},testID?{testID:testID}:{});};
 
-var MetaConstants={ActionList:'action-list',ActionListFooter:'action-list-footer',ActionListHeader:'action-list-header',ActionListItem:'action-list-item',ActionListSection:'action-list-section',Alert:'alert',Badge:'badge',Box:'Box',Button:'button',Checkbox:'checkbox',CheckboxGroup:'checkbox-group',Code:'code',Component:'blade-component',Counter:'counter',DropdownOverlay:'dropdown-overlay',Icon:'icon',IconButton:'icon-button',Indicator:'indicator',Link:'link',List:'list',ListItem:'list-item',OTPInput:'otp-input',ProgressBar:'progress-bar',Radio:'radio',RadioGroup:'radio-group',SkipNav:'skipnav',Spinner:'spinner',SelectInput:'select-input',Card:'card',CardBody:'card-body',CardHeader:'card-header',CardFooter:'card-footer',VisuallyHidden:'visually-hidden'};
+var MetaConstants={ActionList:'action-list',ActionListFooter:'action-list-footer',ActionListHeader:'action-list-header',ActionListItem:'action-list-item',ActionListSection:'action-list-section',Alert:'alert',Badge:'badge',Box:'box',Button:'button',Checkbox:'checkbox',CheckboxGroup:'checkbox-group',Code:'code',Component:'blade-component',Counter:'counter',DropdownOverlay:'dropdown-overlay',Icon:'icon',IconButton:'icon-button',Indicator:'indicator',Link:'link',List:'list',ListItem:'list-item',OTPInput:'otp-input',ProgressBar:'progress-bar',Radio:'radio',RadioGroup:'radio-group',SkipNav:'skipnav',Spinner:'spinner',SelectInput:'select-input',Card:'card',CardBody:'card-body',CardHeader:'card-header',CardFooter:'card-footer',VisuallyHidden:'visually-hidden'};
 
 var getColorScheme=function getColorScheme(){var colorScheme=arguments.length>0&&arguments[0]!==undefined?arguments[0]:'light';if(colorScheme==='light'||colorScheme==='dark'){return colorScheme;}if(colorScheme==='system'){var _Appearance$getColorS;return (_Appearance$getColorS=Appearance.getColorScheme())!=null?_Appearance$getColorS:'light';}return 'light';};
 
@@ -3250,7 +3250,7 @@ var StyledListBoxWrapper=styled(ScrollView)(function(props){return _extends({},g
 
 var componentIds={DropdownOverlay:'DropdownOverlay',Dropdown:'Dropdown'};var SelectActions={Close:'Close',CloseSelect:'CloseSelect',First:'First',Last:'Last',Next:'Next',Open:'Open',PageDown:'PageDown',PageUp:'PageUp',Previous:'Previous',Select:'Select',Type:'Type'};function filterOptions(){var options=arguments.length>0&&arguments[0]!==undefined?arguments[0]:[];var filter=arguments.length>1?arguments[1]:undefined;var exclude=arguments.length>2&&arguments[2]!==undefined?arguments[2]:[];return options.filter(function(option){var matches=option.toLowerCase().startsWith(filter.toLowerCase());return matches&&!exclude.includes(option);});}function getActionFromKey(e,isOpen){if(!e){return undefined;}var altKey=e.altKey,ctrlKey=e.ctrlKey,metaKey=e.metaKey;var key='';if('key'in e){key=e.key;}var openKeys=['ArrowDown','ArrowUp','Enter',' '];if(!key)return undefined;if(!isOpen&&key&&openKeys.includes(key)){return SelectActions.Open;}if(key==='Home'){return SelectActions.First;}if(key==='End'){return SelectActions.Last;}if(key==='Backspace'||key==='Clear'||key.length===1&&key!==' '&&!altKey&&!ctrlKey&&!metaKey){return SelectActions.Type;}if(isOpen){if(key==='ArrowUp'&&altKey){return SelectActions.CloseSelect;}else if(key==='ArrowDown'&&!altKey){return SelectActions.Next;}else if(key==='ArrowUp'){return SelectActions.Previous;}else if(key==='PageUp'){return SelectActions.PageUp;}else if(key==='PageDown'){return SelectActions.PageDown;}else if(key==='Escape'){return SelectActions.Close;}else if(key==='Enter'||key===' '){return SelectActions.CloseSelect;}}return undefined;}function getIndexByLetter(options,filter){var startIndex=arguments.length>2&&arguments[2]!==undefined?arguments[2]:0;var orderedOptions=[].concat(_toConsumableArray(options.slice(startIndex)),_toConsumableArray(options.slice(0,startIndex)));var firstMatch=filterOptions(orderedOptions,filter)[0];var allSameLetter=function allSameLetter(array){return array.every(function(letter){return letter===array[0];});};if(firstMatch){return options.indexOf(firstMatch);}else if(allSameLetter(filter.split(''))){var matches=filterOptions(orderedOptions,filter[0]);return options.indexOf(matches[0]);}else {return -1;}}function getUpdatedIndex(currentIndex,maxIndex,action){var pageSize=10;switch(action){case SelectActions.First:return 0;case SelectActions.Last:return maxIndex;case SelectActions.Previous:return Math.max(0,currentIndex-1);case SelectActions.Next:return Math.min(maxIndex,currentIndex+1);case SelectActions.PageUp:return Math.max(0,currentIndex-pageSize);case SelectActions.PageDown:return Math.min(maxIndex,currentIndex+pageSize);default:return currentIndex;}}function isElementVisibleOnScreen(element){var bounding=element.getBoundingClientRect();return bounding.top>=0&&bounding.left>=0&&bounding.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&bounding.right<=(window.innerWidth||document.documentElement.clientWidth);}function isScrollable(element){return element&&element.clientHeight<element.scrollHeight;}var performAction=function performAction(action,e,actions){var event=e.event;switch(action){case SelectActions.Last:case SelectActions.First:actions.setIsOpen(true);case SelectActions.Next:case SelectActions.Previous:case SelectActions.PageUp:case SelectActions.PageDown:event.preventDefault();actions.onOptionChange(action);return true;case SelectActions.CloseSelect:event.preventDefault();actions.selectCurrentOption();return true;case SelectActions.Close:event.preventDefault();actions.setIsOpen(false);return true;case SelectActions.Type:actions.onComboType(event.key,action);return true;case SelectActions.Open:event.preventDefault();actions.setIsOpen(true);return true;}return false;};var ensureScrollVisiblity=function ensureScrollVisiblity(newActiveIndex,containerElement,options){if(containerElement){if(isScrollable(containerElement)){var optionEl=containerElement.querySelectorAll('[role="option"]');if(newActiveIndex>=0&&optionEl[newActiveIndex].dataset.value===options[newActiveIndex]){var activeElement=optionEl[newActiveIndex];var bodyRect=containerElement.getBoundingClientRect().top;var elementRect=activeElement.getBoundingClientRect().top;var elementPosition=elementRect-bodyRect;var offsetPosition=elementPosition;containerElement.scrollTo({top:offsetPosition});if(!isElementVisibleOnScreen(optionEl[newActiveIndex])){activeElement.scrollIntoView({behavior:'smooth'});}}}}};var makeInputValue=function makeInputValue(selectedIndices,options){if(options.length===0){return '';}return selectedIndices.map(function(selectedIndex){var _options$selectedInde;return (_options$selectedInde=options[selectedIndex])==null?void 0:_options$selectedInde.value;}).join(', ');};var makeInputDisplayValue=function makeInputDisplayValue(selectedIndices,options){if(options.length===0||selectedIndices.length===0){return '';}if(selectedIndices.length===1){return options[selectedIndices[0]].title;}return selectedIndices.length+" items selected";};
 
-var _excluded$4N=["isOpen","setIsOpen","selectedIndices","setSelectedIndices","activeIndex","setActiveIndex","shouldIgnoreBlur","setShouldIgnoreBlur","isKeydownPressed","setIsKeydownPressed","options","selectionType"];var noop=function noop(){};var DropdownContext=React__default.createContext({isOpen:false,setIsOpen:noop,selectedIndices:[],setSelectedIndices:noop,options:[],setOptions:noop,activeIndex:-1,setActiveIndex:noop,shouldIgnoreBlur:false,setShouldIgnoreBlur:noop,shouldIgnoreBlurAnimation:false,setShouldIgnoreBlurAnimation:noop,hasFooterAction:false,setHasFooterAction:noop,hasLabelOnLeft:false,setHasLabelOnLeft:noop,isKeydownPressed:false,setIsKeydownPressed:noop,dropdownBaseId:'',actionListItemRef:{current:null},triggererRef:{current:null}});var searchTimeout;var searchString='';var useDropdown=function useDropdown(){var _React$useContext=React__default.useContext(DropdownContext),isOpen=_React$useContext.isOpen,setIsOpen=_React$useContext.setIsOpen,selectedIndices=_React$useContext.selectedIndices,setSelectedIndices=_React$useContext.setSelectedIndices,activeIndex=_React$useContext.activeIndex,setActiveIndex=_React$useContext.setActiveIndex,shouldIgnoreBlur=_React$useContext.shouldIgnoreBlur,setShouldIgnoreBlur=_React$useContext.setShouldIgnoreBlur,isKeydownPressed=_React$useContext.isKeydownPressed,setIsKeydownPressed=_React$useContext.setIsKeydownPressed,options=_React$useContext.options,selectionType=_React$useContext.selectionType,rest=_objectWithoutProperties(_React$useContext,_excluded$4N);var selectOption=function selectOption(index){var properties=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{closeOnSelection:true};if(index<0||index>options.length-1){return;}if(selectionType==='multiple'){if(selectedIndices.includes(index)){var existingItemIndex=selectedIndices.indexOf(index);setSelectedIndices([].concat(_toConsumableArray(selectedIndices.slice(0,existingItemIndex)),_toConsumableArray(selectedIndices.slice(existingItemIndex+1))));}else {setSelectedIndices([].concat(_toConsumableArray(selectedIndices),[index]));}}else {setSelectedIndices([index]);}if(activeIndex!==index){setActiveIndex(index);}if(properties!=null&&properties.closeOnSelection&&selectionType!=='multiple'){setIsOpen(false);}};var onTriggerClick=function onTriggerClick(){setIsOpen(!isOpen);};var onTriggerBlur=function onTriggerBlur(){if(rest.hasFooterAction){setActiveIndex(-1);}if(shouldIgnoreBlur){setShouldIgnoreBlur(false);return;}if(isOpen){if(selectionType!=='multiple'){selectOption(activeIndex);}setIsOpen(false);}};var onOptionChange=function onOptionChange(actionType,index){var max=options.length-1;var newIndex=index!=null?index:activeIndex;setActiveIndex(getUpdatedIndex(newIndex,max,actionType));var optionValues=options.map(function(option){return option.value;});ensureScrollVisiblity(newIndex,rest.actionListItemRef.current,optionValues);};var onOptionClick=function onOptionClick(e,index){var actionType=getActionFromKey(e,isOpen);if(typeof actionType==='number'){onOptionChange(actionType,index);}selectOption(index);if(!isReactNative$4()){var _rest$triggererRef$cu;(_rest$triggererRef$cu=rest.triggererRef.current)==null?void 0:_rest$triggererRef$cu.focus();}};var onComboType=function onComboType(letter,actionType){setIsOpen(true);if(typeof searchTimeout==='number'){window.clearTimeout(searchTimeout);}searchTimeout=window.setTimeout(function(){searchString='';},500);searchString=searchString+letter;var optionTitles=options.map(function(option){return option.title;});var searchIndex=getIndexByLetter(optionTitles,searchString,activeIndex+1);if(searchIndex>=0){onOptionChange(actionType,searchIndex);}else {window.clearTimeout(searchTimeout);searchString='';}};var onTriggerKeydown=function onTriggerKeydown(e){if(e.event.key==='Tab'&&rest.hasFooterAction){setShouldIgnoreBlur(true);}if(!isKeydownPressed&&![' ','Enter','Escape','Meta'].includes(e.event.key)){setIsKeydownPressed(true);}var actionType=getActionFromKey(e.event,isOpen);if(actionType){performAction(actionType,e,{setIsOpen:setIsOpen,onOptionChange:onOptionChange,onComboType:onComboType,selectCurrentOption:function selectCurrentOption(){var _options$activeIndex;selectOption(activeIndex);if(rest.hasFooterAction&&!isReactNative$4()){var _rest$triggererRef$cu2;(_rest$triggererRef$cu2=rest.triggererRef.current)==null?void 0:_rest$triggererRef$cu2.focus();}var anchorLink=(_options$activeIndex=options[activeIndex])==null?void 0:_options$activeIndex.href;if(anchorLink){window.location.href=anchorLink;if(window.top){window.top.location.href=anchorLink;}}}});}};return _extends({isOpen:isOpen,setIsOpen:setIsOpen,selectedIndices:selectedIndices,setSelectedIndices:setSelectedIndices,onTriggerClick:onTriggerClick,onTriggerKeydown:onTriggerKeydown,onTriggerBlur:onTriggerBlur,onOptionClick:onOptionClick,activeIndex:activeIndex,setActiveIndex:setActiveIndex,shouldIgnoreBlur:shouldIgnoreBlur,setShouldIgnoreBlur:setShouldIgnoreBlur,isKeydownPressed:isKeydownPressed,setIsKeydownPressed:setIsKeydownPressed,options:options,value:makeInputValue(selectedIndices,options),displayValue:makeInputDisplayValue(selectedIndices,options),selectionType:selectionType},rest);};
+var _excluded$4N=["isOpen","setIsOpen","selectedIndices","setSelectedIndices","activeIndex","setActiveIndex","shouldIgnoreBlur","setShouldIgnoreBlur","isKeydownPressed","setIsKeydownPressed","options","selectionType"];var noop=function noop(){};var DropdownContext=React__default.createContext({isOpen:false,setIsOpen:noop,selectedIndices:[],setSelectedIndices:noop,options:[],setOptions:noop,activeIndex:-1,setActiveIndex:noop,shouldIgnoreBlur:false,setShouldIgnoreBlur:noop,shouldIgnoreBlurAnimation:false,setShouldIgnoreBlurAnimation:noop,hasFooterAction:false,setHasFooterAction:noop,hasLabelOnLeft:false,setHasLabelOnLeft:noop,isKeydownPressed:false,setIsKeydownPressed:noop,dropdownBaseId:'',actionListItemRef:{current:null},triggererRef:{current:null}});var searchTimeout;var searchString='';var useDropdown=function useDropdown(){var _React$useContext=React__default.useContext(DropdownContext),isOpen=_React$useContext.isOpen,setIsOpen=_React$useContext.setIsOpen,selectedIndices=_React$useContext.selectedIndices,setSelectedIndices=_React$useContext.setSelectedIndices,activeIndex=_React$useContext.activeIndex,setActiveIndex=_React$useContext.setActiveIndex,shouldIgnoreBlur=_React$useContext.shouldIgnoreBlur,setShouldIgnoreBlur=_React$useContext.setShouldIgnoreBlur,isKeydownPressed=_React$useContext.isKeydownPressed,setIsKeydownPressed=_React$useContext.setIsKeydownPressed,options=_React$useContext.options,selectionType=_React$useContext.selectionType,rest=_objectWithoutProperties(_React$useContext,_excluded$4N);var selectOption=function selectOption(index){var properties=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{closeOnSelection:true};if(index<0||index>options.length-1){return;}if(selectionType==='multiple'){if(selectedIndices.includes(index)){var existingItemIndex=selectedIndices.indexOf(index);setSelectedIndices([].concat(_toConsumableArray(selectedIndices.slice(0,existingItemIndex)),_toConsumableArray(selectedIndices.slice(existingItemIndex+1))));}else {setSelectedIndices([].concat(_toConsumableArray(selectedIndices),[index]));}}else {setSelectedIndices([index]);}if(activeIndex!==index){setActiveIndex(index);}if(properties!=null&&properties.closeOnSelection&&selectionType!=='multiple'){setIsOpen(false);}};var onTriggerClick=function onTriggerClick(){setIsOpen(!isOpen);};var onTriggerBlur=function onTriggerBlur(_ref){var name=_ref.name,value=_ref.value,onBlurCallback=_ref.onBlurCallback;if(rest.hasFooterAction){setActiveIndex(-1);}if(shouldIgnoreBlur){setShouldIgnoreBlur(false);return;}onBlurCallback==null?void 0:onBlurCallback({name:name,value:value});if(isOpen){if(selectionType!=='multiple'){selectOption(activeIndex);}setIsOpen(false);}};var onOptionChange=function onOptionChange(actionType,index){var max=options.length-1;var newIndex=index!=null?index:activeIndex;setActiveIndex(getUpdatedIndex(newIndex,max,actionType));var optionValues=options.map(function(option){return option.value;});ensureScrollVisiblity(newIndex,rest.actionListItemRef.current,optionValues);};var onOptionClick=function onOptionClick(e,index){var actionType=getActionFromKey(e,isOpen);if(typeof actionType==='number'){onOptionChange(actionType,index);}selectOption(index);if(!isReactNative$4()){var _rest$triggererRef$cu;(_rest$triggererRef$cu=rest.triggererRef.current)==null?void 0:_rest$triggererRef$cu.focus();}};var onComboType=function onComboType(letter,actionType){setIsOpen(true);if(typeof searchTimeout==='number'){window.clearTimeout(searchTimeout);}searchTimeout=window.setTimeout(function(){searchString='';},500);searchString=searchString+letter;var optionTitles=options.map(function(option){return option.title;});var searchIndex=getIndexByLetter(optionTitles,searchString,activeIndex+1);if(searchIndex>=0){onOptionChange(actionType,searchIndex);}else {window.clearTimeout(searchTimeout);searchString='';}};var onTriggerKeydown=function onTriggerKeydown(e){if(e.event.key==='Tab'&&rest.hasFooterAction){setShouldIgnoreBlur(true);}if(!isKeydownPressed&&![' ','Enter','Escape','Meta'].includes(e.event.key)){setIsKeydownPressed(true);}var actionType=getActionFromKey(e.event,isOpen);if(actionType){performAction(actionType,e,{setIsOpen:setIsOpen,onOptionChange:onOptionChange,onComboType:onComboType,selectCurrentOption:function selectCurrentOption(){var _options$activeIndex;selectOption(activeIndex);if(rest.hasFooterAction&&!isReactNative$4()){var _rest$triggererRef$cu2;(_rest$triggererRef$cu2=rest.triggererRef.current)==null?void 0:_rest$triggererRef$cu2.focus();}var anchorLink=(_options$activeIndex=options[activeIndex])==null?void 0:_options$activeIndex.href;if(anchorLink){window.location.href=anchorLink;if(window.top){window.top.location.href=anchorLink;}}}});}};return _extends({isOpen:isOpen,setIsOpen:setIsOpen,selectedIndices:selectedIndices,setSelectedIndices:setSelectedIndices,onTriggerClick:onTriggerClick,onTriggerKeydown:onTriggerKeydown,onTriggerBlur:onTriggerBlur,onOptionClick:onOptionClick,activeIndex:activeIndex,setActiveIndex:setActiveIndex,shouldIgnoreBlur:shouldIgnoreBlur,setShouldIgnoreBlur:setShouldIgnoreBlur,isKeydownPressed:isKeydownPressed,setIsKeydownPressed:setIsKeydownPressed,options:options,value:makeInputValue(selectedIndices,options),displayValue:makeInputDisplayValue(selectedIndices,options),selectionType:selectionType},rest);};
 
 var ThemeContext=createContext({theme:null,colorScheme:'light',platform:'onDesktop',setColorScheme:function setColorScheme(){return null;}});var useTheme=function useTheme(){var themeContext=useContext(ThemeContext);if(!themeContext.theme){throw new Error("[@razorpay/blade:BladeProvider]: BladeProvider is missing theme");}if(themeContext===undefined){throw new Error("[@razorpay/blade:BladeProvider]: useTheme must be used within BladeProvider");}return themeContext;};
 
@@ -3990,7 +3990,7 @@ var StyledCounter=styled(BaseBox)(function(props){return _extends({},getStyledCo
 
 var _excluded$f=["value","max","intent","contrast","size","testID"];var getColorProps=function getColorProps(_ref){var _ref$intent=_ref.intent,intent=_ref$intent===void 0?'neutral':_ref$intent,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast;var props={textColor:"feedback.text."+intent+"."+contrast+"Contrast",backgroundColor:"feedback.background."+intent+"."+contrast+"Contrast"};return props;};var Counter=function Counter(_ref2){var value=_ref2.value,max=_ref2.max,_ref2$intent=_ref2.intent,intent=_ref2$intent===void 0?'neutral':_ref2$intent,_ref2$contrast=_ref2.contrast,contrast=_ref2$contrast===void 0?'low':_ref2$contrast,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size,testID=_ref2.testID,styledProps=_objectWithoutProperties(_ref2,_excluded$f);var content=""+value;if(max&&value>max){content=max+"+";}var _useTheme=useTheme(),platform=_useTheme.platform;var _getColorProps=getColorProps({intent:intent,contrast:contrast}),backgroundColor=_getColorProps.backgroundColor,textColor=_getColorProps.textColor;var counterTextSizes={small:{variant:'body',size:'xsmall'},medium:{variant:'body',size:'small'},large:{variant:'body',size:'medium'}};return jsx(StyledCounter,_extends({backgroundColor:backgroundColor,size:size,platform:platform},getStyledProps(styledProps),{children:jsx(BaseBox,_extends({paddingRight:horizontalPadding[size],paddingLeft:horizontalPadding[size],paddingTop:verticalPadding[size],paddingBottom:verticalPadding[size],display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",overflow:"hidden"},metaAttribute({name:MetaConstants.Counter,testID:testID}),{children:jsx(Text,_extends({},counterTextSizes[size],{type:"normal",weight:"regular",truncateAfterLines:1,color:textColor,children:content}))}))}));};
 
-var CardHeaderIcon=function CardHeaderIcon(_ref){var Icon=_ref.icon;useVerifyInsideCard('CardHeaderIcon');return jsx(Icon,{color:"surface.text.normal.lowContrast",size:"xlarge"});};CardHeaderIcon.componentId=ComponentIds$1.CardHeaderIcon;var CardHeaderCounter=function CardHeaderCounter(props){useVerifyInsideCard('CardHeaderCounter');return jsx(Counter,_extends({},props));};CardHeaderCounter.componentId=ComponentIds$1.CardHeaderCounter;var CardHeaderBadge=function CardHeaderBadge(props){useVerifyInsideCard('CardHeaderBadge');return jsx(Badge,_extends({},props));};CardHeaderBadge.componentId=ComponentIds$1.CardHeaderBadge;var CardHeaderText=function CardHeaderText(props){useVerifyInsideCard('CardHeaderText');return jsx(Text,_extends({},props));};CardHeaderText.componentId=ComponentIds$1.CardHeaderText;var CardHeaderLink=function CardHeaderLink(props){useVerifyInsideCard('CardHeaderLink');return jsx(Link,_extends({},props));};CardHeaderLink.componentId=ComponentIds$1.CardHeaderLink;var CardHeaderIconButton=function CardHeaderIconButton(props){useVerifyInsideCard('CardHeaderIconButton');return jsx(BaseBox,{width:makeSpace(minHeight.xsmall),children:jsx(Button,_extends({},props,{variant:"tertiary",size:"xsmall",iconPosition:"left",isFullWidth:true}))});};CardHeaderIconButton.componentId=ComponentIds$1.CardHeaderIconButton;var CardHeader=function CardHeader(_ref2){var children=_ref2.children,testID=_ref2.testID;useVerifyInsideCard('CardHeader');useVerifyAllowedComponents(children,'CardHeader',[ComponentIds$1.CardHeaderLeading,ComponentIds$1.CardHeaderTrailing]);return jsxs(BaseBox,_extends({marginBottom:"spacing.7"},metaAttribute({name:MetaConstants.CardHeader,testID:testID}),{children:[jsx(BaseBox,{marginBottom:"spacing.7",display:"flex",flexDirection:"row",justifyContent:"space-between",children:children}),jsx(Divider,{})]}));};CardHeader.componentId=ComponentIds$1.CardHeader;var CardHeaderLeading=function CardHeaderLeading(_ref3){var title=_ref3.title,subtitle=_ref3.subtitle,prefix=_ref3.prefix,suffix=_ref3.suffix;useVerifyInsideCard('CardHeaderLeading');if(prefix&&!isValidAllowedChildren(prefix,ComponentIds$1.CardHeaderIcon)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds$1.CardHeaderIcon+"` component is accepted in prefix");}if(suffix&&!isValidAllowedChildren(suffix,ComponentIds$1.CardHeaderCounter)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds$1.CardHeaderCounter+"` component is accepted in prefix");}return jsxs(BaseBox,{flex:1,display:"flex",flexDirection:"row",children:[jsx(BaseBox,{marginRight:"spacing.3",alignSelf:"center",display:"flex",children:prefix}),jsxs(BaseBox,{children:[jsxs(BaseBox,{display:"flex",flexDirection:"row",alignItems:"center",flexWrap:"wrap",children:[jsx(Heading,{size:"small",variant:"regular",type:"normal",children:title}),jsx(BaseBox,{marginLeft:"spacing.3",children:suffix})]}),jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]})]});};CardHeaderLeading.componentId=ComponentIds$1.CardHeaderLeading;var headerTrailingAllowedComponents=[ComponentIds$1.CardHeaderLink,ComponentIds$1.CardHeaderText,ComponentIds$1.CardHeaderIconButton,ComponentIds$1.CardHeaderBadge];var CardHeaderTrailing=function CardHeaderTrailing(_ref4){var visual=_ref4.visual;useVerifyInsideCard('CardHeaderTrailing');if(visual&&!headerTrailingAllowedComponents.includes(getComponentId(visual))){throw new Error("[Blade CardHeaderTrailing]: Only one of `"+headerTrailingAllowedComponents.join(', ')+"` component is accepted in visual");}return jsx(BaseBox,{alignSelf:"center",children:visual});};CardHeaderTrailing.componentId=ComponentIds$1.CardHeaderTrailing;
+var CardHeaderIcon=function CardHeaderIcon(_ref){var Icon=_ref.icon;useVerifyInsideCard('CardHeaderIcon');return jsx(Icon,{color:"surface.text.normal.lowContrast",size:"xlarge"});};CardHeaderIcon.componentId=ComponentIds$1.CardHeaderIcon;var CardHeaderCounter=function CardHeaderCounter(props){useVerifyInsideCard('CardHeaderCounter');return jsx(Counter,_extends({},props));};CardHeaderCounter.componentId=ComponentIds$1.CardHeaderCounter;var CardHeaderBadge=function CardHeaderBadge(props){useVerifyInsideCard('CardHeaderBadge');return jsx(Badge,_extends({},props));};CardHeaderBadge.componentId=ComponentIds$1.CardHeaderBadge;var CardHeaderText=function CardHeaderText(props){useVerifyInsideCard('CardHeaderText');return jsx(Text,_extends({},props));};CardHeaderText.componentId=ComponentIds$1.CardHeaderText;var CardHeaderLink=function CardHeaderLink(props){useVerifyInsideCard('CardHeaderLink');return jsx(Link,_extends({},props));};CardHeaderLink.componentId=ComponentIds$1.CardHeaderLink;var CardHeaderIconButton=function CardHeaderIconButton(props){useVerifyInsideCard('CardHeaderIconButton');return jsx(BaseBox,{width:makeSpace(minHeight.xsmall),children:jsx(Button,_extends({},props,{variant:"tertiary",size:"xsmall",iconPosition:"left",isFullWidth:true}))});};CardHeaderIconButton.componentId=ComponentIds$1.CardHeaderIconButton;var CardHeader=function CardHeader(_ref2){var children=_ref2.children,testID=_ref2.testID;useVerifyInsideCard('CardHeader');useVerifyAllowedComponents(children,'CardHeader',[ComponentIds$1.CardHeaderLeading,ComponentIds$1.CardHeaderTrailing]);return jsxs(BaseBox,_extends({marginBottom:"spacing.7"},metaAttribute({name:MetaConstants.CardHeader,testID:testID}),{children:[jsx(BaseBox,{marginBottom:"spacing.7",display:"flex",flexDirection:"row",justifyContent:"space-between",children:children}),jsx(Divider,{})]}));};CardHeader.componentId=ComponentIds$1.CardHeader;var CardHeaderLeading=function CardHeaderLeading(_ref3){var title=_ref3.title,subtitle=_ref3.subtitle,prefix=_ref3.prefix,suffix=_ref3.suffix;useVerifyInsideCard('CardHeaderLeading');if(prefix&&!isValidAllowedChildren(prefix,ComponentIds$1.CardHeaderIcon)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds$1.CardHeaderIcon+"` component is accepted in prefix");}if(suffix&&!isValidAllowedChildren(suffix,ComponentIds$1.CardHeaderCounter)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds$1.CardHeaderCounter+"` component is accepted in prefix");}return jsxs(BaseBox,{flex:1,display:"flex",flexDirection:"row",children:[jsx(BaseBox,{marginRight:"spacing.3",alignSelf:"center",display:"flex",children:prefix}),jsxs(BaseBox,{children:[jsxs(BaseBox,{display:"flex",flexDirection:"row",alignItems:"center",flexWrap:"wrap",children:[jsx(Heading,{size:"small",variant:"regular",type:"normal",children:title}),jsx(BaseBox,{marginLeft:"spacing.3",children:suffix})]}),subtitle&&jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]})]});};CardHeaderLeading.componentId=ComponentIds$1.CardHeaderLeading;var headerTrailingAllowedComponents=[ComponentIds$1.CardHeaderLink,ComponentIds$1.CardHeaderText,ComponentIds$1.CardHeaderIconButton,ComponentIds$1.CardHeaderBadge];var CardHeaderTrailing=function CardHeaderTrailing(_ref4){var visual=_ref4.visual;useVerifyInsideCard('CardHeaderTrailing');if(visual&&!headerTrailingAllowedComponents.includes(getComponentId(visual))){throw new Error("[Blade CardHeaderTrailing]: Only one of `"+headerTrailingAllowedComponents.join(', ')+"` component is accepted in visual");}return jsx(BaseBox,{alignSelf:"center",children:visual});};CardHeaderTrailing.componentId=ComponentIds$1.CardHeaderTrailing;
 
 var useIsMobile=function useIsMobile(){var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;return matchedDeviceType==='mobile';};var CardFooter=function CardFooter(_ref){var children=_ref.children,testID=_ref.testID;var isMobile=useIsMobile();useVerifyInsideCard('CardFooter');useVerifyAllowedComponents(children,'CardFooter',[ComponentIds$1.CardFooterLeading,ComponentIds$1.CardFooterTrailing]);return jsxs(BaseBox,_extends({marginTop:"auto"},metaAttribute({name:MetaConstants.CardFooter,testID:testID}),{children:[jsx(BaseBox,{marginTop:"spacing.7"}),jsx(Divider,{}),jsx(BaseBox,{marginTop:"spacing.7",display:"flex",flexDirection:isMobile?'column':'row',justifyContent:"space-between",alignItems:isMobile?'stretch':'center',children:children})]}));};CardFooter.componentId=ComponentIds$1.CardFooter;var CardFooterLeading=function CardFooterLeading(_ref2){var title=_ref2.title,subtitle=_ref2.subtitle;useVerifyInsideCard('CardFooterLeading');return jsxs(BaseBox,{children:[title&&jsx(Text,{variant:"body",size:"medium",weight:"bold",children:title}),subtitle&&jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]});};CardFooterLeading.componentId=ComponentIds$1.CardFooterLeading;var CardFooterTrailing=function CardFooterTrailing(_ref3){var actions=_ref3.actions;var isMobile=useIsMobile();useVerifyInsideCard('CardFooterTrailing');return jsxs(BaseBox,{display:"flex",flexDirection:"row",alignSelf:isMobile?'auto':'center',marginTop:isMobile?'spacing.5':'spacing.0',marginLeft:isMobile?'spacing.0':'spacing.5',children:[jsx(BaseBox,{flexGrow:1,children:actions!=null&&actions.secondary?jsx(Button,_extends({isFullWidth:true,size:"medium",variant:"secondary"},actions.secondary,{children:actions.secondary.text})):null}),jsx(BaseBox,{marginLeft:"spacing.5"}),jsx(BaseBox,{flexGrow:1,children:actions!=null&&actions.primary?jsx(Button,_extends({isFullWidth:true,size:"medium"},actions.primary,{children:actions.primary.text})):null})]});};CardFooterTrailing.componentId=ComponentIds$1.CardFooterTrailing;
 
@@ -4026,7 +4026,7 @@ var _excluded$6=["autoFocus","errorText","helpText","isDisabled","keyboardReturn
 
 var StyledChevronIconContainer=styled(TouchableOpacity)(function(_props){return {display:'flex',justifyContent:'center'};});var SelectChevronIcon=function SelectChevronIcon(props){var Icon=props.icon;return jsx(StyledChevronIconContainer,{accessibilityLabel:"Chevron Icon",onPress:props.onClick,children:jsx(Icon,{color:"surface.text.normal.lowContrast",size:"medium"})});};
 
-var _excluded$5=["icon","onChange","placeholder"];var _SelectInput=function _SelectInput(props,ref){var _useDropdown=useDropdown(),isOpen=_useDropdown.isOpen,value=_useDropdown.value,displayValue=_useDropdown.displayValue,onTriggerClick=_useDropdown.onTriggerClick,onTriggerKeydown=_useDropdown.onTriggerKeydown,onTriggerBlur=_useDropdown.onTriggerBlur,dropdownBaseId=_useDropdown.dropdownBaseId,activeIndex=_useDropdown.activeIndex,triggererRef=_useDropdown.triggererRef,hasFooterAction=_useDropdown.hasFooterAction,dropdownTriggerer=_useDropdown.dropdownTriggerer,shouldIgnoreBlurAnimation=_useDropdown.shouldIgnoreBlurAnimation,setHasLabelOnLeft=_useDropdown.setHasLabelOnLeft;var inputRef=useBladeInnerRef(ref,{onFocus:function onFocus(opts){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus(opts);}});var icon=props.icon,onChange=props.onChange,_props$placeholder=props.placeholder,placeholder=_props$placeholder===void 0?'Select Option':_props$placeholder,baseInputProps=_objectWithoutProperties(props,_excluded$5);React__default.useEffect(function(){onChange==null?void 0:onChange({name:props.name,values:value.split(', ')});},[value,props.name]);React__default.useEffect(function(){setHasLabelOnLeft(props.labelPosition==='left');},[props.labelPosition,setHasLabelOnLeft]);return jsxs(BaseBox,{position:"relative",children:[!isReactNative$4()?jsx(VisuallyHidden,{children:jsx("input",{ref:inputRef,tabIndex:-1,required:props.isRequired,name:props.name,value:value,onChange:function onChange(){},"aria-hidden":true})}):null,jsx(BaseInput,_extends({},baseInputProps,{as:"button",componentName:MetaConstants.SelectInput,ref:!isReactNative$4()?triggererRef:null,textAlign:"left",value:displayValue,placeholder:placeholder,id:dropdownBaseId+"-trigger",labelId:dropdownBaseId+"-label",leadingIcon:icon,hasPopup:getActionListContainerRole(hasFooterAction,dropdownTriggerer),isPopupExpanded:isOpen,onClick:onTriggerClick,onKeyDown:onTriggerKeydown,onBlur:onTriggerBlur,activeDescendant:activeIndex>=0?dropdownBaseId+"-"+activeIndex:undefined,popupId:dropdownBaseId+"-actionlist",shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,interactionElement:jsx(SelectChevronIcon,{onClick:function onClick(){if(!isReactNative$4()){var _triggererRef$current2;(_triggererRef$current2=triggererRef.current)==null?void 0:_triggererRef$current2.focus();}onTriggerClick();},icon:isOpen?ChevronUpIcon:ChevronDownIcon}),testID:props.testID}))]});};var SelectInput=React__default.forwardRef(_SelectInput);SelectInput.componentId='SelectInput';
+var _excluded$5=["icon","onChange","placeholder","onBlur"];var _SelectInput=function _SelectInput(props,ref){var _useDropdown=useDropdown(),isOpen=_useDropdown.isOpen,value=_useDropdown.value,displayValue=_useDropdown.displayValue,onTriggerClick=_useDropdown.onTriggerClick,onTriggerKeydown=_useDropdown.onTriggerKeydown,onTriggerBlur=_useDropdown.onTriggerBlur,dropdownBaseId=_useDropdown.dropdownBaseId,activeIndex=_useDropdown.activeIndex,triggererRef=_useDropdown.triggererRef,hasFooterAction=_useDropdown.hasFooterAction,dropdownTriggerer=_useDropdown.dropdownTriggerer,shouldIgnoreBlurAnimation=_useDropdown.shouldIgnoreBlurAnimation,setHasLabelOnLeft=_useDropdown.setHasLabelOnLeft;var inputRef=useBladeInnerRef(ref,{onFocus:function onFocus(opts){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus(opts);}});var icon=props.icon,onChange=props.onChange,_props$placeholder=props.placeholder,placeholder=_props$placeholder===void 0?'Select Option':_props$placeholder,_onBlur=props.onBlur,baseInputProps=_objectWithoutProperties(props,_excluded$5);React__default.useEffect(function(){onChange==null?void 0:onChange({name:props.name,values:value.split(', ')});},[value,props.name]);React__default.useEffect(function(){setHasLabelOnLeft(props.labelPosition==='left');},[props.labelPosition,setHasLabelOnLeft]);return jsxs(BaseBox,{position:"relative",children:[!isReactNative$4()?jsx(VisuallyHidden,{children:jsx("input",{ref:inputRef,tabIndex:-1,required:props.isRequired,name:props.name,value:value,onChange:function onChange(){},"aria-hidden":true})}):null,jsx(BaseInput,_extends({},baseInputProps,{as:"button",componentName:MetaConstants.SelectInput,ref:!isReactNative$4()?triggererRef:null,textAlign:"left",value:displayValue,placeholder:placeholder,id:dropdownBaseId+"-trigger",labelId:dropdownBaseId+"-label",leadingIcon:icon,hasPopup:getActionListContainerRole(hasFooterAction,dropdownTriggerer),isPopupExpanded:isOpen,onClick:onTriggerClick,onKeyDown:onTriggerKeydown,onBlur:function onBlur(_ref){var name=_ref.name;onTriggerBlur==null?void 0:onTriggerBlur({name:name,value:value,onBlurCallback:_onBlur});},activeDescendant:activeIndex>=0?dropdownBaseId+"-"+activeIndex:undefined,popupId:dropdownBaseId+"-actionlist",shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,interactionElement:jsx(SelectChevronIcon,{onClick:function onClick(){if(!isReactNative$4()){var _triggererRef$current2;(_triggererRef$current2=triggererRef.current)==null?void 0:_triggererRef$current2.focus();}onTriggerClick();},icon:isOpen?ChevronUpIcon:ChevronDownIcon}),testID:props.testID}))]});};var SelectInput=React__default.forwardRef(_SelectInput);SelectInput.componentId='SelectInput';
 
 var _excluded$4=["accessibilityLabel","children","size","intent","testID"];var Indicator=function Indicator(_ref){var accessibilityLabel=_ref.accessibilityLabel,children=_ref.children,_ref$size=_ref.size,size$1=_ref$size===void 0?'medium':_ref$size,_ref$intent=_ref.intent,intent=_ref$intent===void 0?'neutral':_ref$intent,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$4);var _useTheme=useTheme(),theme=_useTheme.theme;var childrenString=getStringFromReactText(children);var fillColor=theme.colors.feedback.background[intent].highContrast;var strokeColor=theme.colors.brand.gray.a100.highContrast;var getDimension=useCallback(function(){switch(size$1){case'small':return {svgSize:size[6],textSize:'small'};case'large':return {svgSize:size[10],textSize:'medium'};default:return {svgSize:size[8],textSize:'medium'};}},[size$1]);var dimensions=getDimension();var isReactNative=getPlatformType()==='react-native';var isWeb=!isReactNative;var a11yProps=makeAccessible(_extends({label:accessibilityLabel!=null?accessibilityLabel:childrenString},isWeb&&{role:'status'}));return jsxs(BaseBox,_extends({display:"flex",flexDirection:"row",alignItems:"center"},a11yProps,metaAttribute({name:MetaConstants.Indicator,testID:testID}),getStyledProps(styledProps),{children:[jsxs(Svg,{width:String(dimensions.svgSize),height:String(dimensions.svgSize),viewBox:"0 0 10 10",fill:"none",children:[jsx(Circle,{cx:"5",cy:"5",r:"5",fill:fillColor}),jsx(Circle,{cx:"5",cy:"5",r:"4.75",stroke:strokeColor,strokeWidth:"0.5"})]}),jsx(BaseBox,{marginLeft:"spacing.2",children:jsx(Text,{contrast:"low",type:"subtle",size:dimensions.textSize,children:children})})]}));};