@razorpay/blade 10.3.0 → 10.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/index.d.ts +8 -1
- package/build/components/index.development.web.js +90 -237
- package/build/components/index.development.web.js.map +1 -1
- package/build/components/index.native.d.ts +7 -0
- package/build/components/index.native.js +6 -6
- package/build/components/index.native.js.map +1 -1
- package/build/components/index.production.web.js +91 -238
- package/build/components/index.production.web.js.map +1 -1
- package/build/css/bankingThemeDarkDesktop.css +1 -1
- package/build/css/bankingThemeDarkMobile.css +1 -1
- package/build/css/bankingThemeLightDesktop.css +1 -1
- package/build/css/bankingThemeLightMobile.css +1 -1
- package/build/css/paymentThemeDarkDesktop.css +1 -1
- package/build/css/paymentThemeDarkMobile.css +1 -1
- package/build/css/paymentThemeLightDesktop.css +1 -1
- package/build/css/paymentThemeLightMobile.css +1 -1
- package/build/tokens/index.d.ts +2 -0
- package/build/tokens/index.development.web.js +2 -0
- package/build/tokens/index.development.web.js.map +1 -1
- package/build/tokens/index.native.d.ts +2 -0
- package/build/tokens/index.native.js +1 -1
- package/build/tokens/index.native.js.map +1 -1
- package/build/tokens/index.production.web.js +2 -0
- package/build/tokens/index.production.web.js.map +1 -1
- package/package.json +1 -1
|
@@ -4195,6 +4195,12 @@ declare type DropdownProps = {
|
|
|
4195
4195
|
} & TestID & StyledPropsBlade$1;
|
|
4196
4196
|
declare type DropdownOverlayProps = {
|
|
4197
4197
|
children: React.ReactElement[] | React.ReactElement;
|
|
4198
|
+
/**
|
|
4199
|
+
* Sets the z-index of the DropdownOverlay
|
|
4200
|
+
*
|
|
4201
|
+
* @default 1001
|
|
4202
|
+
*/
|
|
4203
|
+
zIndex?: number;
|
|
4198
4204
|
} & TestID;
|
|
4199
4205
|
|
|
4200
4206
|
declare const Dropdown: ({ children, selectionType, onDismiss, testID, ...styledProps }: DropdownProps) => React__default.ReactElement;
|
|
@@ -5053,6 +5059,7 @@ declare type BaseInputCommonProps = FormInputLabelProps & FormInputValidationPro
|
|
|
5053
5059
|
* true if popup is in expanded state
|
|
5054
5060
|
*/
|
|
5055
5061
|
isPopupExpanded?: boolean;
|
|
5062
|
+
setInputWrapperRef?: (node: HTMLDivElement) => void;
|
|
5056
5063
|
/**
|
|
5057
5064
|
* sets the autocapitalize behavior for the input
|
|
5058
5065
|
*/
|
|
@@ -57,7 +57,7 @@ var ThemeContext=createContext({theme:null,colorScheme:'light',platform:'onDeskt
|
|
|
57
57
|
|
|
58
58
|
var BottomSheetContext=React__default.createContext({headerHeight:0,contentHeight:0,footerHeight:0,isHeaderFloating:false,setContentHeight:function setContentHeight(){},setHeaderHeight:function setHeaderHeight(){},setFooterHeight:function setFooterHeight(){},setHasBodyPadding:function setHasBodyPadding(){},setIsHeaderEmpty:function setIsHeaderEmpty(){},close:function close(){},scrollRef:null,bind:null,isOpen:false,positionY:0,isInBottomSheet:false,defaultInitialFocusRef:{current:null}});var useBottomSheetContext=function useBottomSheetContext(){var state=React__default.useContext(BottomSheetContext);return state;};var BottomSheetAndDropdownGlueContext=React__default.createContext(null);var useBottomSheetAndDropdownGlue=function useBottomSheetAndDropdownGlue(){var state=React__default.useContext(BottomSheetAndDropdownGlueContext);return state;};
|
|
59
59
|
|
|
60
|
-
var _excluded$51=["isOpen","setIsOpen","close","selectedIndices","setSelectedIndices","activeIndex","setActiveIndex","shouldIgnoreBlur","setShouldIgnoreBlur","isKeydownPressed","setIsKeydownPressed","options","selectionType","changeCallbackTriggerer","setChangeCallbackTriggerer","isControlled","setControlledValueIndices"];var noop=function noop(){};var DropdownContext=React__default.createContext({isOpen:false,setIsOpen:noop,close:noop,selectedIndices:[],setSelectedIndices:noop,controlledValueIndices:[],setControlledValueIndices: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,changeCallbackTriggerer:0,setChangeCallbackTriggerer:noop,isControlled:false,setIsControlled: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,close=_React$useContext.close,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,changeCallbackTriggerer=_React$useContext.changeCallbackTriggerer,setChangeCallbackTriggerer=_React$useContext.setChangeCallbackTriggerer,isControlled=_React$useContext.isControlled,setControlledValueIndices=_React$useContext.setControlledValueIndices,rest=_objectWithoutProperties(_React$useContext,_excluded$51);var bottomSheetAndDropdownGlue=useBottomSheetAndDropdownGlue();var setIndices=function setIndices(indices){if(isControlled){setControlledValueIndices(indices);}else {setSelectedIndices(indices);}};var selectOption=function selectOption(index){var properties=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{closeOnSelection:true};var isSelected=false;if(index<0||index>options.length-1){return isSelected;}if(selectionType==='multiple'){if(selectedIndices.includes(index)){var existingItemIndex=selectedIndices.indexOf(index);setIndices([].concat(_toConsumableArray(selectedIndices.slice(0,existingItemIndex)),_toConsumableArray(selectedIndices.slice(existingItemIndex+1))));isSelected=false;}else {setIndices([].concat(_toConsumableArray(selectedIndices),[index]));isSelected=true;}}else {setIndices([index]);isSelected=true;}setChangeCallbackTriggerer(changeCallbackTriggerer+1);if(activeIndex!==index){setActiveIndex(index);}if(properties!=null&&properties.closeOnSelection&&selectionType!=='multiple'){close();}return isSelected;};var onTriggerClick=function onTriggerClick(){if(isOpen){close();}else {setIsOpen(true);}};var onTriggerBlur=function onTriggerBlur(_ref){var name=_ref.name,value=_ref.value,onBlurCallback=_ref.onBlurCallback;if(rest.hasFooterAction){setActiveIndex(-1);}if(bottomSheetAndDropdownGlue!=null&&bottomSheetAndDropdownGlue.dropdownHasBottomSheet){setShouldIgnoreBlur(true);return;}if(shouldIgnoreBlur){setShouldIgnoreBlur(false);return;}onBlurCallback==null?void 0:onBlurCallback({name:name,value:value});if(isOpen){if(selectionType!=='multiple'){selectOption(activeIndex);}if(!(bottomSheetAndDropdownGlue!=null&&bottomSheetAndDropdownGlue.dropdownHasBottomSheet)){close();}}};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(bottomSheetAndDropdownGlue!=null&&bottomSheetAndDropdownGlue.dropdownHasBottomSheet){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,close:close,onOptionChange:onOptionChange,onComboType:onComboType,selectCurrentOption:function selectCurrentOption(){var _options$activeIndex$,_options$activeIndex;var isSelected=selectOption(activeIndex);if(rest.hasFooterAction&&!isReactNative$4()){var _rest$triggererRef$cu2;(_rest$triggererRef$cu2=rest.triggererRef.current)==null?void 0:_rest$triggererRef$cu2.focus();}(_options$activeIndex$=(_options$activeIndex=options[activeIndex]).onClickTrigger)==null?void 0:_options$activeIndex$.call(_options$activeIndex,isSelected);}});}};return Object.assign({isOpen:isOpen,setIsOpen:setIsOpen,close:close,selectedIndices:selectedIndices,setSelectedIndices:setSelectedIndices,setControlledValueIndices:setControlledValueIndices,onTriggerClick:onTriggerClick,onTriggerKeydown:onTriggerKeydown,onTriggerBlur:onTriggerBlur,onOptionClick:onOptionClick,activeIndex:activeIndex,setActiveIndex:setActiveIndex,shouldIgnoreBlur:shouldIgnoreBlur,setShouldIgnoreBlur:setShouldIgnoreBlur,isKeydownPressed:isKeydownPressed,setIsKeydownPressed:setIsKeydownPressed,changeCallbackTriggerer:changeCallbackTriggerer,setChangeCallbackTriggerer:setChangeCallbackTriggerer,isControlled:isControlled,options:options,value:makeInputValue(selectedIndices,options),displayValue:makeInputDisplayValue(selectedIndices,options),selectionType:selectionType},rest);};
|
|
60
|
+
var _excluded$51=["isOpen","setIsOpen","close","selectedIndices","setSelectedIndices","activeIndex","setActiveIndex","shouldIgnoreBlur","setShouldIgnoreBlur","isKeydownPressed","setIsKeydownPressed","options","selectionType","changeCallbackTriggerer","setChangeCallbackTriggerer","isControlled","setControlledValueIndices"];var noop=function noop(){};var DropdownContext=React__default.createContext({isOpen:false,setIsOpen:noop,close:noop,selectedIndices:[],setSelectedIndices:noop,controlledValueIndices:[],setControlledValueIndices: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,changeCallbackTriggerer:0,setChangeCallbackTriggerer:noop,isControlled:false,setIsControlled:noop,dropdownBaseId:'',actionListItemRef:{current:null},triggererRef:{current:null},triggererWrapperRef:{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,close=_React$useContext.close,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,changeCallbackTriggerer=_React$useContext.changeCallbackTriggerer,setChangeCallbackTriggerer=_React$useContext.setChangeCallbackTriggerer,isControlled=_React$useContext.isControlled,setControlledValueIndices=_React$useContext.setControlledValueIndices,rest=_objectWithoutProperties(_React$useContext,_excluded$51);var bottomSheetAndDropdownGlue=useBottomSheetAndDropdownGlue();var setIndices=function setIndices(indices){if(isControlled){setControlledValueIndices(indices);}else {setSelectedIndices(indices);}};var selectOption=function selectOption(index){var properties=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{closeOnSelection:true};var isSelected=false;if(index<0||index>options.length-1){return isSelected;}if(selectionType==='multiple'){if(selectedIndices.includes(index)){var existingItemIndex=selectedIndices.indexOf(index);setIndices([].concat(_toConsumableArray(selectedIndices.slice(0,existingItemIndex)),_toConsumableArray(selectedIndices.slice(existingItemIndex+1))));isSelected=false;}else {setIndices([].concat(_toConsumableArray(selectedIndices),[index]));isSelected=true;}}else {setIndices([index]);isSelected=true;}setChangeCallbackTriggerer(changeCallbackTriggerer+1);if(activeIndex!==index){setActiveIndex(index);}if(properties!=null&&properties.closeOnSelection&&selectionType!=='multiple'){close();}return isSelected;};var onTriggerClick=function onTriggerClick(){if(isOpen){close();}else {setIsOpen(true);}};var onTriggerBlur=function onTriggerBlur(_ref){var name=_ref.name,value=_ref.value,onBlurCallback=_ref.onBlurCallback;if(rest.hasFooterAction){setActiveIndex(-1);}if(bottomSheetAndDropdownGlue!=null&&bottomSheetAndDropdownGlue.dropdownHasBottomSheet){setShouldIgnoreBlur(true);return;}if(shouldIgnoreBlur){setShouldIgnoreBlur(false);return;}onBlurCallback==null?void 0:onBlurCallback({name:name,value:value});if(isOpen){if(selectionType!=='multiple'){selectOption(activeIndex);}if(!(bottomSheetAndDropdownGlue!=null&&bottomSheetAndDropdownGlue.dropdownHasBottomSheet)){close();}}};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(bottomSheetAndDropdownGlue!=null&&bottomSheetAndDropdownGlue.dropdownHasBottomSheet){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,close:close,onOptionChange:onOptionChange,onComboType:onComboType,selectCurrentOption:function selectCurrentOption(){var _options$activeIndex$,_options$activeIndex;var isSelected=selectOption(activeIndex);if(rest.hasFooterAction&&!isReactNative$4()){var _rest$triggererRef$cu2;(_rest$triggererRef$cu2=rest.triggererRef.current)==null?void 0:_rest$triggererRef$cu2.focus();}(_options$activeIndex$=(_options$activeIndex=options[activeIndex]).onClickTrigger)==null?void 0:_options$activeIndex$.call(_options$activeIndex,isSelected);}});}};return Object.assign({isOpen:isOpen,setIsOpen:setIsOpen,close:close,selectedIndices:selectedIndices,setSelectedIndices:setSelectedIndices,setControlledValueIndices:setControlledValueIndices,onTriggerClick:onTriggerClick,onTriggerKeydown:onTriggerKeydown,onTriggerBlur:onTriggerBlur,onOptionClick:onOptionClick,activeIndex:activeIndex,setActiveIndex:setActiveIndex,shouldIgnoreBlur:shouldIgnoreBlur,setShouldIgnoreBlur:setShouldIgnoreBlur,isKeydownPressed:isKeydownPressed,setIsKeydownPressed:setIsKeydownPressed,changeCallbackTriggerer:changeCallbackTriggerer,setChangeCallbackTriggerer:setChangeCallbackTriggerer,isControlled:isControlled,options:options,value:makeInputValue(selectedIndices,options),displayValue:makeInputDisplayValue(selectedIndices,options),selectionType:selectionType},rest);};
|
|
61
61
|
|
|
62
62
|
var isRoleMenu=function isRoleMenu(dropdownTriggerer){return isReactNative$4()||dropdownTriggerer!=='SelectInput';};var getActionListContainerRole=function getActionListContainerRole(hasFooterAction,dropdownTriggerer){if(hasFooterAction){return 'dialog';}if(isRoleMenu(dropdownTriggerer)){return 'menu';}return 'listbox';};var getActionListSectionRole=function getActionListSectionRole(){if(isReactNative$4()){return undefined;}return 'group';};var getSeparatorRole=function getSeparatorRole(){if(isReactNative$4()){return undefined;}return 'separator';};var getActionListItemWrapperRole=function getActionListItemWrapperRole(hasFooterAction,dropdownTriggerer){if(isRoleMenu(dropdownTriggerer)){return undefined;}if(hasFooterAction){return 'listbox';}return undefined;};var getActionListItemRole=function getActionListItemRole(dropdownTriggerer,href,selectionType){if(href){return 'link';}if(isRoleMenu(dropdownTriggerer)){if(selectionType==='multiple'){return 'menuitemcheckbox';}return 'menuitem';}return 'option';};
|
|
63
63
|
|
|
@@ -77,7 +77,7 @@ var makeBezier=function makeBezier(x1,y1,x2,y2){return Easing.bezier(x1,y1,x2,y2
|
|
|
77
77
|
|
|
78
78
|
({standard:{attentive:makeBezier(0.5,0,0.3,1.5),effective:makeBezier(0.3,0,0.2,1),revealing:makeBezier(0.5,0,0,1),wary:makeBezier(1,0.5,0,0.5)},entrance:{attentive:makeBezier(0.5,0,0.3,1.5),effective:makeBezier(0,0,0.2,1),revealing:makeBezier(0,0,0,1)},exit:{attentive:makeBezier(0.7,0,0.5,1),effective:makeBezier(0.17,0,1,1),revealing:makeBezier(0.5,0,1,1)}});
|
|
79
79
|
|
|
80
|
-
var size={0:0,1:1,2:2,3:3,4:4,5:5,6:6,8:8,10:10,12:12,16:16,18:18,20:20,24:24,28:28,32:32,36:36,40:40,44:44,48:48,56:56,100:100,120:120,140:140,160:160,200:200,300:300,360:360,400:400,584:584,640:640,760:760,800:800,1024:1024,1136:1136};
|
|
80
|
+
var size={0:0,1:1,2:2,3:3,4:4,5:5,6:6,8:8,10:10,12:12,16:16,18:18,20:20,24:24,28:28,32:32,36:36,40:40,44:44,48:48,56:56,100:100,120:120,140:140,160:160,200:200,240:240,300:300,360:360,400:400,584:584,640:640,760:760,800:800,1024:1024,1136:1136};
|
|
81
81
|
|
|
82
82
|
var getBaseListBoxWrapperStyles=function getBaseListBoxWrapperStyles(props){return {maxHeight:props.isInBottomSheet?undefined:makeSize(size[300]),padding:props.isInBottomSheet?undefined:makeSize(props.theme.spacing[3])};};
|
|
83
83
|
|
|
@@ -2756,7 +2756,7 @@ var CarouselItem=function CarouselItem(_ref){var children=_ref.children;var _use
|
|
|
2756
2756
|
|
|
2757
2757
|
var ComponentIds={BottomSheet:'BottomSheet',BottomSheetHeader:'BottomSheetHeader',BottomSheetFooter:'BottomSheetFooter',BottomSheetBody:'BottomSheetBody',BottomSheetGrabHandle:'BottomSheetGrabHandle'};
|
|
2758
2758
|
|
|
2759
|
-
var _excluded$q=["children","selectionType","onDismiss","testID"];var validDropdownChildren=[componentIds$1.triggers.SelectInput,componentIds$1.triggers.DropdownButton,componentIds$1.triggers.DropdownLink,componentIds$1.DropdownOverlay,ComponentIds.BottomSheet];var _Dropdown=function _Dropdown(_ref){var children=_ref.children,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,onDismiss=_ref.onDismiss,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$q);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isOpen=_React$useState2[0],setIsOpen=_React$useState2[1];var _React$useState3=React__default.useState([]),_React$useState4=_slicedToArray(_React$useState3,2),options=_React$useState4[0],setOptions=_React$useState4[1];var _React$useState5=React__default.useState([]),_React$useState6=_slicedToArray(_React$useState5,2),selectedIndices=_React$useState6[0],setSelectedIndices=_React$useState6[1];var _React$useState7=React__default.useState([]),_React$useState8=_slicedToArray(_React$useState7,2),controlledValueIndices=_React$useState8[0],setControlledValueIndices=_React$useState8[1];var _React$useState9=React__default.useState(-1),_React$useState10=_slicedToArray(_React$useState9,2),activeIndex=_React$useState10[0],setActiveIndex=_React$useState10[1];var _React$useState11=React__default.useState(false),_React$useState12=_slicedToArray(_React$useState11,2),shouldIgnoreBlur=_React$useState12[0],setShouldIgnoreBlur=_React$useState12[1];var _React$useState13=React__default.useState(false),_React$useState14=_slicedToArray(_React$useState13,2),shouldIgnoreBlurAnimation=_React$useState14[0],setShouldIgnoreBlurAnimation=_React$useState14[1];var triggererRef=React__default.useRef(null);var actionListItemRef=React__default.useRef(null);var _React$useState15=React__default.useState(false),_React$useState16=_slicedToArray(_React$useState15,2),hasFooterAction=_React$useState16[0],setHasFooterAction=_React$useState16[1];var _React$useState17=React__default.useState(false),_React$useState18=_slicedToArray(_React$useState17,2),hasLabelOnLeft=_React$useState18[0],setHasLabelOnLeft=_React$useState18[1];var _React$useState19=React__default.useState(false),_React$useState20=_slicedToArray(_React$useState19,2),isKeydownPressed=_React$useState20[0],setIsKeydownPressed=_React$useState20[1];var _React$useState21=React__default.useState(0),_React$useState22=_slicedToArray(_React$useState21,2),changeCallbackTriggerer=_React$useState22[0],setChangeCallbackTriggerer=_React$useState22[1];var _React$useState23=React__default.useState(false),_React$useState24=_slicedToArray(_React$useState23,2),isControlled=_React$useState24[0],setIsControlled=_React$useState24[1];var _React$useState25=React__default.useState(false),_React$useState26=_slicedToArray(_React$useState25,2),dropdownHasBottomSheet=_React$useState26[0],setDropdownHasBottomSheet=_React$useState26[1];var dropdownBaseId=useId('dropdown');var dropdownTriggerer=React__default.useRef();var isFirstRenderRef=React__default.useRef(true);React__default.useEffect(function(){if(isFirstRenderRef.current){isFirstRenderRef.current=false;return;}if(!isOpen&&onDismiss){onDismiss();}},[isOpen]);var close=React__default.useCallback(function(){setIsOpen(false);onDismiss==null?void 0:onDismiss();},[onDismiss]);React__default.Children.map(children,function(child){if(React__default.isValidElement(child)){if(__DEV__){var _getComponentId;if(!validDropdownChildren.includes((_getComponentId=getComponentId(child))!=null?_getComponentId:'')){throwBladeError({message:`Dropdown can only have one of following elements as children - \n\n ${validDropdownChildren.join(', ')} \n\n Check out: https://blade.razorpay.com/?path=/story/components-dropdown`,moduleName:'Dropdown'});}}if(isValidAllowedChildren(child,componentIds$1.triggers.SelectInput)){dropdownTriggerer.current='SelectInput';}if(isValidAllowedChildren(child,componentIds$1.triggers.DropdownButton)){dropdownTriggerer.current='DropdownButton';}}});var contextValue=React__default.useMemo(function(){return {isOpen:isOpen,setIsOpen:setIsOpen,close:close,selectedIndices:selectedIndices,setSelectedIndices:setSelectedIndices,controlledValueIndices:controlledValueIndices,setControlledValueIndices:setControlledValueIndices,options:options,setOptions:setOptions,activeIndex:activeIndex,setActiveIndex:setActiveIndex,shouldIgnoreBlur:shouldIgnoreBlur,setShouldIgnoreBlur:setShouldIgnoreBlur,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,isKeydownPressed:isKeydownPressed,setIsKeydownPressed:setIsKeydownPressed,dropdownBaseId:dropdownBaseId,triggererRef:triggererRef,actionListItemRef:actionListItemRef,selectionType:selectionType,hasFooterAction:hasFooterAction,setHasFooterAction:setHasFooterAction,hasLabelOnLeft:hasLabelOnLeft,setHasLabelOnLeft:setHasLabelOnLeft,dropdownTriggerer:dropdownTriggerer.current,changeCallbackTriggerer:changeCallbackTriggerer,setChangeCallbackTriggerer:setChangeCallbackTriggerer,isControlled:isControlled,setIsControlled:setIsControlled};},[isOpen,selectedIndices,controlledValueIndices,options,activeIndex,shouldIgnoreBlur,shouldIgnoreBlurAnimation,selectionType,hasFooterAction,hasLabelOnLeft,isKeydownPressed,changeCallbackTriggerer,isControlled]);var BottomSheetAndDropdownGlueContextValue=React__default.useMemo(function(){return {isOpen:isOpen,dropdownHasBottomSheet:dropdownHasBottomSheet,setDropdownHasBottomSheet:setDropdownHasBottomSheet,onBottomSheetDismiss:close};},[dropdownHasBottomSheet,isOpen,close]);return jsx(BottomSheetAndDropdownGlueContext.Provider,{value:BottomSheetAndDropdownGlueContextValue,children:jsx(DropdownContext.Provider,{value:contextValue,children:jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Dropdown,testID:testID}),getStyledProps(styledProps),{children:jsx(BaseBox,{position:"relative",textAlign:'left',children:children})}))})});};var Dropdown=assignWithoutSideEffects(_Dropdown,{componentId:componentIds$1.Dropdown});
|
|
2759
|
+
var _excluded$q=["children","selectionType","onDismiss","testID"];var validDropdownChildren=[componentIds$1.triggers.SelectInput,componentIds$1.triggers.DropdownButton,componentIds$1.triggers.DropdownLink,componentIds$1.DropdownOverlay,ComponentIds.BottomSheet];var _Dropdown=function _Dropdown(_ref){var children=_ref.children,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,onDismiss=_ref.onDismiss,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$q);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isOpen=_React$useState2[0],setIsOpen=_React$useState2[1];var _React$useState3=React__default.useState([]),_React$useState4=_slicedToArray(_React$useState3,2),options=_React$useState4[0],setOptions=_React$useState4[1];var _React$useState5=React__default.useState([]),_React$useState6=_slicedToArray(_React$useState5,2),selectedIndices=_React$useState6[0],setSelectedIndices=_React$useState6[1];var _React$useState7=React__default.useState([]),_React$useState8=_slicedToArray(_React$useState7,2),controlledValueIndices=_React$useState8[0],setControlledValueIndices=_React$useState8[1];var _React$useState9=React__default.useState(-1),_React$useState10=_slicedToArray(_React$useState9,2),activeIndex=_React$useState10[0],setActiveIndex=_React$useState10[1];var _React$useState11=React__default.useState(false),_React$useState12=_slicedToArray(_React$useState11,2),shouldIgnoreBlur=_React$useState12[0],setShouldIgnoreBlur=_React$useState12[1];var _React$useState13=React__default.useState(false),_React$useState14=_slicedToArray(_React$useState13,2),shouldIgnoreBlurAnimation=_React$useState14[0],setShouldIgnoreBlurAnimation=_React$useState14[1];var triggererRef=React__default.useRef(null);var triggererWrapperRef=React__default.useRef(null);var actionListItemRef=React__default.useRef(null);var _React$useState15=React__default.useState(false),_React$useState16=_slicedToArray(_React$useState15,2),hasFooterAction=_React$useState16[0],setHasFooterAction=_React$useState16[1];var _React$useState17=React__default.useState(false),_React$useState18=_slicedToArray(_React$useState17,2),hasLabelOnLeft=_React$useState18[0],setHasLabelOnLeft=_React$useState18[1];var _React$useState19=React__default.useState(false),_React$useState20=_slicedToArray(_React$useState19,2),isKeydownPressed=_React$useState20[0],setIsKeydownPressed=_React$useState20[1];var _React$useState21=React__default.useState(0),_React$useState22=_slicedToArray(_React$useState21,2),changeCallbackTriggerer=_React$useState22[0],setChangeCallbackTriggerer=_React$useState22[1];var _React$useState23=React__default.useState(false),_React$useState24=_slicedToArray(_React$useState23,2),isControlled=_React$useState24[0],setIsControlled=_React$useState24[1];var _React$useState25=React__default.useState(false),_React$useState26=_slicedToArray(_React$useState25,2),dropdownHasBottomSheet=_React$useState26[0],setDropdownHasBottomSheet=_React$useState26[1];var dropdownBaseId=useId('dropdown');var dropdownTriggerer=React__default.useRef();var isFirstRenderRef=React__default.useRef(true);React__default.useEffect(function(){if(isFirstRenderRef.current){isFirstRenderRef.current=false;return;}if(!isOpen&&onDismiss){onDismiss();}},[isOpen]);var close=React__default.useCallback(function(){setIsOpen(false);onDismiss==null?void 0:onDismiss();},[onDismiss]);React__default.Children.map(children,function(child){if(React__default.isValidElement(child)){if(__DEV__){var _getComponentId;if(!validDropdownChildren.includes((_getComponentId=getComponentId(child))!=null?_getComponentId:'')){throwBladeError({message:`Dropdown can only have one of following elements as children - \n\n ${validDropdownChildren.join(', ')} \n\n Check out: https://blade.razorpay.com/?path=/story/components-dropdown`,moduleName:'Dropdown'});}}if(isValidAllowedChildren(child,componentIds$1.triggers.SelectInput)){dropdownTriggerer.current='SelectInput';}if(isValidAllowedChildren(child,componentIds$1.triggers.DropdownButton)){dropdownTriggerer.current='DropdownButton';}}});var contextValue=React__default.useMemo(function(){return {isOpen:isOpen,setIsOpen:setIsOpen,close:close,selectedIndices:selectedIndices,setSelectedIndices:setSelectedIndices,controlledValueIndices:controlledValueIndices,setControlledValueIndices:setControlledValueIndices,options:options,setOptions:setOptions,activeIndex:activeIndex,setActiveIndex:setActiveIndex,shouldIgnoreBlur:shouldIgnoreBlur,setShouldIgnoreBlur:setShouldIgnoreBlur,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,isKeydownPressed:isKeydownPressed,setIsKeydownPressed:setIsKeydownPressed,dropdownBaseId:dropdownBaseId,triggererRef:triggererRef,triggererWrapperRef:triggererWrapperRef,actionListItemRef:actionListItemRef,selectionType:selectionType,hasFooterAction:hasFooterAction,setHasFooterAction:setHasFooterAction,hasLabelOnLeft:hasLabelOnLeft,setHasLabelOnLeft:setHasLabelOnLeft,dropdownTriggerer:dropdownTriggerer.current,changeCallbackTriggerer:changeCallbackTriggerer,setChangeCallbackTriggerer:setChangeCallbackTriggerer,isControlled:isControlled,setIsControlled:setIsControlled};},[isOpen,selectedIndices,controlledValueIndices,options,activeIndex,shouldIgnoreBlur,shouldIgnoreBlurAnimation,selectionType,hasFooterAction,hasLabelOnLeft,isKeydownPressed,changeCallbackTriggerer,isControlled]);var BottomSheetAndDropdownGlueContextValue=React__default.useMemo(function(){return {isOpen:isOpen,dropdownHasBottomSheet:dropdownHasBottomSheet,setDropdownHasBottomSheet:setDropdownHasBottomSheet,onBottomSheetDismiss:close};},[dropdownHasBottomSheet,isOpen,close]);return jsx(BottomSheetAndDropdownGlueContext.Provider,{value:BottomSheetAndDropdownGlueContextValue,children:jsx(DropdownContext.Provider,{value:contextValue,children:jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Dropdown,testID:testID}),getStyledProps(styledProps),{children:jsx(BaseBox,{position:"relative",textAlign:'left',children:children})}))})});};var Dropdown=assignWithoutSideEffects(_Dropdown,{componentId:componentIds$1.Dropdown});
|
|
2760
2760
|
|
|
2761
2761
|
var StyledDropdownOverlay=styled(BaseBox)(function(props){var theme=props.theme,isInBottomSheet=props.isInBottomSheet;return {backgroundColor:theme.colors.surface.background.level2.lowContrast,borderWidth:isInBottomSheet?undefined:theme.border.width.thin,borderColor:theme.colors.surface.border.normal.lowContrast,borderStyle:isInBottomSheet?undefined:'solid',borderRadius:makeSize(theme.border.radius.medium),boxShadow:isInBottomSheet||isReactNative$4()?undefined:castWebType(theme.elevation.midRaised)};});
|
|
2762
2762
|
|
|
@@ -2782,9 +2782,9 @@ var _excluded$n=["name","isRequired","isDisabled","maxCharacters","handleOnFocus
|
|
|
2782
2782
|
|
|
2783
2783
|
var BaseInputStyledAnimatedBorder=styled(Animated$1.View)(function(_ref){var theme=_ref.theme;return {position:'absolute',bottom:0,left:0,right:0,opacity:1,backgroundColor:theme.colors.brand.primary[500],height:makeBorderSize(theme.border.width.thin)};});var _worklet_14984072779295_init_data={code:"function anonymous(){const{interpolate,widthTrigger,opacityTrigger}=this._closure;return{width:interpolate(widthTrigger.value,[0,1],[0,100])+\"%\",opacity:interpolate(opacityTrigger.value,[0,1],[0,1])};}",location:"/home/runner/work/blade/blade/packages/blade/src/components/Input/BaseInput/BaseInputAnimatedBorder.native.tsx",sourceMap:"{\"version\":3,\"mappings\":\"AAsCyC,SAAAA,SAAMA,CAAA,QAAAC,WAAA,CAAAC,YAAA,CAAAC,cAAA,OAAAC,QAAA,CAC3C,MAAO,CACLC,KAAK,CAAKJ,WAAW,CAACC,YAAY,CAACI,KAAK,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,GAAG,CAAC,CAAE,IAAE,CAC9DC,OAAO,CAAEN,WAAW,CAACE,cAAc,CAACG,KAAK,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAC3D,CAAC,CACH\",\"names\":[\"anonymous\",\"interpolate\",\"widthTrigger\",\"opacityTrigger\",\"_closure\",\"width\",\"value\",\"opacity\"],\"sources\":[\"/home/runner/work/blade/blade/packages/blade/src/components/Input/BaseInput/BaseInputAnimatedBorder.native.tsx\"]}",version:"3.4.1"};var BaseInputAnimatedBorder=function BaseInputAnimatedBorder(_ref2){var currentInteraction=_ref2.currentInteraction,validationState=_ref2.validationState;var _useTheme=useTheme(),theme=_useTheme.theme;var borderAnimationEasing=theme.motion.easing.standard.effective;var widthTrigger=useSharedValue(0);var opacityTrigger=useSharedValue(1);var animatedStyle=useAnimatedStyle(function(){var _e=[new global.Error(),-4,-27];var _f=function _f(){return {width:`${interpolate(widthTrigger.value,[0,1],[0,100])}%`,opacity:interpolate(opacityTrigger.value,[0,1],[0,1])};};_f._closure={interpolate:interpolate,widthTrigger:widthTrigger,opacityTrigger:opacityTrigger};_f.__initData=_worklet_14984072779295_init_data;_f.__workletHash=14984072779295;_f.__stackDetails=_e;return _f;}());useEffect(function(){if(currentInteraction=='active'&&validationState!=='error'&&validationState!=='success'){widthTrigger.value=0;opacityTrigger.value=1;widthTrigger.value=withTiming(1,{duration:theme.motion.duration.moderate,easing:borderAnimationEasing});}else if(currentInteraction==='default'){opacityTrigger.value=withTiming(0,{duration:theme.motion.duration.xquick,easing:borderAnimationEasing});}},[currentInteraction,opacityTrigger,widthTrigger,theme.motion.duration,borderAnimationEasing,validationState]);return jsx(BaseInputStyledAnimatedBorder,{style:animatedStyle});};
|
|
2784
2784
|
|
|
2785
|
-
var _excluded$m=["children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea"];var StyledBaseInputWrapper=styled(BaseBox)(function(props){return Object.assign({},getInputBackgroundAndBorderStyles({theme:props.theme,isFocused:props.currentInteraction==='active',isDisabled:props.isDisabled,validationState:props.validationState}),{'&:hover':getPlatformType()==='react-native'?undefined:Object.assign({},getInputBackgroundAndBorderStyles({theme:props.theme,isHovered:true,isFocused:props.currentInteraction==='active',isDisabled:props.isDisabled,validationState:props.validationState}),{transitionProperty:'background-color',transitionDuration:castWebType(makeMotionTime(props.theme.motion.duration.xquick)),transitionTimingFunction:castWebType(props.theme.motion.easing.standard.effective)}),':focus-within':getPlatformType()==='react-native'?undefined:Object.assign({},getInputBackgroundAndBorderStyles({theme:props.theme,isFocused:props.currentInteraction==='active',isDisabled:props.isDisabled,validationState:props.validationState}))});});var BaseInputWrapper=function BaseInputWrapper(_ref){var children=_ref.children,validationState=_ref.validationState,currentInteraction=_ref.currentInteraction;_ref.isLabelLeftPositioned;var isTextArea=_ref.isTextArea,props=_objectWithoutProperties(_ref,_excluded$m);return jsxs(StyledBaseInputWrapper,Object.assign({display:"flex",flexDirection:"row",width:"100%",alignItems:isTextArea?'flex-start':undefined,validationState:validationState,currentInteraction:currentInteraction,position:"relative"},props,{children:[children,jsx(BaseInputAnimatedBorder,{currentInteraction:currentInteraction,validationState:validationState})]}));};
|
|
2785
|
+
var _excluded$m=["children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea","setInputWrapperRef"];var StyledBaseInputWrapper=styled(BaseBox)(function(props){return Object.assign({},getInputBackgroundAndBorderStyles({theme:props.theme,isFocused:props.currentInteraction==='active',isDisabled:props.isDisabled,validationState:props.validationState}),{'&:hover':getPlatformType()==='react-native'?undefined:Object.assign({},getInputBackgroundAndBorderStyles({theme:props.theme,isHovered:true,isFocused:props.currentInteraction==='active',isDisabled:props.isDisabled,validationState:props.validationState}),{transitionProperty:'background-color',transitionDuration:castWebType(makeMotionTime(props.theme.motion.duration.xquick)),transitionTimingFunction:castWebType(props.theme.motion.easing.standard.effective)}),':focus-within':getPlatformType()==='react-native'?undefined:Object.assign({},getInputBackgroundAndBorderStyles({theme:props.theme,isFocused:props.currentInteraction==='active',isDisabled:props.isDisabled,validationState:props.validationState}))});});var BaseInputWrapper=function BaseInputWrapper(_ref){var children=_ref.children,validationState=_ref.validationState,currentInteraction=_ref.currentInteraction;_ref.isLabelLeftPositioned;var isTextArea=_ref.isTextArea,setInputWrapperRef=_ref.setInputWrapperRef,props=_objectWithoutProperties(_ref,_excluded$m);return jsxs(StyledBaseInputWrapper,Object.assign({ref:setInputWrapperRef,display:"flex",flexDirection:"row",width:"100%",alignItems:isTextArea?'flex-start':undefined,validationState:validationState,currentInteraction:currentInteraction,position:"relative"},props,{children:[children,jsx(BaseInputAnimatedBorder,{currentInteraction:currentInteraction,validationState:validationState})]}));};
|
|
2786
2786
|
|
|
2787
|
-
var _excluded$l=["as","label","labelPosition","placeholder","type","defaultValue","name","value","onFocus","onChange","onInput","onBlur","onSubmit","onClick","onKeyDown","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","leadingIcon","prefix","interactionElement","suffix","trailingIcon","maxCharacters","textAlign","autoFocus","keyboardReturnKeyType","keyboardType","autoCompleteSuggestionType","trailingHeaderSlot","trailingFooterSlot","numberOfLines","id","componentName","accessibilityLabel","labelId","activeDescendant","hideLabelText","hideFormHint","hasPopup","popupId","isPopupExpanded","shouldIgnoreBlurAnimation","autoCapitalize","testID"];var autoCompleteSuggestionTypeValues=['none','on','name','email','username','password','newPassword','oneTimeCode','telephone','postalCode','countryName','creditCardNumber','creditCardCSC','creditCardExpiry','creditCardExpiryMonth','creditCardExpiryYear'];var useInput=function useInput(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,onClick=_ref.onClick,onFocus=_ref.onFocus,onChange=_ref.onChange,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,onInput=_ref.onInput,onKeyDown=_ref.onKeyDown;if(__DEV__){if(value&&defaultValue){throwBladeError({message:`Either 'value' or 'defaultValue' shall be passed. This decides if the input field is controlled or uncontrolled`,moduleName:'Input'});}}var _React$useState=React__default.useState(defaultValue!=null?defaultValue:value),_React$useState2=_slicedToArray(_React$useState,2),inputValue=_React$useState2[0],setInputValue=_React$useState2[1];var handleOnFocus=React__default.useCallback(function(_ref2){var name=_ref2.name,value=_ref2.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value;_value=(_value$target$value=value==null?void 0:value.target.value)!=null?_value$target$value:'';}onFocus==null?void 0:onFocus({name:name,value:_value});},[onFocus]);var handleOnClick=React__default.useCallback(function(_ref3){var name=_ref3.name,value=_ref3.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$currentTarget$;_value=(_value$currentTarget$=value==null?void 0:value.currentTarget.value)!=null?_value$currentTarget$:'';}onClick==null?void 0:onClick({name:name,value:_value});},[onClick]);var handleOnSubmit=React__default.useCallback(function(_ref4){var name=_ref4.name,value=_ref4.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value2;_value=(_value$target$value2=value==null?void 0:value.target.value)!=null?_value$target$value2:'';}if(isReactNative$4()){onSubmit==null?void 0:onSubmit({name:name,value:_value});}},[onSubmit]);var handleOnBlur=React__default.useCallback(function(_ref5){var name=_ref5.name,value=_ref5.value;var _value='';if(getPlatformType()==='react-native'&&typeof value=='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value3;_value=(_value$target$value3=value==null?void 0:value.target.value)!=null?_value$target$value3:'';}onBlur==null?void 0:onBlur({name:name,value:_value});},[onBlur]);var handleOnChange=React__default.useCallback(function(_ref6){var name=_ref6.name,value=_ref6.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value4;_value=(_value$target$value4=value==null?void 0:value.target.value)!=null?_value$target$value4:'';}onChange==null?void 0:onChange({name:name,value:_value});setInputValue(_value);},[onChange]);var handleOnInput=React__default.useCallback(function(_ref7){var name=_ref7.name,value=_ref7.value;var _value='';if(getPlatformType()==='react-native'&&typeof value=='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value5;_value=(_value$target$value5=value==null?void 0:value.target.value)!=null?_value$target$value5:'';}onInput==null?void 0:onInput({name:name,value:_value});},[onInput]);var handleOnKeyDown=React__default.useCallback(function(_ref8){var name=_ref8.name,key=_ref8.key,code=_ref8.code,event=_ref8.event;onKeyDown==null?void 0:onKeyDown({name:name,key:key,code:code,event:event});},[onKeyDown]);return {handleOnFocus:handleOnFocus,handleOnClick:handleOnClick,handleOnChange:handleOnChange,handleOnBlur:handleOnBlur,handleOnSubmit:handleOnSubmit,handleOnInput:handleOnInput,handleOnKeyDown:handleOnKeyDown,inputValue:inputValue};};var getHintType=function getHintType(_ref9){var validationState=_ref9.validationState,hasHelpText=_ref9.hasHelpText;if(validationState==='error'){return 'error';}if(validationState==='success'){return 'success';}if(hasHelpText){return 'help';}return 'help';};var getDescribedByElementId=function getDescribedByElementId(_ref10){var validationState=_ref10.validationState,hasErrorText=_ref10.hasErrorText,hasSuccessText=_ref10.hasSuccessText,hasHelpText=_ref10.hasHelpText,errorTextId=_ref10.errorTextId,successTextId=_ref10.successTextId,helpTextId=_ref10.helpTextId;if(validationState==='error'&&hasErrorText){return errorTextId;}if(validationState==='success'&&hasSuccessText){return successTextId;}if(hasHelpText){return helpTextId;}return '';};var BaseInput=React__default.forwardRef(function(_ref11,ref){var _ref11$as=_ref11.as,as=_ref11$as===void 0?'input':_ref11$as,label=_ref11.label,_ref11$labelPosition=_ref11.labelPosition,labelPosition=_ref11$labelPosition===void 0?'top':_ref11$labelPosition,placeholder=_ref11.placeholder,_ref11$type=_ref11.type,type=_ref11$type===void 0?'text':_ref11$type,defaultValue=_ref11.defaultValue,name=_ref11.name,value=_ref11.value,onFocus=_ref11.onFocus,onChange=_ref11.onChange,onInput=_ref11.onInput,onBlur=_ref11.onBlur,onSubmit=_ref11.onSubmit,onClick=_ref11.onClick,onKeyDown=_ref11.onKeyDown,isDisabled=_ref11.isDisabled,necessityIndicator=_ref11.necessityIndicator,validationState=_ref11.validationState,errorText=_ref11.errorText,helpText=_ref11.helpText,successText=_ref11.successText,isRequired=_ref11.isRequired,leadingIcon=_ref11.leadingIcon,prefix=_ref11.prefix,interactionElement=_ref11.interactionElement,suffix=_ref11.suffix,trailingIcon=_ref11.trailingIcon,maxCharacters=_ref11.maxCharacters,textAlign=_ref11.textAlign,autoFocus=_ref11.autoFocus,keyboardReturnKeyType=_ref11.keyboardReturnKeyType,keyboardType=_ref11.keyboardType,autoCompleteSuggestionType=_ref11.autoCompleteSuggestionType,trailingHeaderSlot=_ref11.trailingHeaderSlot,trailingFooterSlot=_ref11.trailingFooterSlot,numberOfLines=_ref11.numberOfLines,id=_ref11.id,componentName=_ref11.componentName,accessibilityLabel=_ref11.accessibilityLabel,labelId=_ref11.labelId,activeDescendant=_ref11.activeDescendant,hideLabelText=_ref11.hideLabelText,hideFormHint=_ref11.hideFormHint,hasPopup=_ref11.hasPopup,popupId=_ref11.popupId,isPopupExpanded=_ref11.isPopupExpanded,shouldIgnoreBlurAnimation=_ref11.shouldIgnoreBlurAnimation,autoCapitalize=_ref11.autoCapitalize,testID=_ref11.testID,styledProps=_objectWithoutProperties(_ref11,_excluded$l);var _useTheme=useTheme(),theme=_useTheme.theme;var _useInput=useInput({defaultValue:defaultValue,value:value,onFocus:onFocus,onClick:onClick,onChange:onChange,onBlur:onBlur,onSubmit:onSubmit,onInput:onInput,onKeyDown:onKeyDown}),handleOnFocus=_useInput.handleOnFocus,handleOnChange=_useInput.handleOnChange,handleOnClick=_useInput.handleOnClick,handleOnBlur=_useInput.handleOnBlur,handleOnSubmit=_useInput.handleOnSubmit,handleOnInput=_useInput.handleOnInput,handleOnKeyDown=_useInput.handleOnKeyDown,inputValue=_useInput.inputValue;var _useFormId=useFormId(id),inputId=_useFormId.inputId,helpTextId=_useFormId.helpTextId,errorTextId=_useFormId.errorTextId,successTextId=_useFormId.successTextId;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var isLabelLeftPositioned=labelPosition==='left'&&matchedDeviceType==='desktop';var _useInteraction=useInteraction(),currentInteraction=_useInteraction.currentInteraction,setCurrentInteraction=_useInteraction.setCurrentInteraction;var _isRequired=isRequired||necessityIndicator==='required';var accessibilityProps=makeAccessible({required:Boolean(_isRequired),disabled:Boolean(isDisabled),invalid:Boolean(validationState==='error'),describedBy:getDescribedByElementId({validationState:validationState,hasErrorText:Boolean(errorText),hasSuccessText:Boolean(successText),hasHelpText:Boolean(helpText),errorTextId:errorTextId,successTextId:successTextId,helpTextId:helpTextId}),label:accessibilityLabel,hasPopup:hasPopup,expanded:hasPopup?isPopupExpanded:undefined,controls:hasPopup?popupId:undefined,role:hasPopup?'combobox':undefined,activeDescendant:activeDescendant});var willRenderHintText=Boolean(helpText)||Boolean(successText)||Boolean(errorText);if(__DEV__){if(autoCompleteSuggestionType&&!autoCompleteSuggestionTypeValues.includes(autoCompleteSuggestionType)){throwBladeError({message:`Expected autoCompleteSuggestionType to be one of ${autoCompleteSuggestionTypeValues.join(', ')} but received ${autoCompleteSuggestionType}`,moduleName:'Input'});}}var isTextArea=as==='textarea';var isReactNative=getPlatformType()==='react-native';return jsxs(BaseBox,Object.assign({},metaAttribute({name:componentName,testID:testID}),getStyledProps(styledProps),{children:[jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'row':'column',justifyContent:isLabelLeftPositioned?'center':undefined,alignItems:isLabelLeftPositioned?'center':undefined,position:"relative",width:"100%",children:[!hideLabelText&&jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'column':'row',justifyContent:"space-between",alignSelf:isTextArea?'flex-start':undefined,marginTop:isTextArea&&isLabelLeftPositioned?'spacing.3':'spacing.0',marginBottom:isTextArea&&isLabelLeftPositioned?'spacing.3':'spacing.0',children:[jsx(FormLabel,{as:"label",necessityIndicator:necessityIndicator,position:labelPosition,id:labelId,htmlFor:inputId,children:label}),trailingHeaderSlot==null?void 0:trailingHeaderSlot(inputValue)]}),jsxs(BaseInputWrapper,{isTextArea:isTextArea,isDisabled:isDisabled,validationState:validationState,currentInteraction:currentInteraction,isLabelLeftPositioned:isLabelLeftPositioned,children:[jsx(BaseInputVisuals,{leadingIcon:leadingIcon,prefix:prefix,isDisabled:isDisabled}),jsx(StyledBaseInput,Object.assign({as:isReactNative?undefined:as,id:inputId,ref:ref,name:name,type:type,defaultValue:defaultValue,value:value,placeholder:placeholder,isDisabled:isDisabled,validationState:validationState,isRequired:_isRequired,handleOnFocus:handleOnFocus,handleOnChange:handleOnChange,handleOnBlur:handleOnBlur,handleOnSubmit:handleOnSubmit,handleOnInput:handleOnInput,handleOnKeyDown:handleOnKeyDown,handleOnClick:handleOnClick,leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,maxCharacters:maxCharacters,textAlign:textAlign,autoFocus:autoFocus,keyboardReturnKeyType:keyboardReturnKeyType,keyboardType:keyboardType,autoCompleteSuggestionType:autoCompleteSuggestionType,accessibilityProps:accessibilityProps,currentInteraction:currentInteraction,setCurrentInteraction:setCurrentInteraction,numberOfLines:numberOfLines,isTextArea:isTextArea,hasPopup:hasPopup,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,autoCapitalize:autoCapitalize},metaAttribute({name:MetaConstants.StyledBaseInput}))),jsx(BaseInputVisuals,{interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,isDisabled:isDisabled})]})]}),!hideFormHint&&jsx(BaseBox,{marginLeft:makeSize(isLabelLeftPositioned&&!hideLabelText?136:0),children:jsxs(BaseBox,{display:"flex",flexDirection:"row",justifyContent:willRenderHintText?'space-between':'flex-end',children:[jsx(FormHint,{type:getHintType({validationState:validationState,hasHelpText:Boolean(helpText)}),helpText:helpText,errorText:errorText,successText:successText,helpTextId:helpTextId,errorTextId:errorTextId,successTextId:successTextId}),trailingFooterSlot==null?void 0:trailingFooterSlot(inputValue)]})})]}));});
|
|
2787
|
+
var _excluded$l=["as","label","labelPosition","placeholder","type","defaultValue","name","value","onFocus","onChange","onInput","onBlur","onSubmit","onClick","onKeyDown","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","leadingIcon","prefix","interactionElement","suffix","trailingIcon","maxCharacters","textAlign","autoFocus","keyboardReturnKeyType","keyboardType","autoCompleteSuggestionType","trailingHeaderSlot","trailingFooterSlot","numberOfLines","id","componentName","accessibilityLabel","labelId","activeDescendant","hideLabelText","hideFormHint","hasPopup","popupId","isPopupExpanded","shouldIgnoreBlurAnimation","autoCapitalize","setInputWrapperRef","testID"];var autoCompleteSuggestionTypeValues=['none','on','name','email','username','password','newPassword','oneTimeCode','telephone','postalCode','countryName','creditCardNumber','creditCardCSC','creditCardExpiry','creditCardExpiryMonth','creditCardExpiryYear'];var useInput=function useInput(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,onClick=_ref.onClick,onFocus=_ref.onFocus,onChange=_ref.onChange,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,onInput=_ref.onInput,onKeyDown=_ref.onKeyDown;if(__DEV__){if(value&&defaultValue){throwBladeError({message:`Either 'value' or 'defaultValue' shall be passed. This decides if the input field is controlled or uncontrolled`,moduleName:'Input'});}}var _React$useState=React__default.useState(defaultValue!=null?defaultValue:value),_React$useState2=_slicedToArray(_React$useState,2),inputValue=_React$useState2[0],setInputValue=_React$useState2[1];var handleOnFocus=React__default.useCallback(function(_ref2){var name=_ref2.name,value=_ref2.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value;_value=(_value$target$value=value==null?void 0:value.target.value)!=null?_value$target$value:'';}onFocus==null?void 0:onFocus({name:name,value:_value});},[onFocus]);var handleOnClick=React__default.useCallback(function(_ref3){var name=_ref3.name,value=_ref3.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$currentTarget$;_value=(_value$currentTarget$=value==null?void 0:value.currentTarget.value)!=null?_value$currentTarget$:'';}onClick==null?void 0:onClick({name:name,value:_value});},[onClick]);var handleOnSubmit=React__default.useCallback(function(_ref4){var name=_ref4.name,value=_ref4.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value2;_value=(_value$target$value2=value==null?void 0:value.target.value)!=null?_value$target$value2:'';}if(isReactNative$4()){onSubmit==null?void 0:onSubmit({name:name,value:_value});}},[onSubmit]);var handleOnBlur=React__default.useCallback(function(_ref5){var name=_ref5.name,value=_ref5.value;var _value='';if(getPlatformType()==='react-native'&&typeof value=='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value3;_value=(_value$target$value3=value==null?void 0:value.target.value)!=null?_value$target$value3:'';}onBlur==null?void 0:onBlur({name:name,value:_value});},[onBlur]);var handleOnChange=React__default.useCallback(function(_ref6){var name=_ref6.name,value=_ref6.value;var _value='';if(getPlatformType()==='react-native'&&typeof value==='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value4;_value=(_value$target$value4=value==null?void 0:value.target.value)!=null?_value$target$value4:'';}onChange==null?void 0:onChange({name:name,value:_value});setInputValue(_value);},[onChange]);var handleOnInput=React__default.useCallback(function(_ref7){var name=_ref7.name,value=_ref7.value;var _value='';if(getPlatformType()==='react-native'&&typeof value=='string'){_value=value;}else if(typeof value!=='string'){var _value$target$value5;_value=(_value$target$value5=value==null?void 0:value.target.value)!=null?_value$target$value5:'';}onInput==null?void 0:onInput({name:name,value:_value});},[onInput]);var handleOnKeyDown=React__default.useCallback(function(_ref8){var name=_ref8.name,key=_ref8.key,code=_ref8.code,event=_ref8.event;onKeyDown==null?void 0:onKeyDown({name:name,key:key,code:code,event:event});},[onKeyDown]);return {handleOnFocus:handleOnFocus,handleOnClick:handleOnClick,handleOnChange:handleOnChange,handleOnBlur:handleOnBlur,handleOnSubmit:handleOnSubmit,handleOnInput:handleOnInput,handleOnKeyDown:handleOnKeyDown,inputValue:inputValue};};var getHintType=function getHintType(_ref9){var validationState=_ref9.validationState,hasHelpText=_ref9.hasHelpText;if(validationState==='error'){return 'error';}if(validationState==='success'){return 'success';}if(hasHelpText){return 'help';}return 'help';};var getDescribedByElementId=function getDescribedByElementId(_ref10){var validationState=_ref10.validationState,hasErrorText=_ref10.hasErrorText,hasSuccessText=_ref10.hasSuccessText,hasHelpText=_ref10.hasHelpText,errorTextId=_ref10.errorTextId,successTextId=_ref10.successTextId,helpTextId=_ref10.helpTextId;if(validationState==='error'&&hasErrorText){return errorTextId;}if(validationState==='success'&&hasSuccessText){return successTextId;}if(hasHelpText){return helpTextId;}return '';};var BaseInput=React__default.forwardRef(function(_ref11,ref){var _ref11$as=_ref11.as,as=_ref11$as===void 0?'input':_ref11$as,label=_ref11.label,_ref11$labelPosition=_ref11.labelPosition,labelPosition=_ref11$labelPosition===void 0?'top':_ref11$labelPosition,placeholder=_ref11.placeholder,_ref11$type=_ref11.type,type=_ref11$type===void 0?'text':_ref11$type,defaultValue=_ref11.defaultValue,name=_ref11.name,value=_ref11.value,onFocus=_ref11.onFocus,onChange=_ref11.onChange,onInput=_ref11.onInput,onBlur=_ref11.onBlur,onSubmit=_ref11.onSubmit,onClick=_ref11.onClick,onKeyDown=_ref11.onKeyDown,isDisabled=_ref11.isDisabled,necessityIndicator=_ref11.necessityIndicator,validationState=_ref11.validationState,errorText=_ref11.errorText,helpText=_ref11.helpText,successText=_ref11.successText,isRequired=_ref11.isRequired,leadingIcon=_ref11.leadingIcon,prefix=_ref11.prefix,interactionElement=_ref11.interactionElement,suffix=_ref11.suffix,trailingIcon=_ref11.trailingIcon,maxCharacters=_ref11.maxCharacters,textAlign=_ref11.textAlign,autoFocus=_ref11.autoFocus,keyboardReturnKeyType=_ref11.keyboardReturnKeyType,keyboardType=_ref11.keyboardType,autoCompleteSuggestionType=_ref11.autoCompleteSuggestionType,trailingHeaderSlot=_ref11.trailingHeaderSlot,trailingFooterSlot=_ref11.trailingFooterSlot,numberOfLines=_ref11.numberOfLines,id=_ref11.id,componentName=_ref11.componentName,accessibilityLabel=_ref11.accessibilityLabel,labelId=_ref11.labelId,activeDescendant=_ref11.activeDescendant,hideLabelText=_ref11.hideLabelText,hideFormHint=_ref11.hideFormHint,hasPopup=_ref11.hasPopup,popupId=_ref11.popupId,isPopupExpanded=_ref11.isPopupExpanded,shouldIgnoreBlurAnimation=_ref11.shouldIgnoreBlurAnimation,autoCapitalize=_ref11.autoCapitalize,setInputWrapperRef=_ref11.setInputWrapperRef,testID=_ref11.testID,styledProps=_objectWithoutProperties(_ref11,_excluded$l);var _useTheme=useTheme(),theme=_useTheme.theme;var _useInput=useInput({defaultValue:defaultValue,value:value,onFocus:onFocus,onClick:onClick,onChange:onChange,onBlur:onBlur,onSubmit:onSubmit,onInput:onInput,onKeyDown:onKeyDown}),handleOnFocus=_useInput.handleOnFocus,handleOnChange=_useInput.handleOnChange,handleOnClick=_useInput.handleOnClick,handleOnBlur=_useInput.handleOnBlur,handleOnSubmit=_useInput.handleOnSubmit,handleOnInput=_useInput.handleOnInput,handleOnKeyDown=_useInput.handleOnKeyDown,inputValue=_useInput.inputValue;var _useFormId=useFormId(id),inputId=_useFormId.inputId,helpTextId=_useFormId.helpTextId,errorTextId=_useFormId.errorTextId,successTextId=_useFormId.successTextId;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var isLabelLeftPositioned=labelPosition==='left'&&matchedDeviceType==='desktop';var _useInteraction=useInteraction(),currentInteraction=_useInteraction.currentInteraction,setCurrentInteraction=_useInteraction.setCurrentInteraction;var _isRequired=isRequired||necessityIndicator==='required';var accessibilityProps=makeAccessible({required:Boolean(_isRequired),disabled:Boolean(isDisabled),invalid:Boolean(validationState==='error'),describedBy:getDescribedByElementId({validationState:validationState,hasErrorText:Boolean(errorText),hasSuccessText:Boolean(successText),hasHelpText:Boolean(helpText),errorTextId:errorTextId,successTextId:successTextId,helpTextId:helpTextId}),label:accessibilityLabel,hasPopup:hasPopup,expanded:hasPopup?isPopupExpanded:undefined,controls:hasPopup?popupId:undefined,role:hasPopup?'combobox':undefined,activeDescendant:activeDescendant});var willRenderHintText=Boolean(helpText)||Boolean(successText)||Boolean(errorText);if(__DEV__){if(autoCompleteSuggestionType&&!autoCompleteSuggestionTypeValues.includes(autoCompleteSuggestionType)){throwBladeError({message:`Expected autoCompleteSuggestionType to be one of ${autoCompleteSuggestionTypeValues.join(', ')} but received ${autoCompleteSuggestionType}`,moduleName:'Input'});}}var isTextArea=as==='textarea';var isReactNative=getPlatformType()==='react-native';return jsxs(BaseBox,Object.assign({},metaAttribute({name:componentName,testID:testID}),getStyledProps(styledProps),{children:[jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'row':'column',justifyContent:isLabelLeftPositioned?'center':undefined,alignItems:isLabelLeftPositioned?'center':undefined,position:"relative",width:"100%",children:[!hideLabelText&&jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'column':'row',justifyContent:"space-between",alignSelf:isTextArea?'flex-start':undefined,marginTop:isTextArea&&isLabelLeftPositioned?'spacing.3':'spacing.0',marginBottom:isTextArea&&isLabelLeftPositioned?'spacing.3':'spacing.0',children:[jsx(FormLabel,{as:"label",necessityIndicator:necessityIndicator,position:labelPosition,id:labelId,htmlFor:inputId,children:label}),trailingHeaderSlot==null?void 0:trailingHeaderSlot(inputValue)]}),jsxs(BaseInputWrapper,{isTextArea:isTextArea,isDisabled:isDisabled,validationState:validationState,currentInteraction:currentInteraction,isLabelLeftPositioned:isLabelLeftPositioned,setInputWrapperRef:setInputWrapperRef,children:[jsx(BaseInputVisuals,{leadingIcon:leadingIcon,prefix:prefix,isDisabled:isDisabled}),jsx(StyledBaseInput,Object.assign({as:isReactNative?undefined:as,id:inputId,ref:ref,name:name,type:type,defaultValue:defaultValue,value:value,placeholder:placeholder,isDisabled:isDisabled,validationState:validationState,isRequired:_isRequired,handleOnFocus:handleOnFocus,handleOnChange:handleOnChange,handleOnBlur:handleOnBlur,handleOnSubmit:handleOnSubmit,handleOnInput:handleOnInput,handleOnKeyDown:handleOnKeyDown,handleOnClick:handleOnClick,leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,maxCharacters:maxCharacters,textAlign:textAlign,autoFocus:autoFocus,keyboardReturnKeyType:keyboardReturnKeyType,keyboardType:keyboardType,autoCompleteSuggestionType:autoCompleteSuggestionType,accessibilityProps:accessibilityProps,currentInteraction:currentInteraction,setCurrentInteraction:setCurrentInteraction,numberOfLines:numberOfLines,isTextArea:isTextArea,hasPopup:hasPopup,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,autoCapitalize:autoCapitalize},metaAttribute({name:MetaConstants.StyledBaseInput}))),jsx(BaseInputVisuals,{interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,isDisabled:isDisabled})]})]}),!hideFormHint&&jsx(BaseBox,{marginLeft:makeSize(isLabelLeftPositioned&&!hideLabelText?136:0),children:jsxs(BaseBox,{display:"flex",flexDirection:"row",justifyContent:willRenderHintText?'space-between':'flex-end',children:[jsx(FormHint,{type:getHintType({validationState:validationState,hasHelpText:Boolean(helpText)}),helpText:helpText,errorText:errorText,successText:successText,helpTextId:helpTextId,errorTextId:errorTextId,successTextId:successTextId}),trailingFooterSlot==null?void 0:trailingFooterSlot(inputValue)]})})]}));});
|
|
2788
2788
|
|
|
2789
2789
|
var CharacterCounter=function CharacterCounter(_ref){var currentCount=_ref.currentCount,maxCount=_ref.maxCount;return jsxs(Text,{variant:"caption",weight:"regular",type:"muted",children:[currentCount,"/",maxCount]});};
|
|
2790
2790
|
|
|
@@ -2802,7 +2802,7 @@ var _excluded$g=["autoFocus","errorText","helpText","isDisabled","keyboardReturn
|
|
|
2802
2802
|
|
|
2803
2803
|
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"})});};
|
|
2804
2804
|
|
|
2805
|
-
var _excluded$f=["icon","onChange","defaultValue","placeholder","onBlur"];var _SelectInput=function _SelectInput(props,ref){var _props$label;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,setSelectedIndices=_useDropdown.setSelectedIndices,controlledValueIndices=_useDropdown.controlledValueIndices,options=_useDropdown.options,changeCallbackTriggerer=_useDropdown.changeCallbackTriggerer,isControlled=_useDropdown.isControlled,setIsControlled=_useDropdown.setIsControlled,selectionType=_useDropdown.selectionType,selectedIndices=_useDropdown.selectedIndices;var icon=props.icon;props.onChange;props.defaultValue;var _props$placeholder=props.placeholder,placeholder=_props$placeholder===void 0?'Select Option':_props$placeholder,_onBlur=props.onBlur,baseInputProps=_objectWithoutProperties(props,_excluded$f);var getValuesArrayFromIndices=function getValuesArrayFromIndices(){var indices=[];if(isControlled){indices=controlledValueIndices;}else {indices=selectedIndices;}return indices.map(function(selectionIndex){return options[selectionIndex].value;});};var isFirstRenderRef=React__default.useRef(true);var selectValues=function selectValues(valuesToSelect){if(options.length>0){if(isEmpty_1(valuesToSelect)){setSelectedIndices([]);}else if(typeof valuesToSelect==='string'){var selectedItemIndex=options.findIndex(function(option){return option.value===valuesToSelect;});if(selectedItemIndex>=0){setSelectedIndices([selectedItemIndex]);}}else {var uniqueValues=Array.from(new Set(valuesToSelect));var userValues=selectionType==='single'?[valuesToSelect==null?void 0:valuesToSelect[0]]:uniqueValues;var selectedItemIndices=userValues.map(function(optionValue){return options.findIndex(function(option){return option.value===optionValue;});}).filter(function(value){return value>=0;});setSelectedIndices(selectedItemIndices);}}};React__default.useEffect(function(){if(options.length>0&&props.defaultValue){selectValues(props.defaultValue);}},[options.length]);React__default.useEffect(function(){if(options.length>0&&props.value!==undefined){if(!isControlled){setIsControlled(true);}selectValues(props.value);}},[props.value,options]);React__default.useEffect(function(){if(isFirstRenderRef.current){isFirstRenderRef.current=false;return;}if(props.onChange&&!isFirstRenderRef.current){props.onChange({name:props.name,values:getValuesArrayFromIndices()});}},[changeCallbackTriggerer]);React__default.useEffect(function(){setHasLabelOnLeft(props.labelPosition==='left');},[props.labelPosition,setHasLabelOnLeft]);return jsxs(BaseBox,{position:"relative",children:[!isReactNative$4()?jsx(VisuallyHidden,{children:jsx("input",{onFocus:function onFocus(){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();},ref:ref,tabIndex:-1,required:props.isRequired,name:props.name,value:value,onChange:function onChange(){},"aria-hidden":true})}):null,jsx(BaseInput,Object.assign({},baseInputProps,{as:"button",label:props.label,hideLabelText:((_props$label=props.label)==null?void 0:_props$label.length)===0,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:function onClick(e){onTriggerClick();props==null?void 0:props.onClick==null?void 0:props.onClick(e);},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(!props.isDisabled){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=assignWithoutSideEffects(React__default.forwardRef(_SelectInput),{componentId:componentIds$1.triggers.SelectInput});
|
|
2805
|
+
var _excluded$f=["icon","onChange","defaultValue","placeholder","onBlur"];var _SelectInput=function _SelectInput(props,ref){var _props$label;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,setSelectedIndices=_useDropdown.setSelectedIndices,controlledValueIndices=_useDropdown.controlledValueIndices,options=_useDropdown.options,changeCallbackTriggerer=_useDropdown.changeCallbackTriggerer,isControlled=_useDropdown.isControlled,setIsControlled=_useDropdown.setIsControlled,selectionType=_useDropdown.selectionType,selectedIndices=_useDropdown.selectedIndices,triggererWrapperRef=_useDropdown.triggererWrapperRef;var icon=props.icon;props.onChange;props.defaultValue;var _props$placeholder=props.placeholder,placeholder=_props$placeholder===void 0?'Select Option':_props$placeholder,_onBlur=props.onBlur,baseInputProps=_objectWithoutProperties(props,_excluded$f);var getValuesArrayFromIndices=function getValuesArrayFromIndices(){var indices=[];if(isControlled){indices=controlledValueIndices;}else {indices=selectedIndices;}return indices.map(function(selectionIndex){return options[selectionIndex].value;});};var isFirstRenderRef=React__default.useRef(true);var selectValues=function selectValues(valuesToSelect){if(options.length>0){if(isEmpty_1(valuesToSelect)){setSelectedIndices([]);}else if(typeof valuesToSelect==='string'){var selectedItemIndex=options.findIndex(function(option){return option.value===valuesToSelect;});if(selectedItemIndex>=0){setSelectedIndices([selectedItemIndex]);}}else {var uniqueValues=Array.from(new Set(valuesToSelect));var userValues=selectionType==='single'?[valuesToSelect==null?void 0:valuesToSelect[0]]:uniqueValues;var selectedItemIndices=userValues.map(function(optionValue){return options.findIndex(function(option){return option.value===optionValue;});}).filter(function(value){return value>=0;});setSelectedIndices(selectedItemIndices);}}};React__default.useEffect(function(){if(options.length>0&&props.defaultValue){selectValues(props.defaultValue);}},[options.length]);React__default.useEffect(function(){if(options.length>0&&props.value!==undefined){if(!isControlled){setIsControlled(true);}selectValues(props.value);}},[props.value,options]);React__default.useEffect(function(){if(isFirstRenderRef.current){isFirstRenderRef.current=false;return;}if(props.onChange&&!isFirstRenderRef.current){props.onChange({name:props.name,values:getValuesArrayFromIndices()});}},[changeCallbackTriggerer]);React__default.useEffect(function(){setHasLabelOnLeft(props.labelPosition==='left');},[props.labelPosition,setHasLabelOnLeft]);return jsxs(BaseBox,{position:"relative",children:[!isReactNative$4()?jsx(VisuallyHidden,{children:jsx("input",{onFocus:function onFocus(){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();},ref:ref,tabIndex:-1,required:props.isRequired,name:props.name,value:value,onChange:function onChange(){},"aria-hidden":true})}):null,jsx(BaseInput,Object.assign({},baseInputProps,{as:"button",label:props.label,hideLabelText:((_props$label=props.label)==null?void 0:_props$label.length)===0,componentName:MetaConstants.SelectInput,ref:!isReactNative$4()?triggererRef:null,setInputWrapperRef:function setInputWrapperRef(wrapperNode){triggererWrapperRef.current=wrapperNode;},textAlign:"left",value:displayValue,placeholder:placeholder,id:`${dropdownBaseId}-trigger`,labelId:`${dropdownBaseId}-label`,leadingIcon:icon,hasPopup:getActionListContainerRole(hasFooterAction,dropdownTriggerer),isPopupExpanded:isOpen,onClick:function onClick(e){onTriggerClick();props==null?void 0:props.onClick==null?void 0:props.onClick(e);},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(!props.isDisabled){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=assignWithoutSideEffects(React__default.forwardRef(_SelectInput),{componentId:componentIds$1.triggers.SelectInput});
|
|
2806
2806
|
|
|
2807
2807
|
var _excluded$e=["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$e);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 isWeb=!isReactNative$4();var a11yProps=makeAccessible(Object.assign({label:accessibilityLabel!=null?accessibilityLabel:childrenString},isWeb&&{role:'status'}));return jsx(BaseBox,Object.assign({display:isWeb?'inline-flex':'flex'},a11yProps,metaAttribute({name:MetaConstants.Indicator,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,{display:"flex",flexDirection:"row",alignItems:"center",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,{textAlign:"left",contrast:"low",type:"subtle",size:dimensions.textSize,children:children})})]})}));};
|
|
2808
2808
|
|