@razorpay/blade 10.15.0 → 10.15.2
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/README.md +28 -26
- package/build/components/index.d.ts +2 -1
- package/build/components/index.development.web.js +59 -36
- package/build/components/index.development.web.js.map +1 -1
- package/build/components/index.native.d.ts +2 -1
- package/build/components/index.native.js +15 -13
- package/build/components/index.native.js.map +1 -1
- package/build/components/index.production.web.js +59 -36
- 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/package.json +1 -1
|
@@ -2934,10 +2934,11 @@ declare type ActionColors = `action.text.${DotNotationColorStringToken<Theme['co
|
|
|
2934
2934
|
declare type BadgeTextColors = `badge.text.${DotNotationColorStringToken<Theme['colors']['badge']['text']>}`;
|
|
2935
2935
|
declare type WhiteTextColors = `white.action.text.${DotNotationColorStringToken<Theme['colors']['white']['action']['text']>}`;
|
|
2936
2936
|
declare type BrandPrimaryColors = `brand.primary.${keyof Theme['colors']['brand']['primary']}`;
|
|
2937
|
+
declare type BrandSecondaryColors = `brand.secondary.${keyof Theme['colors']['brand']['secondary']}`;
|
|
2937
2938
|
declare type As = 'code' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'abbr' | 'q' | 'cite' | 'figcaption' | 'div';
|
|
2938
2939
|
declare type BaseTextProps = {
|
|
2939
2940
|
id?: string;
|
|
2940
|
-
color?: BrandPrimaryColors | ActionColors | FeedbackColors | SurfaceColors | FeedbackActionColors | WhiteTextColors | BadgeTextColors;
|
|
2941
|
+
color?: BrandPrimaryColors | BrandSecondaryColors | ActionColors | FeedbackColors | SurfaceColors | FeedbackActionColors | WhiteTextColors | BadgeTextColors;
|
|
2941
2942
|
fontFamily?: keyof Theme['typography']['fonts']['family'];
|
|
2942
2943
|
fontSize?: keyof Theme['typography']['fonts']['size'];
|
|
2943
2944
|
fontWeight?: keyof Theme['typography']['fonts']['weight'];
|
|
@@ -2065,7 +2065,7 @@ var CheckboxGroupContext=React__default.createContext({});var CheckboxGroupProvi
|
|
|
2065
2065
|
|
|
2066
2066
|
var checkboxSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:size[12],height:size[12]},medium:{width:size[16],height:size[16]}}};var checkboxIconColors={variants:{default:{border:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500.lowContrast'},background:{checked:'colors.brand.primary.500',unchecked:'transparent'}},disabled:{border:{checked:'transparent',unchecked:'colors.brand.gray.a100.lowContrast'},background:{checked:'colors.brand.gray.a100.lowContrast',unchecked:'transparent'}},negative:{border:{checked:'colors.feedback.border.negative.highContrast',unchecked:'colors.feedback.border.negative.highContrast'},background:{checked:'colors.feedback.background.negative.highContrast',unchecked:'colors.feedback.background.negative.lowContrast'}}}};var checkboxHoverTokens={default:{background:{checked:'colors.brand.primary.600',unchecked:'colors.brand.gray.a50.lowContrast'},border:{checked:'colors.brand.primary.600',unchecked:'colors.brand.gray.500.lowContrast'}}};
|
|
2067
2067
|
|
|
2068
|
-
var getCheckboxIconWrapperStyles=function getCheckboxIconWrapperStyles(_ref){var theme=_ref.theme,isChecked=_ref.isChecked,isDisabled=_ref.isDisabled,isNegative=_ref.isNegative,size=_ref.size;var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var checked=isChecked?'checked':'unchecked';var background=checkboxIconColors.variants[variant].background[checked];var border=checkboxIconColors.variants[variant].border[checked];var backgroundColor=background==='transparent'?background:getIn(theme,background);var borderColor=border==='transparent'?border:getIn(theme,border);return {position:'relative',display:'flex',alignItems:'center',justifyContent:'center',width:makeSpace(checkboxSizes.icon[size].width),height:makeSpace(checkboxSizes.icon[size].height),borderWidth:makeBorderSize(theme.border.width.thick),borderStyle:'solid',margin:makeSpace(theme.spacing[1]),borderRadius:makeSize(theme.border.radius.small),backgroundColor:backgroundColor,borderColor:borderColor};};
|
|
2068
|
+
var getCheckboxIconWrapperStyles=function getCheckboxIconWrapperStyles(_ref){var theme=_ref.theme,isChecked=_ref.isChecked,isDisabled=_ref.isDisabled,isNegative=_ref.isNegative,size=_ref.size;var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var checked=isChecked?'checked':'unchecked';var background=checkboxIconColors.variants[variant].background[checked];var border=checkboxIconColors.variants[variant].border[checked];var backgroundColor=background==='transparent'?background:getIn(theme,background);var borderColor=border==='transparent'?border:getIn(theme,border);return {position:'relative',display:'flex',alignItems:'center',justifyContent:'center',flexShrink:0,width:makeSpace(checkboxSizes.icon[size].width),height:makeSpace(checkboxSizes.icon[size].height),borderWidth:makeBorderSize(theme.border.width.thick),borderStyle:'solid',margin:makeSpace(theme.spacing[1]),borderRadius:makeSize(theme.border.radius.small),backgroundColor:backgroundColor,borderColor:borderColor};};
|
|
2069
2069
|
|
|
2070
2070
|
var CheckboxIconWrapper=styled.View(function(props){return getCheckboxIconWrapperStyles(props);});
|
|
2071
2071
|
|
|
@@ -2662,7 +2662,7 @@ var _excluded$J=["defaultChecked","validationState","isChecked","isDisabled","is
|
|
|
2662
2662
|
<Checkbox value="apple">Apple</Checkbox>
|
|
2663
2663
|
<Checkbox value="mango">Mango</Checkbox>
|
|
2664
2664
|
</CheckboxGroup>
|
|
2665
|
-
`);}}var _validationState=validationState!=null?validationState:groupProps==null?void 0:groupProps.validationState;var _hasError=_validationState==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=Boolean(isRequired||(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required');var _name=name!=null?name:groupProps==null?void 0:groupProps.name;var _isChecked=isChecked!=null?isChecked:groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var isSmall=_size==='small';var showSupportingText=validationState!=='error'&&helpText;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,event=_ref2.event,value=_ref2.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.addValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue(value);}onChange==null?void 0:onChange({isChecked:isChecked,event:event,value:value});};var _useCheckbox=useCheckbox({defaultChecked:defaultChecked,isChecked:_isChecked,isIndeterminate:isIndeterminate,hasError:_hasError,hasHelperText:Boolean(showSupportingText),isDisabled:_isDisabled,isRequired:_isRequired,name:_name,value:value,onChange:handleChange}),state=_useCheckbox.state,ids=_useCheckbox.ids,inputProps=_useCheckbox.inputProps;return jsxs(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Checkbox,testID:testID}),getStyledProps(styledProps),{children:[jsx(SelectorLabel,{componentName:MetaConstants.CheckboxLabel,inputProps:state.isReactNative?inputProps:{},children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",
|
|
2665
|
+
`);}}var _validationState=validationState!=null?validationState:groupProps==null?void 0:groupProps.validationState;var _hasError=_validationState==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=Boolean(isRequired||(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required');var _name=name!=null?name:groupProps==null?void 0:groupProps.name;var _isChecked=isChecked!=null?isChecked:groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var isSmall=_size==='small';var showSupportingText=validationState!=='error'&&helpText;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,event=_ref2.event,value=_ref2.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.addValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue(value);}onChange==null?void 0:onChange({isChecked:isChecked,event:event,value:value});};var _useCheckbox=useCheckbox({defaultChecked:defaultChecked,isChecked:_isChecked,isIndeterminate:isIndeterminate,hasError:_hasError,hasHelperText:Boolean(showSupportingText),isDisabled:_isDisabled,isRequired:_isRequired,name:_name,value:value,onChange:handleChange}),state=_useCheckbox.state,ids=_useCheckbox.ids,inputProps=_useCheckbox.inputProps;return jsxs(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Checkbox,testID:testID}),getStyledProps(styledProps),{children:[jsx(SelectorLabel,{componentName:MetaConstants.CheckboxLabel,inputProps:state.isReactNative?inputProps:{},children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:checkboxHoverTokens,isChecked:state.isChecked||Boolean(isIndeterminate),isDisabled:_isDisabled,hasError:_hasError,inputProps:inputProps,tabIndex:tabIndex,ref:ref}),jsx(CheckboxIcon,{size:_size,isChecked:state.isChecked,isIndeterminate:isIndeterminate,isDisabled:_isDisabled,isNegative:_hasError}),children?jsx(SelectorTitle,{size:_size,isDisabled:_isDisabled,children:children}):null]}),showSupportingText?jsx(BaseBox,{marginLeft:isSmall?'spacing.6':'spacing.7',children:jsx(SelectorSupportText,{id:ids==null?void 0:ids.helpTextId,children:helpText})}):null]})}),jsx(FormHint,{errorText:errorText,errorTextId:ids==null?void 0:ids.errorTextId,type:validationState==='error'?'error':'help'})]}));};var Checkbox=assignWithoutSideEffects(React__default.forwardRef(_Checkbox),{displayName:'Checkbox'});
|
|
2666
2666
|
|
|
2667
2667
|
var useCheckboxGroup=function useCheckboxGroup(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,labelPosition=_ref.labelPosition,_onChange=_ref.onChange,validationState=_ref.validationState,name=_ref.name,necessityIndicator=_ref.necessityIndicator,size=_ref.size;var _useTheme=useTheme(),platform=_useTheme.platform;var _useFormId=useFormId('checkbox-group'),labelId=_useFormId.labelId;var _useControllableState=useControllableState({value:value,defaultValue:defaultValue||[],onChange:function onChange(values){return _onChange==null?void 0:_onChange({values:values,name:name});}}),_useControllableState2=_slicedToArray(_useControllableState,2),checkedValues=_useControllableState2[0],setValue=_useControllableState2[1];var state=React__default.useMemo(function(){return {value:checkedValues,setValue:function(_setValue){function setValue(_x){return _setValue.apply(this,arguments);}setValue.toString=function(){return _setValue.toString();};return setValue;}(function(value){if(isDisabled){return;}setValue(function(){return value;});}),isChecked:function isChecked(value){return checkedValues.includes(value);},addValue:function addValue(value){if(isDisabled){return;}if(!checkedValues.includes(value)){setValue(function(){return checkedValues.concat(value);});}},removeValue:function removeValue(value){if(isDisabled){return;}if(checkedValues.includes(value)){setValue(function(){return checkedValues.filter(function(existingValue){return existingValue!==value;});});}}};},[checkedValues,isDisabled,setValue]);var contextValue=React__default.useMemo(function(){return {validationState:validationState,isDisabled:isDisabled,isRequired:isRequired,labelPosition:platform==='onMobile'?'top':labelPosition,name:name,necessityIndicator:necessityIndicator,state:state,size:size};},[validationState,isDisabled,isRequired,platform,labelPosition,name,necessityIndicator,state,size]);return {state:state,contextValue:contextValue,ids:{labelId:labelId}};};
|
|
2668
2668
|
|
|
@@ -2684,7 +2684,7 @@ var validBoxAsValues=['div','section','footer','header','main','aside','nav','sp
|
|
|
2684
2684
|
|
|
2685
2685
|
var validateBackgroundString=function validateBackgroundString(stringBackgroundColorValue){if(__DEV__){if(!stringBackgroundColorValue.startsWith('surface.background')&&!stringBackgroundColorValue.startsWith('brand.')&&stringBackgroundColorValue!=='transparent'){throwBladeError({message:`Oops! Currently you can only use \`transparent\`, \`surface.background.*\`, and \`brand.*\` tokens with backgroundColor property but we received \`${stringBackgroundColorValue}\` instead.\n\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss ✨`,moduleName:'Box'});}}};var validateBackgroundProp=function validateBackgroundProp(responsiveBackgroundColor){if(__DEV__){if(responsiveBackgroundColor){if(typeof responsiveBackgroundColor==='string'){validateBackgroundString(responsiveBackgroundColor);return;}Object.values(responsiveBackgroundColor).forEach(function(backgroundColor){if(typeof backgroundColor==='string'){validateBackgroundString(backgroundColor);}});}}};var makeBoxProps=function makeBoxProps(props){return {display:props.display,overflow:props.overflow,overflowX:props.overflowX,overflowY:props.overflowY,whiteSpace:props.whiteSpace,height:props.height,minHeight:props.minHeight,maxHeight:props.maxHeight,width:props.width,minWidth:props.minWidth,maxWidth:props.maxWidth,textAlign:props.textAlign,flex:props.flex,flexWrap:props.flexWrap,flexDirection:props.flexDirection,flexGrow:props.flexGrow,flexShrink:props.flexShrink,flexBasis:props.flexBasis,alignItems:props.alignItems,alignContent:props.alignContent,alignSelf:props.alignSelf,justifyItems:props.justifyItems,justifyContent:props.justifyContent,justifySelf:props.justifySelf,placeSelf:props.placeSelf,placeItems:props.placeItems,order:props.order,grid:props.grid,gridColumn:props.gridColumn,gridRow:props.gridRow,gridRowStart:props.gridRowStart,gridRowEnd:props.gridRowEnd,gridColumnStart:props.gridColumnStart,gridColumnEnd:props.gridColumnEnd,gridArea:props.gridArea,gridAutoFlow:props.gridAutoFlow,gridAutoRows:props.gridAutoRows,gridAutoColumns:props.gridAutoColumns,gridTemplate:props.gridTemplate,gridTemplateAreas:props.gridTemplateAreas,gridTemplateColumns:props.gridTemplateColumns,gridTemplateRows:props.gridTemplateRows,padding:props.padding,paddingTop:props.paddingTop,paddingBottom:props.paddingBottom,paddingRight:props.paddingRight,paddingLeft:props.paddingLeft,paddingX:props.paddingX,paddingY:props.paddingY,margin:props.margin,marginBottom:props.marginBottom,marginTop:props.marginTop,marginRight:props.marginRight,marginLeft:props.marginLeft,marginX:props.marginX,marginY:props.marginY,gap:props.gap,rowGap:props.rowGap,columnGap:props.columnGap,position:props.position,zIndex:props.zIndex,top:props.top,right:props.right,bottom:props.bottom,left:props.left,backgroundColor:props.backgroundColor,backgroundImage:props.backgroundImage,backgroundSize:props.backgroundSize,backgroundPosition:props.backgroundPosition,backgroundOrigin:props.backgroundOrigin,backgroundRepeat:props.backgroundRepeat,elevation:props.elevation,opacity:props.opacity,visibility:props.visibility,borderWidth:props.borderWidth,borderColor:props.borderColor,borderTopWidth:props.borderTopWidth,borderTopColor:props.borderTopColor,borderRightWidth:props.borderRightWidth,borderRightColor:props.borderRightColor,borderBottomWidth:props.borderBottomWidth,borderBottomColor:props.borderBottomColor,borderLeftWidth:props.borderLeftWidth,borderLeftColor:props.borderLeftColor,borderRadius:props.borderRadius,borderTopLeftRadius:props.borderTopLeftRadius,borderTopRightRadius:props.borderTopRightRadius,borderBottomRightRadius:props.borderBottomRightRadius,borderBottomLeftRadius:props.borderBottomLeftRadius,transform:props.transform,transformOrigin:props.transformOrigin,clipPath:props.clipPath,onMouseEnter:props.onMouseEnter,onMouseLeave:props.onMouseLeave,onMouseOver:props.onMouseOver,onScroll:props.onScroll,draggable:props.draggable,onDragStart:props.onDragStart,onDragEnd:props.onDragEnd,onDragEnter:props.onDragEnter,onDragLeave:props.onDragLeave,onDragOver:props.onDragOver,onDrop:props.onDrop,pointerEvents:props.pointerEvents,children:props.children,tabIndex:props.tabIndex,as:isReactNative$4()?undefined:props.as};};var _Box=function _Box(props,ref){React__default.useEffect(function(){if(__DEV__){validateBackgroundProp(props.backgroundColor);}},[props.backgroundColor]);React__default.useEffect(function(){if(__DEV__){if(props.as){if(isReactNative$4()){throwBladeError({message:'`as` prop is not supported on React Native',moduleName:'Box'});}if(!validBoxAsValues.includes(props.as)){throwBladeError({message:`Invalid \`as\` prop value - ${props.as}. Only ${validBoxAsValues.join(', ')} are valid values`,moduleName:'Box'});}}}},[props.as]);return jsx(BaseBox,Object.assign({ref:ref,id:props.id},metaAttribute({name:MetaConstants.Box,testID:props.testID}),makeBoxProps(props)));};var Box=assignWithoutSideEffects(React__default.forwardRef(_Box),{displayName:'Box'});
|
|
2686
2686
|
|
|
2687
|
-
var ActionListItemContext=React__default.createContext({});var StyledActionListSectionTitle=styled(BaseBox)(function(props){return {padding:makeSize(props.theme.spacing[3])};});var _ActionListSection=function _ActionListSection(_ref){var title=_ref.title,children=_ref.children,testID=_ref.testID,_hideDivider=_ref._hideDivider,_sectionChildValues=_ref._sectionChildValues;var _useActionListContext=useActionListContext(),surfaceLevel=_useActionListContext.surfaceLevel;var _useDropdown=useDropdown(),hasAutoCompleteInBottomSheetHeader=_useDropdown.hasAutoCompleteInBottomSheetHeader,dropdownTriggerer=_useDropdown.dropdownTriggerer,filteredValues=_useDropdown.filteredValues;var hasAutoComplete=hasAutoCompleteInBottomSheetHeader||dropdownTriggerer===dropdownComponentIds.triggers.AutoComplete;var isSectionVisible=React__default.useMemo(function(){if(hasAutoComplete){var visibleActionListItemInSection=_sectionChildValues==null?void 0:_sectionChildValues.find(function(actionItemValue){return filteredValues.includes(actionItemValue);});return Boolean(visibleActionListItemInSection);}return true;},[_sectionChildValues,hasAutoComplete,filteredValues]);var showDividerInRN=!(_hideDivider&&isReactNative$4());var showDividerInAutoComplete=hasAutoComplete?isSectionVisible&&filteredValues.length>1:true;return jsxs(BaseBox,Object.assign({},makeAccessible({role:getActionListSectionRole(),label:title}),{backgroundColor:`surface.background.level${surfaceLevel}.lowContrast`},metaAttribute({name:MetaConstants.ActionListSection,testID:testID}),{children:[isSectionVisible?jsx(StyledActionListSectionTitle,Object.assign({},makeAccessible({hidden:true}),{children:jsx(Text,{color:"surface.text.muted.lowContrast",size:"small",weight:"bold",children:title})})):null,jsx(BaseBox,Object.assign({},makeAccessible({role:isReactNative$4()?undefined:'listbox'}),{children:children})),showDividerInAutoComplete&&showDividerInRN?jsx(Divider,{marginX:"spacing.3",marginY:"spacing.1"}):null]}));};var ActionListSection=assignWithoutSideEffects(_ActionListSection,{componentId:componentIds.ActionListSection});var _ActionListItemIcon=function _ActionListItemIcon(_ref2){var icon=_ref2.icon;var Icon=icon;var _React$useContext=React__default.useContext(ActionListItemContext),intent=_React$useContext.intent,isDisabled=_React$useContext.isDisabled;return jsx(Icon,{color:intent==='negative'?'feedback.icon.negative.lowContrast':getNormalTextColor(isDisabled,{isMuted:true}),size:"medium"});};var ActionListItemIcon=assignWithoutSideEffects(_ActionListItemIcon,{componentId:componentIds.ActionListItemIcon});var _ActionListItemBadgeGroup=function _ActionListItemBadgeGroup(_ref3){var children=_ref3.children;return jsx(Box,{display:"flex",alignItems:"center",flexDirection:"row",children:children});};var ActionListItemBadgeGroup=assignWithoutSideEffects(_ActionListItemBadgeGroup,{componentId:componentIds.ActionListItemBadgeGroup});var _ActionListItemBadge=function _ActionListItemBadge(props){return jsx(Badge,Object.assign({size:"medium",marginLeft:"spacing.3"},props));};var ActionListItemBadge=assignWithoutSideEffects(_ActionListItemBadge,{componentId:componentIds.ActionListItemBadge});var _ActionListItemText=function _ActionListItemText(_ref4){var children=_ref4.children;var _React$useContext2=React__default.useContext(ActionListItemContext),isDisabled=_React$useContext2.isDisabled;return jsx(Text,{variant:"caption",color:getNormalTextColor(isDisabled,{isMuted:true}),children:children});};var ActionListItemText=assignWithoutSideEffects(_ActionListItemText,{componentId:componentIds.ActionListItemText});var
|
|
2687
|
+
var ActionListItemContext=React__default.createContext({});var StyledActionListSectionTitle=styled(BaseBox)(function(props){return {padding:makeSize(props.theme.spacing[3])};});var _ActionListSection=function _ActionListSection(_ref){var title=_ref.title,children=_ref.children,testID=_ref.testID,_hideDivider=_ref._hideDivider,_sectionChildValues=_ref._sectionChildValues;var _useActionListContext=useActionListContext(),surfaceLevel=_useActionListContext.surfaceLevel;var _useDropdown=useDropdown(),hasAutoCompleteInBottomSheetHeader=_useDropdown.hasAutoCompleteInBottomSheetHeader,dropdownTriggerer=_useDropdown.dropdownTriggerer,filteredValues=_useDropdown.filteredValues;var hasAutoComplete=hasAutoCompleteInBottomSheetHeader||dropdownTriggerer===dropdownComponentIds.triggers.AutoComplete;var isSectionVisible=React__default.useMemo(function(){if(hasAutoComplete){var visibleActionListItemInSection=_sectionChildValues==null?void 0:_sectionChildValues.find(function(actionItemValue){return filteredValues.includes(actionItemValue);});return Boolean(visibleActionListItemInSection);}return true;},[_sectionChildValues,hasAutoComplete,filteredValues]);var showDividerInRN=!(_hideDivider&&isReactNative$4());var showDividerInAutoComplete=hasAutoComplete?isSectionVisible&&filteredValues.length>1:true;return jsxs(BaseBox,Object.assign({},makeAccessible({role:getActionListSectionRole(),label:title}),{backgroundColor:`surface.background.level${surfaceLevel}.lowContrast`},metaAttribute({name:MetaConstants.ActionListSection,testID:testID}),{children:[isSectionVisible?jsx(StyledActionListSectionTitle,Object.assign({},makeAccessible({hidden:true}),{children:jsx(Text,{color:"surface.text.muted.lowContrast",size:"small",weight:"bold",children:title})})):null,jsx(BaseBox,Object.assign({},makeAccessible({role:isReactNative$4()?undefined:'listbox'}),{children:children})),showDividerInAutoComplete&&showDividerInRN?jsx(Divider,{marginX:"spacing.3",marginY:"spacing.1"}):null]}));};var ActionListSection=assignWithoutSideEffects(_ActionListSection,{componentId:componentIds.ActionListSection});var _ActionListItemIcon=function _ActionListItemIcon(_ref2){var icon=_ref2.icon;var Icon=icon;var _React$useContext=React__default.useContext(ActionListItemContext),intent=_React$useContext.intent,isDisabled=_React$useContext.isDisabled;return jsx(Icon,{color:intent==='negative'?'feedback.icon.negative.lowContrast':getNormalTextColor(isDisabled,{isMuted:true}),size:"medium"});};var ActionListItemIcon=assignWithoutSideEffects(_ActionListItemIcon,{componentId:componentIds.ActionListItemIcon});var _ActionListItemBadgeGroup=function _ActionListItemBadgeGroup(_ref3){var children=_ref3.children;return jsx(Box,{display:"flex",alignItems:"center",flexDirection:"row",children:children});};var ActionListItemBadgeGroup=assignWithoutSideEffects(_ActionListItemBadgeGroup,{componentId:componentIds.ActionListItemBadgeGroup});var _ActionListItemBadge=function _ActionListItemBadge(props){return jsx(Badge,Object.assign({size:"medium",marginLeft:"spacing.3"},props));};var ActionListItemBadge=assignWithoutSideEffects(_ActionListItemBadge,{componentId:componentIds.ActionListItemBadge});var _ActionListItemText=function _ActionListItemText(_ref4){var children=_ref4.children;var _React$useContext2=React__default.useContext(ActionListItemContext),isDisabled=_React$useContext2.isDisabled;return jsx(Text,{variant:"caption",color:getNormalTextColor(isDisabled,{isMuted:true}),children:children});};var ActionListItemText=assignWithoutSideEffects(_ActionListItemText,{componentId:componentIds.ActionListItemText});var makeActionListItemClickable=function makeActionListItemClickable(clickHandler){if(isReactNative$4()){return {onPress:clickHandler};}return {onClick:clickHandler};};var _ActionListItemBody=function _ActionListItemBody(_ref5){var selectionType=_ref5.selectionType,intent=_ref5.intent,description=_ref5.description,isDisabled=_ref5.isDisabled,leading=_ref5.leading,trailing=_ref5.trailing,title=_ref5.title,titleSuffix=_ref5.titleSuffix,isSelected=_ref5.isSelected;return jsxs(Fragment,{children:[jsxs(BaseBox,{display:"flex",justifyContent:"center",flexDirection:"row",alignItems:"center",maxHeight:isReactNative$4()?undefined:makeSize(size[20]),children:[jsx(BaseBox,{display:"flex",justifyContent:"center",alignItems:"center",children:selectionType==='multiple'?jsx(BaseBox,Object.assign({pointerEvents:"none",paddingRight:"spacing.2"},makeAccessible({hidden:true}),{children:jsx(Checkbox,{isChecked:isSelected,tabIndex:-1,isDisabled:isDisabled,children:null})})):leading}),jsxs(BaseBox,{paddingLeft:selectionType==='multiple'||!leading?'spacing.0':'spacing.3',paddingRight:"spacing.3",display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(Text,{truncateAfterLines:1,color:intent==='negative'?'feedback.text.negative.lowContrast':getNormalTextColor(isDisabled),children:title}),titleSuffix]}),jsx(BaseBox,{marginLeft:"auto",children:trailing})]}),jsx(BaseBox,{paddingLeft:leading||selectionType==='multiple'?'spacing.7':undefined,children:description?jsx(Text,{color:getNormalTextColor(isDisabled,{isMuted:true}),size:"small",children:description}):null})]});};var ActionListItemBody=React__default.memo(_ActionListItemBody);var _ActionListItem=function _ActionListItem(props){var _useDropdown2=useDropdown(),activeIndex=_useDropdown2.activeIndex,dropdownBaseId=_useDropdown2.dropdownBaseId,onOptionClick=_useDropdown2.onOptionClick,selectedIndices=_useDropdown2.selectedIndices,setShouldIgnoreBlurAnimation=_useDropdown2.setShouldIgnoreBlurAnimation,selectionType=_useDropdown2.selectionType,dropdownTriggerer=_useDropdown2.dropdownTriggerer,isKeydownPressed=_useDropdown2.isKeydownPressed,filteredValues=_useDropdown2.filteredValues,hasAutoCompleteInBottomSheetHeader=_useDropdown2.hasAutoCompleteInBottomSheetHeader;var _useTheme=useTheme(),platform=_useTheme.platform;var isMobile=platform==='onMobile';var hasAutoComplete=hasAutoCompleteInBottomSheetHeader||dropdownTriggerer===dropdownComponentIds.triggers.AutoComplete;var renderOnWebAs=props.href?'a':'button';var getIsSelected=function getIsSelected(){if(dropdownTriggerer===dropdownComponentIds.triggers.SelectInput||hasAutoComplete){if(typeof props._index==='number'){return selectedIndices.includes(props._index);}return undefined;}return props.isSelected;};var isSelected=getIsSelected();React__default.useEffect(function(){validateActionListItemProps({leading:props.leading,trailing:props.trailing,titleSuffix:props.titleSuffix});},[props.leading,props.trailing,props.titleSuffix]);React__default.useEffect(function(){if(__DEV__){if(dropdownTriggerer===dropdownComponentIds.triggers.SelectInput&&props.intent==='negative'){throwBladeError({message:'negative intent ActionListItem cannot be used inside Dropdown with SelectInput trigger',moduleName:'ActionListItem'});}}},[props.intent,dropdownTriggerer]);return jsx(ActionListItemContext.Provider,{value:{intent:props.intent,isDisabled:props.isDisabled},children:jsx(StyledActionListItem,Object.assign({isVisible:hasAutoComplete&&filteredValues?filteredValues.includes(props.value):true,as:!isReactNative$4()?renderOnWebAs:undefined,id:`${dropdownBaseId}-${props._index}`,type:"button",tabIndex:-1,href:props.href,target:props.target,className:activeIndex===props._index?'active-focus':''},makeAccessible({selected:isSelected,current:isRoleMenu(dropdownTriggerer)?isSelected:undefined,role:getActionListItemRole(dropdownTriggerer,props.href),disabled:props.isDisabled}),makeActionListItemClickable(function(e){if(typeof props._index==='number'){onOptionClick(e,props._index);props.onClick==null?void 0:props.onClick({name:props.value,value:isSelected});}}),metaAttribute({name:MetaConstants.ActionListItem,testID:props.testID}),{onMouseDown:function onMouseDown(){setShouldIgnoreBlurAnimation(true);},onMouseUp:function onMouseUp(){setShouldIgnoreBlurAnimation(false);},"data-value":props.value,"data-index":props._index,selectionType:selectionType,hasDescription:Boolean(props.description),intent:props.intent,isSelected:isSelected,isKeydownPressed:isKeydownPressed,isMobile:isMobile,children:jsx(ActionListItemBody,{selectionType:selectionType,intent:props.intent,description:props.description,isDisabled:props.isDisabled,leading:props.leading,trailing:props.trailing,title:props.title,titleSuffix:props.titleSuffix,isSelected:isSelected})}))});};var ActionListItem=assignWithoutSideEffects(React__default.memo(_ActionListItem),{componentId:componentIds.ActionListItem,displayName:componentIds.ActionListItem});
|
|
2688
2688
|
|
|
2689
2689
|
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;};
|
|
2690
2690
|
|
|
@@ -2696,7 +2696,7 @@ var ActionListContext=React__default.createContext({surfaceLevel:2});var useActi
|
|
|
2696
2696
|
|
|
2697
2697
|
var _ActionListItemAsset=function _ActionListItemAsset(props){var source=typeof props.src==='string'?{uri:props.src}:props.src;return jsx(Image,{source:source,style:{width:size[16],height:size[12]},accessibilityIgnoresInvertColors:true,alt:props.alt});};var ActionListItemAsset=assignWithoutSideEffects(_ActionListItemAsset,{componentId:componentIds.ActionListItemAsset});
|
|
2698
2698
|
|
|
2699
|
-
var MAX_WIDTH$2=size[584];var getCommonStyles=function getCommonStyles(props){var theme=props.theme,contrastType=props.contrastType,
|
|
2699
|
+
var MAX_WIDTH$2=size[584];var getCommonStyles=function getCommonStyles(props){var theme=props.theme,contrastType=props.contrastType,color=props.color,isFullWidth=props.isFullWidth,isDesktop=props.isDesktop;var feedbackColors=theme.colors.feedback;return {background:feedbackColors.background[color][contrastType],padding:isFullWidth?`${makeSpace(theme.spacing[4])} ${makeSpace(theme.spacing[5])}`:`${makeSpace(theme.spacing[3])} ${makeSpace(theme.spacing[3])} ${makeSpace(theme.spacing[4])} ${makeSpace(theme.spacing[3])}`,borderRadius:makeBorderSize(isFullWidth?theme.border.radius.none:theme.border.radius.medium),borderColor:feedbackColors.border[color][contrastType],borderWidth:makeBorderSize(isFullWidth?theme.border.width.none:theme.border.width.thin),borderStyle:'solid',display:'flex',flexDirection:'row',maxWidth:isFullWidth?'auto':makeSize(MAX_WIDTH$2),width:isFullWidth?'100%':undefined,alignItems:isFullWidth&&isDesktop?'center':'flex-start',boxSizing:'border-box'};};
|
|
2700
2700
|
|
|
2701
2701
|
var StyledAlert=styled(BaseBox)(getCommonStyles);
|
|
2702
2702
|
|
|
@@ -2730,7 +2730,7 @@ var useInteraction=function useInteraction(){var _useState=useState('default'),_
|
|
|
2730
2730
|
|
|
2731
2731
|
var _excluded$D=["children","icon","iconPosition","isDisabled","onClick","onKeyDown","variant","href","target","rel","color","accessibilityProps","className","style","size","testID","hitSlop","htmlTitle","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchStart","onTouchEnd"],_excluded2$1=["currentInteraction","setCurrentInteraction"];var getColorToken=function getColorToken(_ref){var variant=_ref.variant,color=_ref.color,element=_ref.element,currentInteraction=_ref.currentInteraction,isDisabled=_ref.isDisabled,isVisited=_ref.isVisited;var state=currentInteraction;if(isDisabled&&variant=='button'){state='disabled';}if(isVisited&&variant=='anchor'){state='visited';}if(color&&color!=='default'&&state!=='visited'){if(color!=='white'){return `feedback.${color}.action.${element}.link.${state}.lowContrast`;}return `white.action.${element}.link.${state}`;}return `action.${element}.link.${state}`;};var getProps=function getProps(_ref2){var theme=_ref2.theme,variant=_ref2.variant,currentInteraction=_ref2.currentInteraction,children=_ref2.children,isDisabled=_ref2.isDisabled,color=_ref2.color,isVisited=_ref2.isVisited,target=_ref2.target,size=_ref2.size;var isButton=variant==='button';var textSizes={fontSize:{xsmall:25,small:75,medium:100,large:200},lineHeight:{xsmall:50,small:50,medium:100,large:300}};var props={as:isButton?'button':'a',textDecorationLine:!isButton&¤tInteraction!=='default'?'underline':'none',iconColor:getColorToken({variant:variant,color:color,element:'icon',currentInteraction:currentInteraction,isDisabled:isDisabled,isVisited:isVisited}),fontSize:textSizes.fontSize[size],lineHeight:textSizes.lineHeight[size],iconSize:size,iconPadding:children!=null&&children.trim()?'spacing.2':'spacing.0',textColor:getColorToken({variant:variant,color:color,element:'text',currentInteraction:currentInteraction,isDisabled:isDisabled,isVisited:isVisited}),focusRingColor:getIn(theme.colors,'brand.primary.400'),motionDuration:'duration.2xquick',motionEasing:'easing.standard.effective',cursor:isButton&&isDisabled?'not-allowed':'pointer',disabled:isButton&&isDisabled,role:isButton?'button':'link',defaultRel:target&&target==='_blank'?'noreferrer noopener':undefined,type:isButton?'button':undefined};return props;};var _BaseLink=function _BaseLink(_ref3,ref){var children=_ref3.children,Icon=_ref3.icon,_ref3$iconPosition=_ref3.iconPosition,iconPosition=_ref3$iconPosition===void 0?'left':_ref3$iconPosition,_ref3$isDisabled=_ref3.isDisabled,isDisabled=_ref3$isDisabled===void 0?false:_ref3$isDisabled,onClick=_ref3.onClick,onKeyDown=_ref3.onKeyDown,_ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'anchor':_ref3$variant,href=_ref3.href,target=_ref3.target,rel=_ref3.rel,_ref3$color=_ref3.color,color=_ref3$color===void 0?'default':_ref3$color,accessibilityProps=_ref3.accessibilityProps,className=_ref3.className,style=_ref3.style,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size,testID=_ref3.testID,hitSlop=_ref3.hitSlop,htmlTitle=_ref3.htmlTitle,_onBlur=_ref3.onBlur,_onFocus=_ref3.onFocus,_onMouseLeave=_ref3.onMouseLeave,onMouseMove=_ref3.onMouseMove,onPointerDown=_ref3.onPointerDown,onPointerEnter=_ref3.onPointerEnter,onTouchStart=_ref3.onTouchStart,onTouchEnd=_ref3.onTouchEnd,styledProps=_objectWithoutProperties(_ref3,_excluded$D);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isVisited=_useState2[0],setIsVisited=_useState2[1];var childrenString=getStringFromReactText(children);var _useInteraction=useInteraction(),currentInteraction=_useInteraction.currentInteraction,setCurrentInteraction=_useInteraction.setCurrentInteraction,syntheticEvents=_objectWithoutProperties(_useInteraction,_excluded2$1);var _useTheme=useTheme(),theme=_useTheme.theme;if(__DEV__){if(!Icon&&!(childrenString!=null&&childrenString.trim())){throwBladeError({message:`At least one of icon or text is required to render a link.`,moduleName:'BaseLink'});}}var _getProps=getProps({theme:theme,variant:variant,currentInteraction:currentInteraction,children:childrenString,isDisabled:isDisabled,color:color,isVisited:isVisited,target:target,size:size}),as=_getProps.as,textDecorationLine=_getProps.textDecorationLine,iconColor=_getProps.iconColor,iconPadding=_getProps.iconPadding,iconSize=_getProps.iconSize,fontSize=_getProps.fontSize,textColor=_getProps.textColor,focusRingColor=_getProps.focusRingColor,motionDuration=_getProps.motionDuration,motionEasing=_getProps.motionEasing,cursor=_getProps.cursor,disabled=_getProps.disabled,role=_getProps.role,defaultRel=_getProps.defaultRel,type=_getProps.type,lineHeight=_getProps.lineHeight;var handleOnClick=function handleOnClick(event){if(!isVisited&&variant==='anchor'){setIsVisited(true);}if(onClick){onClick(event);}};var asProp=isReactNative$4()?undefined:'span';return jsx(StyledLink,Object.assign({ref:ref},metaAttribute({name:MetaConstants.Link,testID:testID}),{accessibilityProps:Object.assign({},makeAccessible(Object.assign({role:role,disabled:disabled},accessibilityProps))),variant:variant,as:as,href:href,target:target,rel:rel!=null?rel:defaultRel,onClick:handleOnClick},syntheticEvents,{onBlur:function onBlur(event){_onBlur==null?void 0:_onBlur(event);syntheticEvents.onBlur();},onFocus:function onFocus(event){_onFocus==null?void 0:_onFocus(event);syntheticEvents.onFocus();},onMouseLeave:function onMouseLeave(event){if(_onMouseLeave){_onMouseLeave(event);}syntheticEvents.onMouseLeave();},onMouseMove:onMouseMove,onPointerDown:onPointerDown,onPointerEnter:onPointerEnter,onTouchStart:onTouchStart,onTouchEnd:onTouchEnd,onKeyDown:onKeyDown,disabled:disabled,type:type,cursor:cursor,focusRingColor:focusRingColor,motionDuration:motionDuration,motionEasing:motionEasing,setCurrentInteraction:setCurrentInteraction},getStyledProps(styledProps),{className:className,style:style,hitSlop:hitSlop,title:htmlTitle,children:jsxs(BaseBox,{as:asProp,display:"flex",flexDirection:"row",className:"content-container",alignItems:"center",children:[Icon&&iconPosition=='left'?jsx(BaseBox,{as:asProp,paddingRight:iconPadding,display:"flex",alignItems:"center",children:jsx(Icon,{color:iconColor,size:iconSize})}):null,jsx(BaseText,{as:asProp,textDecorationLine:textDecorationLine,color:textColor,fontSize:fontSize,lineHeight:lineHeight,textAlign:"center",fontWeight:"bold",children:children}),Icon&&iconPosition=='right'?jsx(BaseBox,{as:asProp,paddingLeft:iconPadding,display:"flex",alignItems:"center",children:jsx(Icon,{color:iconColor,size:iconSize})}):null]})}));};var BaseLink=assignWithoutSideEffects(React__default.forwardRef(_BaseLink),{displayName:'BaseLink',componentId:'BaseLink'});
|
|
2732
2732
|
|
|
2733
|
-
var _excluded$C=["description","title","isDismissible","onDismiss","contrast","isFullWidth","intent","color","actions","testID"];var isReactNative$3=getPlatformType()==='react-native';var CloseButtonWrapper=isReactNative$3?BaseBox:Fragment$1;var intentIconMap={positive:CheckCircleIcon,negative:AlertTriangleIcon,information:InfoIcon,neutral:InfoIcon,notice:AlertTriangleIcon$1};var Alert=function Alert(_ref){var description=_ref.description,title=_ref.title,_ref$isDismissible=_ref.isDismissible,isDismissible=_ref$isDismissible===void 0?true:_ref$isDismissible,onDismiss=_ref.onDismiss,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,_ref$isFullWidth=_ref.isFullWidth,isFullWidth=_ref$isFullWidth===void 0?false:_ref$isFullWidth,_ref$intent=_ref.intent,intent=_ref$intent===void 0?'neutral':_ref$intent,color=_ref.color,actions=_ref.actions,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$C);if(__DEV__){if(!(actions!=null&&actions.primary)&&actions!=null&&actions.secondary){throwBladeError({message:'SecondaryAction is allowed only when PrimaryAction is defined.',moduleName:'Alert'});}}var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var isDesktop=matchedDeviceType==='desktop';var isMobile=!isDesktop;var _useState=useState(true),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var contrastType=`${contrast}Contrast`;var iconSize=isFullWidth?'large':'medium';var textSize=isFullWidth?'medium':'small';var Icon=intentIconMap[
|
|
2733
|
+
var _excluded$C=["description","title","isDismissible","onDismiss","contrast","isFullWidth","intent","color","actions","testID"];var isReactNative$3=getPlatformType()==='react-native';var CloseButtonWrapper=isReactNative$3?BaseBox:Fragment$1;var intentIconMap={positive:CheckCircleIcon,negative:AlertTriangleIcon,information:InfoIcon,neutral:InfoIcon,notice:AlertTriangleIcon$1};var Alert=function Alert(_ref){var description=_ref.description,title=_ref.title,_ref$isDismissible=_ref.isDismissible,isDismissible=_ref$isDismissible===void 0?true:_ref$isDismissible,onDismiss=_ref.onDismiss,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,_ref$isFullWidth=_ref.isFullWidth,isFullWidth=_ref$isFullWidth===void 0?false:_ref$isFullWidth,_ref$intent=_ref.intent,intent=_ref$intent===void 0?'neutral':_ref$intent,color=_ref.color,actions=_ref.actions,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$C);if(__DEV__){if(!(actions!=null&&actions.primary)&&actions!=null&&actions.secondary){throwBladeError({message:'SecondaryAction is allowed only when PrimaryAction is defined.',moduleName:'Alert'});}}var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var isDesktop=matchedDeviceType==='desktop';var isMobile=!isDesktop;var _useState=useState(true),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var contrastType=`${contrast}Contrast`;var iconSize=isFullWidth?'large':'medium';var textSize=isFullWidth?'medium':'small';var alertColor=color!=null?color:intent;var Icon=intentIconMap[alertColor];var iconOffset='spacing.1';if(isReactNative$3){if(isFullWidth&&!title){iconOffset='spacing.1';}else if(!isFullWidth&&!title){iconOffset='spacing.0';}else if(!isFullWidth&&title){iconOffset='spacing.2';}}else if(isMobile){if(!isFullWidth&&title){iconOffset='spacing.2';}else if(isFullWidth&&!title){iconOffset='spacing.2';}}else if(isFullWidth){iconOffset='spacing.0';}var icon=jsx(BaseBox,{marginTop:iconOffset,display:"flex",children:jsx(Icon,{color:`feedback.icon.${alertColor}.${contrastType}`,size:iconSize})});var _title=title?jsx(BaseBox,{marginBottom:"spacing.2",children:isFullWidth?jsx(Heading,{type:"subtle",size:"small",contrast:contrast,children:title}):jsx(Text,{type:"subtle",weight:"bold",contrast:contrast,children:title})}):null;var _description=jsx(BaseBox,{marginTop:title||isReactNative$3?'spacing.0':'spacing.1',children:jsx(Text,{type:"subtle",size:textSize,contrast:contrast,children:description})});var primaryAction=actions!=null&&actions.primary?jsx(BaseBox,{marginRight:"spacing.5",display:isReactNative$3?castNativeType('flex'):castWebType('inline-flex'),children:jsx(BaseButton,{size:textSize,onClick:actions.primary.onClick,color:alertColor,variant:contrast==='high'?'primary':'secondary',children:actions.primary.text})}):null;var secondaryActionParams=actions!=null&&actions.secondary?{onClick:actions.secondary.onClick}:null;if(actions!=null&&actions.secondary&&secondaryActionParams&&'href'in actions.secondary){secondaryActionParams.href=actions.secondary.href;secondaryActionParams.target=actions.secondary.target;secondaryActionParams.rel=actions.secondary.rel;}var secondaryAction=actions!=null&&actions.secondary?jsx(BaseBox,{marginRight:"spacing.4",display:isReactNative$3?castNativeType('flex'):castWebType('inline-flex'),children:jsx(BaseLink,Object.assign({size:textSize,color:contrast==='high'?'white':alertColor},secondaryActionParams,{children:actions.secondary.text}))}):null;var showActionsHorizontal=isFullWidth&&isDesktop;var actionsHorizontal=showActionsHorizontal&&(primaryAction||secondaryAction)?jsxs(BaseBox,{flexDirection:"row",alignItems:"center",children:[primaryAction,secondaryAction]}):null;var actionsVertical=!showActionsHorizontal&&(primaryAction||secondaryAction)?jsxs(BaseBox,{marginTop:"spacing.4",flexDirection:"row",alignItems:"center",children:[primaryAction,secondaryAction]}):null;var onClickDismiss=function onClickDismiss(){if(onDismiss){onDismiss();}setIsVisible(false);};var closeButton=isDismissible?jsx(CloseButtonWrapper,{children:jsx(IconButton,{accessibilityLabel:"Dismiss alert",onClick:onClickDismiss,contrast:contrast,size:iconSize,icon:CloseIcon})}):null;var a11yProps=makeAccessible(Object.assign({role:isReactNative$3||alertColor==='negative'||alertColor==='notice'?'alert':'status'},alertColor==='notice'&&{liveRegion:'polite'}));if(!isVisible){return null;}return jsx(BaseBox,Object.assign({},a11yProps,metaAttribute({name:MetaConstants.Alert,testID:testID}),getStyledProps(styledProps),{children:jsxs(StyledAlert,{color:alertColor,contrastType:contrastType,isFullWidth:isFullWidth,isDesktop:isDesktop,textAlign:'left',children:[icon,jsxs(BaseBox,{flex:1,paddingLeft:isFullWidth?'spacing.4':'spacing.3',paddingRight:showActionsHorizontal?'spacing.4':'spacing.2',children:[_title,_description,actionsVertical]}),actionsHorizontal,closeButton]})}));};
|
|
2734
2734
|
|
|
2735
2735
|
var _excluded$B=["children","surfaceLevel","elevation","onTouchEnd","onTouchStart","onPointerDown","onPointerEnter","pointerEvents"];var CardSurfaceStyled=styled(BaseBox)(function(_ref){var surfaceLevel=_ref.surfaceLevel,elevation=_ref.elevation,theme=_ref.theme;var backgroundColor=theme.colors.surface.background[`level${surfaceLevel}`].lowContrast;return {width:'100%',display:'flex',flexDirection:'column',borderWidth:elevation==='none'?`${theme.border.width.thin}`:undefined,borderStyle:elevation==='none'?'solid':undefined,borderColor:elevation==='none'?`${theme.colors.surface.border.normal.lowContrast}`:undefined,backgroundColor:backgroundColor};});var CardSurface=function CardSurface(_ref2){var children=_ref2.children,surfaceLevel=_ref2.surfaceLevel,elevation=_ref2.elevation,onTouchEnd=_ref2.onTouchEnd,onTouchStart=_ref2.onTouchStart,onPointerDown=_ref2.onPointerDown,onPointerEnter=_ref2.onPointerEnter,pointerEvents=_ref2.pointerEvents,props=_objectWithoutProperties(_ref2,_excluded$B);return jsx(CardSurfaceStyled,Object.assign({},props,{surfaceLevel:surfaceLevel,elevation:elevation,onPointerEnter:castNativeType(onPointerEnter),onPointerDown:castNativeType(onPointerDown),onTouchStart:castNativeType(onTouchStart),onTouchEnd:castNativeType(onTouchEnd),pointerEvents:castNativeType(pointerEvents),children:children}));};
|
|
2736
2736
|
|
|
@@ -2830,7 +2830,7 @@ var getTextStyles=function getTextStyles(_ref){var variant=_ref.variant,type=_re
|
|
|
2830
2830
|
|
|
2831
2831
|
var getInputBackgroundAndBorderStyles=function getInputBackgroundAndBorderStyles(_ref){var theme=_ref.theme,isHovered=_ref.isHovered,isFocused=_ref.isFocused,isDisabled=_ref.isDisabled,validationState=_ref.validationState,isTextArea=_ref.isTextArea,isDropdownTrigger=_ref.isDropdownTrigger;var backgroundColor=theme.colors.brand.gray.a50.lowContrast;var borderBottomColor=theme.colors.brand.gray.a100.lowContrast;if(isHovered){backgroundColor=theme.colors.brand.gray.a100.lowContrast;}if(isFocused){backgroundColor=theme.colors.brand.primary[300];}if(isDisabled){backgroundColor=theme.colors.brand.gray.a50.lowContrast;borderBottomColor=theme.colors.brand.gray[300].lowContrast;}if(validationState==='error'){backgroundColor=theme.colors.feedback.background.negative.lowContrast;borderBottomColor=theme.colors.feedback.border.negative.highContrast;}else if(validationState==='success'){backgroundColor=theme.colors.feedback.background.positive.lowContrast;borderBottomColor=theme.colors.feedback.border.positive.highContrast;}return {backgroundColor:backgroundColor,borderBottomColor:borderBottomColor,borderTopLeftRadius:makeBorderSize(theme.border.radius.small),borderTopRightRadius:makeBorderSize(theme.border.radius.small),borderBottomWidth:makeBorderSize(theme.border.width.thin),borderBottomStyle:'solid',display:'flex',flexDirection:'row',width:'100%',alignItems:isTextArea?'flex-start':undefined,position:'relative',height:isDropdownTrigger?'auto':undefined};};var getLeftPadding=function getLeftPadding(_ref2){var theme=_ref2.theme,isDropdownTrigger=_ref2.isDropdownTrigger,hasLeadingIcon=_ref2.hasLeadingIcon,hasPrefix=_ref2.hasPrefix;if(isDropdownTrigger){return theme.spacing[0];}if(hasLeadingIcon||hasPrefix){return theme.spacing[3];}return theme.spacing[4];};var getBaseInputStyles=function getBaseInputStyles(_ref3){var theme=_ref3.theme,isDisabled=_ref3.isDisabled,leadingIcon=_ref3.leadingIcon,prefix=_ref3.prefix,interactionElement=_ref3.interactionElement,suffix=_ref3.suffix,trailingIcon=_ref3.trailingIcon,textAlign=_ref3.textAlign,isTextArea=_ref3.isTextArea,hasTags=_ref3.hasTags,isDropdownTrigger=_ref3.isDropdownTrigger;var _getInputVisualsToBeR=getInputVisualsToBeRendered({leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon}),hasLeadingIcon=_getInputVisualsToBeR.hasLeadingIcon,hasPrefix=_getInputVisualsToBeR.hasPrefix,hasInteractionElement=_getInputVisualsToBeR.hasInteractionElement,hasSuffix=_getInputVisualsToBeR.hasSuffix,hasTrailingIcon=_getInputVisualsToBeR.hasTrailingIcon;var isDropdownWithTags=isDropdownTrigger&&hasTags;var isReactNative=getPlatformType()==='react-native';return Object.assign({},getTextStyles({size:'medium',variant:'body',type:isDisabled?'placeholder':'subtle',weight:'regular',contrast:'low',theme:theme}),{flex:1,backgroundColor:'transparent',paddingTop:makeSpace(theme.spacing[3]),paddingBottom:makeSpace(theme.spacing[3]),paddingLeft:makeSpace(getLeftPadding({theme:theme,isDropdownTrigger:isDropdownTrigger,hasLeadingIcon:hasLeadingIcon,hasPrefix:hasPrefix})),paddingRight:hasInteractionElement||hasSuffix||hasTrailingIcon?makeSpace(theme.spacing[3]):makeSpace(theme.spacing[4]),textAlign:textAlign,width:'100%',height:isTextArea||isDropdownWithTags?undefined:makeSpace(BASEINPUT_DEFAULT_HEIGHT),minHeight:isDropdownWithTags?undefined:makeSpace(BASEINPUT_DEFAULT_HEIGHT)},isReactNative?{}:{resize:'none'});};
|
|
2832
2832
|
|
|
2833
|
-
var _excluded$o=["name","isRequired","isDisabled","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnSubmit","handleOnInput","handleOnKeyDown","handleOnClick","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","numberOfLines","isTextArea","hasPopup","shouldIgnoreBlurAnimation","autoCapitalize","as"];var autoCompleteSuggestionTypeAndroid={none:'off',name:'name',email:'email',username:'username',password:'password',newPassword:'password-new',oneTimeCode:'sms-otp',telephone:'tel',postalCode:'postal-code',countryName:'postal-address-country',creditCardNumber:'cc-number',creditCardCSC:'cc-csc',creditCardExpiry:'cc-exp',creditCardExpiryMonth:'cc-exp-month',creditCardExpiryYear:'cc-exp-year'};var autoCompleteSuggestionTypeIOS={none:'none',name:'name',email:'emailAddress',username:'username',password:'password',newPassword:'newPassword',oneTimeCode:'oneTimeCode',telephone:'telephoneNumber',postalCode:'postalCode',countryName:'countryName',creditCardNumber:'creditCardNumber',creditCardCSC:'none',creditCardExpiry:'none',creditCardExpiryMonth:'none',creditCardExpiryYear:'none'};var KeyboardTypeToNativeValuesMap={text:'default',search:'default',telephone:'phone-pad',email:'email-address',url:'url',decimal:'decimal-pad'};var getInputHeight=function getInputHeight(_ref){var isTextArea=_ref.isTextArea,hasTags=_ref.hasTags,numberOfLines=_ref.numberOfLines,lineHeight=_ref.lineHeight;if(isTextArea){return `${lineHeight*(numberOfLines!=null?numberOfLines:0)}px`;}if(hasTags){return undefined;}return makeSize(size[36]);};var getRNInputStyles=function getRNInputStyles(props){return Object.assign({},getBaseInputStyles({theme:props.theme,isFocused:props.isFocused,isDisabled:!props.editable,validationState:props.validationState,leadingIcon:props.leadingIcon,prefix:props.prefix,interactionElement:props.interactionElement,suffix:props.suffix,trailingIcon:props.trailingIcon,isTextArea:props.isTextArea,hasTags:props.hasTags,isDropdownTrigger:props.isDropdownTrigger}),{lineHeight:undefined,textAlignVertical:'top',height:getInputHeight({isTextArea:props.isTextArea,hasTags:props.hasTags,numberOfLines:props.numberOfLines,lineHeight:props.theme.typography.lineHeights[300]})});};var StyledNativeBaseInput=styled.TextInput(function(_ref2){var id=_ref2.id,isFocused=_ref2.isFocused,theme=_ref2.theme,editable=_ref2.editable,validationState=_ref2.validationState,leadingIcon=_ref2.leadingIcon,prefix=_ref2.prefix,interactionElement=_ref2.interactionElement,suffix=_ref2.suffix,trailingIcon=_ref2.trailingIcon,isTextArea=_ref2.isTextArea,numberOfLines=_ref2.numberOfLines,isDropdownTrigger=_ref2.isDropdownTrigger,hasTags=_ref2.hasTags;return getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,hasTags:hasTags,isDropdownTrigger:isDropdownTrigger});});var StyledNativeBaseButton=styled.TouchableOpacity(function(_ref3){var id=_ref3.id,isFocused=_ref3.isFocused,theme=_ref3.theme,editable=_ref3.editable,validationState=_ref3.validationState,leadingIcon=_ref3.leadingIcon,prefix=_ref3.prefix,interactionElement=_ref3.interactionElement,suffix=_ref3.suffix,trailingIcon=_ref3.trailingIcon,isTextArea=_ref3.isTextArea,numberOfLines=_ref3.numberOfLines,isDropdownTrigger=_ref3.isDropdownTrigger,hasTags=_ref3.hasTags;return getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,isDropdownTrigger:isDropdownTrigger,hasTags:hasTags});});var _StyledBaseInput=function _StyledBaseInput(_ref4,ref){var name=_ref4.name;_ref4.isRequired;var isDisabled=_ref4.isDisabled,maxCharacters=_ref4.maxCharacters,handleOnFocus=_ref4.handleOnFocus,handleOnChange=_ref4.handleOnChange,handleOnBlur=_ref4.handleOnBlur,handleOnSubmit=_ref4.handleOnSubmit,handleOnInput=_ref4.handleOnInput,handleOnKeyDown=_ref4.handleOnKeyDown,handleOnClick=_ref4.handleOnClick,_ref4$keyboardType=_ref4.keyboardType,keyboardType=_ref4$keyboardType===void 0?'text':_ref4$keyboardType,keyboardReturnKeyType=_ref4.keyboardReturnKeyType,autoCompleteSuggestionType=_ref4.autoCompleteSuggestionType,accessibilityProps=_ref4.accessibilityProps,currentInteraction=_ref4.currentInteraction,setCurrentInteraction=_ref4.setCurrentInteraction,type=_ref4.type,numberOfLines=_ref4.numberOfLines,isTextArea=_ref4.isTextArea;_ref4.hasPopup;var shouldIgnoreBlurAnimation=_ref4.shouldIgnoreBlurAnimation,autoCapitalize=_ref4.autoCapitalize,renderAs=_ref4.as,props=_objectWithoutProperties(_ref4,_excluded$o);var buttonValue=props.value?props.value:props.placeholder;var commonProps={onBlur:function onBlur(){if(!shouldIgnoreBlurAnimation){setCurrentInteraction('default');}},isFocused:currentInteraction==='active'};return renderAs==='button'?jsx(StyledNativeBaseButton,Object.assign({ref:ref,onPress:function onPress(){handleOnClick==null?void 0:handleOnClick({name:name,value:props.value});},onFocus:function onFocus(){handleOnFocus==null?void 0:handleOnFocus({name:name,value:props.value});setCurrentInteraction('active');},as:undefined},commonProps,props,accessibilityProps,{children:jsx(Text,{type:props.value?'subtle':'placeholder',truncateAfterLines:1,textAlign:props.textAlign,children:buttonValue})})):jsx(StyledNativeBaseInput,Object.assign({ref:ref,multiline:isTextArea,numberOfLines:numberOfLines,editable:!isDisabled,maxLength:maxCharacters,onFocus:function onFocus(event){handleOnFocus==null?void 0:handleOnFocus({name:name,value:event==null?void 0:event.nativeEvent.text});setCurrentInteraction('active');},onChangeText:function onChangeText(text){handleOnChange==null?void 0:handleOnChange({name:name,value:text});handleOnInput==null?void 0:handleOnInput({name:name,value:text});},onEndEditing:function onEndEditing(event){return handleOnBlur==null?void 0:handleOnBlur({name:name,value:event==null?void 0:event.nativeEvent.text});},onSubmitEditing:function onSubmitEditing(event){return handleOnSubmit==null?void 0:handleOnSubmit({name:name,value:event==null?void 0:event.nativeEvent.text});},onKeyPress:function onKeyPress(event){handleOnKeyDown==null?void 0:handleOnKeyDown({name:name,key:event==null?void 0:event.nativeEvent.key,event:event});},keyboardType:KeyboardTypeToNativeValuesMap[keyboardType],returnKeyType:keyboardReturnKeyType,autoCompleteType:autoCompleteSuggestionType?autoCompleteSuggestionTypeAndroid[autoCompleteSuggestionType]:undefined,secureTextEntry:type==='password',isTextArea:isTextArea,textContentType:autoCompleteSuggestionType?autoCompleteSuggestionTypeIOS[autoCompleteSuggestionType]:undefined,autoCapitalize:autoCapitalize},commonProps,props,accessibilityProps));};var StyledBaseInput=assignWithoutSideEffects(React__default.forwardRef(_StyledBaseInput),{displayName:'StyledBaseInput'});
|
|
2833
|
+
var _excluded$o=["name","isRequired","isDisabled","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnSubmit","handleOnInput","handleOnKeyDown","handleOnClick","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","numberOfLines","isTextArea","hasPopup","shouldIgnoreBlurAnimation","autoCapitalize","as"];var autoCompleteSuggestionTypeAndroid={none:'off',name:'name',email:'email',username:'username',password:'password',newPassword:'password-new',oneTimeCode:'sms-otp',telephone:'tel',postalCode:'postal-code',countryName:'postal-address-country',creditCardNumber:'cc-number',creditCardCSC:'cc-csc',creditCardExpiry:'cc-exp',creditCardExpiryMonth:'cc-exp-month',creditCardExpiryYear:'cc-exp-year'};var autoCompleteSuggestionTypeIOS={none:'none',name:'name',email:'emailAddress',username:'username',password:'password',newPassword:'newPassword',oneTimeCode:'oneTimeCode',telephone:'telephoneNumber',postalCode:'postalCode',countryName:'countryName',creditCardNumber:'creditCardNumber',creditCardCSC:'none',creditCardExpiry:'none',creditCardExpiryMonth:'none',creditCardExpiryYear:'none'};var KeyboardTypeToNativeValuesMap={text:'default',search:'default',telephone:'phone-pad',email:'email-address',url:'url',decimal:'decimal-pad'};var getInputHeight=function getInputHeight(_ref){var isTextArea=_ref.isTextArea,hasTags=_ref.hasTags,numberOfLines=_ref.numberOfLines,lineHeight=_ref.lineHeight;if(isTextArea){return `${lineHeight*(numberOfLines!=null?numberOfLines:0)}px`;}if(hasTags){return undefined;}return makeSize(size[36]);};var getRNInputStyles=function getRNInputStyles(props){return Object.assign({},getBaseInputStyles({theme:props.theme,isFocused:props.isFocused,isDisabled:!props.editable,validationState:props.validationState,leadingIcon:props.leadingIcon,prefix:props.prefix,interactionElement:props.interactionElement,suffix:props.suffix,trailingIcon:props.trailingIcon,isTextArea:props.isTextArea,hasTags:props.hasTags,isDropdownTrigger:props.isDropdownTrigger}),{lineHeight:undefined,textAlignVertical:'top',height:getInputHeight({isTextArea:props.isTextArea,hasTags:props.hasTags,numberOfLines:props.numberOfLines,lineHeight:props.theme.typography.lineHeights[300]})});};var StyledNativeBaseInput=styled.TextInput(function(_ref2){var id=_ref2.id,isFocused=_ref2.isFocused,theme=_ref2.theme,editable=_ref2.editable,validationState=_ref2.validationState,leadingIcon=_ref2.leadingIcon,prefix=_ref2.prefix,interactionElement=_ref2.interactionElement,suffix=_ref2.suffix,trailingIcon=_ref2.trailingIcon,isTextArea=_ref2.isTextArea,numberOfLines=_ref2.numberOfLines,isDropdownTrigger=_ref2.isDropdownTrigger,hasTags=_ref2.hasTags;return getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,hasTags:hasTags,isDropdownTrigger:isDropdownTrigger});});var StyledNativeBaseButton=styled.TouchableOpacity(function(_ref3){var id=_ref3.id,isFocused=_ref3.isFocused,theme=_ref3.theme,editable=_ref3.editable,validationState=_ref3.validationState,leadingIcon=_ref3.leadingIcon,prefix=_ref3.prefix,interactionElement=_ref3.interactionElement,suffix=_ref3.suffix,trailingIcon=_ref3.trailingIcon,isTextArea=_ref3.isTextArea,numberOfLines=_ref3.numberOfLines,isDropdownTrigger=_ref3.isDropdownTrigger,hasTags=_ref3.hasTags;return getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,isDropdownTrigger:isDropdownTrigger,hasTags:hasTags});});var _StyledBaseInput=function _StyledBaseInput(_ref4,ref){var name=_ref4.name;_ref4.isRequired;var isDisabled=_ref4.isDisabled,maxCharacters=_ref4.maxCharacters,handleOnFocus=_ref4.handleOnFocus,handleOnChange=_ref4.handleOnChange,handleOnBlur=_ref4.handleOnBlur,handleOnSubmit=_ref4.handleOnSubmit,handleOnInput=_ref4.handleOnInput,handleOnKeyDown=_ref4.handleOnKeyDown,handleOnClick=_ref4.handleOnClick,_ref4$keyboardType=_ref4.keyboardType,keyboardType=_ref4$keyboardType===void 0?'text':_ref4$keyboardType,keyboardReturnKeyType=_ref4.keyboardReturnKeyType,autoCompleteSuggestionType=_ref4.autoCompleteSuggestionType,accessibilityProps=_ref4.accessibilityProps,currentInteraction=_ref4.currentInteraction,setCurrentInteraction=_ref4.setCurrentInteraction,type=_ref4.type,numberOfLines=_ref4.numberOfLines,isTextArea=_ref4.isTextArea;_ref4.hasPopup;var shouldIgnoreBlurAnimation=_ref4.shouldIgnoreBlurAnimation,autoCapitalize=_ref4.autoCapitalize,renderAs=_ref4.as,props=_objectWithoutProperties(_ref4,_excluded$o);var buttonValue=props.value?props.value:props.placeholder;var commonProps={onBlur:function onBlur(){if(!shouldIgnoreBlurAnimation){setCurrentInteraction('default');}},isFocused:currentInteraction==='active'};return renderAs==='button'?jsx(StyledNativeBaseButton,Object.assign({ref:ref,onPress:function onPress(){handleOnClick==null?void 0:handleOnClick({name:name,value:props.value});},onFocus:function onFocus(){handleOnFocus==null?void 0:handleOnFocus({name:name,value:props.value});setCurrentInteraction('active');},as:undefined},commonProps,props,accessibilityProps,{children:jsx(Text,{type:props.value&&!isDisabled?'subtle':'placeholder',truncateAfterLines:1,textAlign:props.textAlign,children:buttonValue})})):jsx(StyledNativeBaseInput,Object.assign({ref:ref,multiline:isTextArea,numberOfLines:numberOfLines,editable:!isDisabled,maxLength:maxCharacters,onFocus:function onFocus(event){handleOnFocus==null?void 0:handleOnFocus({name:name,value:event==null?void 0:event.nativeEvent.text});setCurrentInteraction('active');},onChangeText:function onChangeText(text){handleOnChange==null?void 0:handleOnChange({name:name,value:text});handleOnInput==null?void 0:handleOnInput({name:name,value:text});},onEndEditing:function onEndEditing(event){return handleOnBlur==null?void 0:handleOnBlur({name:name,value:event==null?void 0:event.nativeEvent.text});},onSubmitEditing:function onSubmitEditing(event){return handleOnSubmit==null?void 0:handleOnSubmit({name:name,value:event==null?void 0:event.nativeEvent.text});},onKeyPress:function onKeyPress(event){handleOnKeyDown==null?void 0:handleOnKeyDown({name:name,key:event==null?void 0:event.nativeEvent.key,event:event});},keyboardType:KeyboardTypeToNativeValuesMap[keyboardType],returnKeyType:keyboardReturnKeyType,autoCompleteType:autoCompleteSuggestionType?autoCompleteSuggestionTypeAndroid[autoCompleteSuggestionType]:undefined,secureTextEntry:type==='password',isTextArea:isTextArea,textContentType:autoCompleteSuggestionType?autoCompleteSuggestionTypeIOS[autoCompleteSuggestionType]:undefined,autoCapitalize:autoCapitalize},commonProps,props,accessibilityProps));};var StyledBaseInput=assignWithoutSideEffects(React__default.forwardRef(_StyledBaseInput),{displayName:'StyledBaseInput'});
|
|
2834
2834
|
|
|
2835
2835
|
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 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(){return {width:`${interpolate(widthTrigger.value,[0,1],[0,100])}%`,opacity:interpolate(opacityTrigger.value,[0,1],[0,1])};});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});};
|
|
2836
2836
|
|
|
@@ -2838,9 +2838,9 @@ var _excluded$n=["showAllTags","setShowAllTagsWithAnimation","children","maxTagR
|
|
|
2838
2838
|
|
|
2839
2839
|
var _excluded$m=["children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea","showAllTags","setShowAllTagsWithAnimation","maxTagRows"];var _BaseInputWrapper=function _BaseInputWrapper(_ref,ref){var children=_ref.children,validationState=_ref.validationState,currentInteraction=_ref.currentInteraction;_ref.isLabelLeftPositioned;var isTextArea=_ref.isTextArea,showAllTags=_ref.showAllTags,setShowAllTagsWithAnimation=_ref.setShowAllTagsWithAnimation,maxTagRows=_ref.maxTagRows,props=_objectWithoutProperties(_ref,_excluded$m);return jsxs(AnimatedBaseInputWrapper,Object.assign({ref:ref,isTextArea:isTextArea,validationState:validationState,currentInteraction:currentInteraction,showAllTags:showAllTags,maxTagRows:maxTagRows,setShowAllTagsWithAnimation:setShowAllTagsWithAnimation},props,{children:[children,jsx(BaseInputAnimatedBorder,{currentInteraction:currentInteraction,validationState:validationState})]}));};var BaseInputWrapper=React__default.forwardRef(_BaseInputWrapper);
|
|
2840
2840
|
|
|
2841
|
-
var ScrollableTagSlotContainer=function ScrollableTagSlotContainer(_ref){var maxTagRows=_ref.maxTagRows,children=_ref.children,handleOnInputClick=_ref.handleOnInputClick;var scrollViewRef=React__default.useRef(null);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isScrolling=_React$useState2[0],setIsScrolling=_React$useState2[1];return jsxs(ScrollView,{ref:scrollViewRef,contentContainerStyle:{flexWrap:maxTagRows==='single'?'nowrap':'wrap',position:'relative',flexDirection:'row',flexGrow:1},onScrollBeginDrag:function onScrollBeginDrag(){setIsScrolling(true);},onScrollEndDrag:function onScrollEndDrag(){setIsScrolling(false);},horizontal:maxTagRows==='single',showsHorizontalScrollIndicator:maxTagRows==='single',onContentSizeChange:function onContentSizeChange(){var _scrollViewRef$curren;(_scrollViewRef$curren=scrollViewRef.current)==null?void 0:_scrollViewRef$curren.scrollToEnd({animated:true});},children:[jsx(TouchableWithoutFeedback,{onPress:function onPress(){if(!isScrolling){handleOnInputClick();}},children:jsx(BaseBox,{position:"absolute",height:"100%",width:"100%"})}),children]});};var ClickableText=function ClickableText(_ref2){var children=_ref2.children,handleOnInputClick=_ref2.handleOnInputClick;return jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{alignSelf:"center",marginRight:"spacing.4",children:jsx(Text,{children:children})})});};var PLUS_X_MORE_TEXT_WIDTH=60;var BaseInputTagSlot=function BaseInputTagSlot(_ref3){var tags=_ref3.tags,maxTagRows=_ref3.maxTagRows,showAllTags=_ref3.showAllTags,handleOnInputClick=_ref3.handleOnInputClick,renderAs=_ref3.renderAs,children=_ref3.children,isDropdownTrigger=_ref3.isDropdownTrigger,labelPrefix=_ref3.labelPrefix;var hasTags=tags&&tags.length>0;var initialVisibleTags=maxTagRows==='multiple'?6:1;var _React$useState3=React__default.useState(labelPrefix?0:initialVisibleTags),_React$useState4=_slicedToArray(_React$useState3,2),visibleTags=_React$useState4[0],setVisibleTags=_React$useState4[1];var invisibleTagsCount=tags||tags&&labelPrefix?tags.length-visibleTags:0;if(!isDropdownTrigger){return children;}return jsxs(BaseBox,{justifyContent:"flex-start",paddingY:"spacing.1",paddingX:"spacing.4",minHeight:makeSize(BASEINPUT_DEFAULT_HEIGHT),display:"flex",flexDirection:"row",position:"relative",flex:"1",onLayout:function onLayout(e){var _e$nativeEvent,_e$nativeEvent$layout;if(!hasTags)return;if(labelPrefix){setVisibleTags(0);return;}if(maxTagRows==='multiple'){return;}var containerWidth=(_e$nativeEvent=e.nativeEvent)==null?void 0:(_e$nativeEvent$layout=_e$nativeEvent.layout)==null?void 0:_e$nativeEvent$layout.width;if(!containerWidth){return;}var availableTagsSpace=containerWidth-PLUS_X_MORE_TEXT_WIDTH;var visibleTagsCount=Math.floor(availableTagsSpace/140);setVisibleTags(visibleTagsCount);},children:[jsxs(ScrollableTagSlotContainer,{maxTagRows:maxTagRows,showAllTags:showAllTags,handleOnInputClick:handleOnInputClick,children:[hasTags?jsxs(Fragment,{children:[showAllTags||maxTagRows==='multiple'?tags:tags.slice(0,visibleTags),invisibleTagsCount>0&&!showAllTags&&!labelPrefix&&maxTagRows!=='multiple'?jsxs(ClickableText,{handleOnInputClick:handleOnInputClick,children:["+ ",invisibleTagsCount," More"]}):null,!showAllTags&&invisibleTagsCount>0&&labelPrefix?jsxs(ClickableText,{handleOnInputClick:handleOnInputClick,children:[labelPrefix," (",invisibleTagsCount," Selected)"]}):null]}):null,jsx(BaseBox,{width:hasTags&&renderAs==='button'?makeSize(size['1']):'100%',children:children})]}),jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{flex:"1"})})]});};
|
|
2841
|
+
var ScrollableTagSlotContainer=function ScrollableTagSlotContainer(_ref){var maxTagRows=_ref.maxTagRows,children=_ref.children,handleOnInputClick=_ref.handleOnInputClick;var scrollViewRef=React__default.useRef(null);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isScrolling=_React$useState2[0],setIsScrolling=_React$useState2[1];return jsxs(ScrollView,{ref:scrollViewRef,contentContainerStyle:{flexWrap:maxTagRows==='single'?'nowrap':'wrap',position:'relative',flexDirection:'row',flexGrow:1},onScrollBeginDrag:function onScrollBeginDrag(){setIsScrolling(true);},onScrollEndDrag:function onScrollEndDrag(){setIsScrolling(false);},horizontal:maxTagRows==='single',showsHorizontalScrollIndicator:maxTagRows==='single',onContentSizeChange:function onContentSizeChange(){var _scrollViewRef$curren;(_scrollViewRef$curren=scrollViewRef.current)==null?void 0:_scrollViewRef$curren.scrollToEnd({animated:true});},children:[jsx(TouchableWithoutFeedback,{onPress:function onPress(){if(!isScrolling){handleOnInputClick();}},children:jsx(BaseBox,{position:"absolute",height:"100%",width:"100%"})}),children]});};var ClickableText=function ClickableText(_ref2){var children=_ref2.children,handleOnInputClick=_ref2.handleOnInputClick,isDisabled=_ref2.isDisabled;return jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{alignSelf:"center",marginRight:"spacing.4",children:jsx(Text,{type:isDisabled?'placeholder':'normal',children:children})})});};var PLUS_X_MORE_TEXT_WIDTH=60;var BaseInputTagSlot=function BaseInputTagSlot(_ref3){var tags=_ref3.tags,maxTagRows=_ref3.maxTagRows,showAllTags=_ref3.showAllTags,handleOnInputClick=_ref3.handleOnInputClick,renderAs=_ref3.renderAs,children=_ref3.children,isDropdownTrigger=_ref3.isDropdownTrigger,labelPrefix=_ref3.labelPrefix,isDisabled=_ref3.isDisabled;var hasTags=tags&&tags.length>0;var initialVisibleTags=maxTagRows==='multiple'?6:1;var _React$useState3=React__default.useState(labelPrefix?0:initialVisibleTags),_React$useState4=_slicedToArray(_React$useState3,2),visibleTags=_React$useState4[0],setVisibleTags=_React$useState4[1];var invisibleTagsCount=tags||tags&&labelPrefix?tags.length-visibleTags:0;if(!isDropdownTrigger){return children;}return jsxs(BaseBox,{justifyContent:"flex-start",paddingY:"spacing.1",paddingX:"spacing.4",minHeight:makeSize(BASEINPUT_DEFAULT_HEIGHT),display:"flex",flexDirection:"row",position:"relative",flex:"1",onLayout:function onLayout(e){var _e$nativeEvent,_e$nativeEvent$layout;if(!hasTags)return;if(labelPrefix){setVisibleTags(0);return;}if(maxTagRows==='multiple'){return;}var containerWidth=(_e$nativeEvent=e.nativeEvent)==null?void 0:(_e$nativeEvent$layout=_e$nativeEvent.layout)==null?void 0:_e$nativeEvent$layout.width;if(!containerWidth){return;}var availableTagsSpace=containerWidth-PLUS_X_MORE_TEXT_WIDTH;var visibleTagsCount=Math.floor(availableTagsSpace/140);setVisibleTags(visibleTagsCount);},children:[jsxs(ScrollableTagSlotContainer,{maxTagRows:maxTagRows,showAllTags:showAllTags,handleOnInputClick:handleOnInputClick,children:[hasTags?jsxs(Fragment,{children:[showAllTags||maxTagRows==='multiple'?tags:tags.slice(0,visibleTags),invisibleTagsCount>0&&!showAllTags&&!labelPrefix&&maxTagRows!=='multiple'?jsxs(ClickableText,{isDisabled:isDisabled,handleOnInputClick:handleOnInputClick,children:["+ ",invisibleTagsCount," More"]}):null,!showAllTags&&invisibleTagsCount>0&&labelPrefix?jsxs(ClickableText,{isDisabled:isDisabled,handleOnInputClick:handleOnInputClick,children:[labelPrefix," (",invisibleTagsCount," Selected)"]}):null]}):null,jsx(BaseBox,{width:hasTags&&renderAs==='button'?makeSize(size['1']):'100%',children:children})]}),jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{flex:"1"})})]});};
|
|
2842
2842
|
|
|
2843
|
-
var _excluded$l=["as","label","labelPosition","placeholder","type","defaultValue","tags","showAllTags","activeTagIndex","setActiveTagIndex","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","maxTagRows","shouldIgnoreBlurAnimation","setShouldIgnoreBlurAnimation","autoCapitalize","setInputWrapperRef","testID","isDropdownTrigger","isLabelInsideInput"];var autoCompleteSuggestionTypeValues=['none','on','name','email','username','password','newPassword','oneTimeCode','telephone','postalCode','countryName','creditCardNumber','creditCardCSC','creditCardExpiry','creditCardExpiryMonth','creditCardExpiryYear'];var useTags=function useTags(tags,activeTagIndex,setActiveTagIndex){var visibleTagsCountRef=React__default.useRef(0);React__default.useEffect(function(){if(tags&&activeTagIndex>=0&&activeTagIndex<tags.length){var _tags$activeTagIndex,_tags$activeTagIndex$;var tagTitle=(_tags$activeTagIndex=tags[activeTagIndex])==null?void 0:(_tags$activeTagIndex$=_tags$activeTagIndex.props)==null?void 0:_tags$activeTagIndex$.children;if(tagTitle){announce(`Close ${tagTitle} Tag`);}}},[activeTagIndex,tags==null?void 0:tags.length]);var onTagLeft=function onTagLeft(){if(activeTagIndex<0){setActiveTagIndex==null?void 0:setActiveTagIndex(visibleTagsCountRef.current-1);}if(activeTagIndex>0){setActiveTagIndex==null?void 0:setActiveTagIndex(activeTagIndex-1);}};var onTagRight=function onTagRight(){if(activeTagIndex<visibleTagsCountRef.current-1){setActiveTagIndex==null?void 0:setActiveTagIndex(activeTagIndex+1);}};var onTagRemove=function onTagRemove(){if(activeTagIndex>=0&&activeTagIndex<visibleTagsCountRef.current&&tags){tags[activeTagIndex].props.onDismiss({tagIndex:activeTagIndex});}};var onInputKeydownTagHandler=function onInputKeydownTagHandler(key){if(tags&&tags.length>0){if(key==='ArrowRight'){onTagRight();}if(key==='ArrowLeft'){onTagLeft();}if(key==='Backspace'){onTagRemove();}}};return {onInputKeydownTagHandler:onInputKeydownTagHandler,visibleTagsCountRef:visibleTagsCountRef};};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,onInputKeydownTagHandler=_ref.onInputKeydownTagHandler;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;onInputKeydownTagHandler(key);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,tags=_ref11.tags,_ref11$showAllTags=_ref11.showAllTags,showAllTags=_ref11$showAllTags===void 0?false:_ref11$showAllTags,_ref11$activeTagIndex=_ref11.activeTagIndex,activeTagIndex=_ref11$activeTagIndex===void 0?-1:_ref11$activeTagIndex,setActiveTagIndex=_ref11.setActiveTagIndex,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,maxTagRows=_ref11.maxTagRows,shouldIgnoreBlurAnimation=_ref11.shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation=_ref11.setShouldIgnoreBlurAnimation,autoCapitalize=_ref11.autoCapitalize,setInputWrapperRef=_ref11.setInputWrapperRef,testID=_ref11.testID,isDropdownTrigger=_ref11.isDropdownTrigger,isLabelInsideInput=_ref11.isLabelInsideInput,styledProps=_objectWithoutProperties(_ref11,_excluded$l);var _useTheme=useTheme(),theme=_useTheme.theme;var inputWrapperRef=React__default.useRef(null);var _useTags=useTags(tags,activeTagIndex,setActiveTagIndex),onInputKeydownTagHandler=_useTags.onInputKeydownTagHandler,visibleTagsCountRef=_useTags.visibleTagsCountRef;var _React$useState3=React__default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),showAllTagsWithAnimation=_React$useState4[0],setShowAllTagsWithAnimation=_React$useState4[1];var isReactNative=getPlatformType()==='react-native';React__default.useEffect(function(){if(showAllTags){setShowAllTagsWithAnimation(true);}},[showAllTags]);var _useInput=useInput({defaultValue:defaultValue,value:value,onFocus:onFocus,onClick:onClick,onChange:onChange,onBlur:onBlur,onSubmit:onSubmit,onInput:onInput,onKeyDown:onKeyDown,onInputKeydownTagHandler:onInputKeydownTagHandler}),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';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&&!isLabelInsideInput&&jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'column':'row',justifyContent:"space-between",alignSelf:isTextArea?'flex-start':undefined,marginY: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(value!=null?value:inputValue)]}),jsxs(BaseInputWrapper,{isDropdownTrigger:isDropdownTrigger,isTextArea:isTextArea,isDisabled:isDisabled,validationState:validationState,currentInteraction:currentInteraction,isLabelLeftPositioned:isLabelLeftPositioned,showAllTags:showAllTags,setShowAllTagsWithAnimation:setShowAllTagsWithAnimation,ref:function ref(refNode){if(refNode){setInputWrapperRef==null?void 0:setInputWrapperRef(refNode);inputWrapperRef.current=refNode;}},maxTagRows:maxTagRows,children:[jsx(BaseInputVisuals,{leadingIcon:leadingIcon,prefix:prefix,isDisabled:isDisabled}),jsx(BaseInputTagSlot,{renderAs:as,tags:tags,showAllTags:showAllTagsWithAnimation,setFocusOnInput:function setFocusOnInput(){if(ref&&!isReactNative&&'current'in ref){var _ref$current;(_ref$current=ref.current)==null?void 0:_ref$current.focus();}},labelPrefix:isLabelInsideInput?label:undefined,isDropdownTrigger:isDropdownTrigger,visibleTagsCountRef:visibleTagsCountRef,handleOnInputClick:function handleOnInputClick(e){handleOnClick({name:name,value:isReactNative?value:e});},setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,maxTagRows:maxTagRows,inputWrapperRef:inputWrapperRef,children:jsx(StyledBaseInput,Object.assign({as: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||maxTagRows==='multiple'||maxTagRows==='expandable',hasPopup:hasPopup,hasTags:!!(tags&&tags.length>0),shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,autoCapitalize:autoCapitalize,isDropdownTrigger:isDropdownTrigger},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(value!=null?value:inputValue)]})})]}));});
|
|
2843
|
+
var _excluded$l=["as","label","labelPosition","placeholder","type","defaultValue","tags","showAllTags","activeTagIndex","setActiveTagIndex","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","maxTagRows","shouldIgnoreBlurAnimation","setShouldIgnoreBlurAnimation","autoCapitalize","setInputWrapperRef","testID","isDropdownTrigger","isLabelInsideInput"];var autoCompleteSuggestionTypeValues=['none','on','name','email','username','password','newPassword','oneTimeCode','telephone','postalCode','countryName','creditCardNumber','creditCardCSC','creditCardExpiry','creditCardExpiryMonth','creditCardExpiryYear'];var useTags=function useTags(tags,activeTagIndex,setActiveTagIndex){var visibleTagsCountRef=React__default.useRef(0);React__default.useEffect(function(){if(tags&&activeTagIndex>=0&&activeTagIndex<tags.length){var _tags$activeTagIndex,_tags$activeTagIndex$;var tagTitle=(_tags$activeTagIndex=tags[activeTagIndex])==null?void 0:(_tags$activeTagIndex$=_tags$activeTagIndex.props)==null?void 0:_tags$activeTagIndex$.children;if(tagTitle){announce(`Close ${tagTitle} Tag`);}}},[activeTagIndex,tags==null?void 0:tags.length]);var onTagLeft=function onTagLeft(){if(activeTagIndex<0){setActiveTagIndex==null?void 0:setActiveTagIndex(visibleTagsCountRef.current-1);}if(activeTagIndex>0){setActiveTagIndex==null?void 0:setActiveTagIndex(activeTagIndex-1);}};var onTagRight=function onTagRight(){if(activeTagIndex<visibleTagsCountRef.current-1){setActiveTagIndex==null?void 0:setActiveTagIndex(activeTagIndex+1);}};var onTagRemove=function onTagRemove(){if(activeTagIndex>=0&&activeTagIndex<visibleTagsCountRef.current&&tags){tags[activeTagIndex].props.onDismiss({tagIndex:activeTagIndex});}};var onInputKeydownTagHandler=function onInputKeydownTagHandler(key){if(tags&&tags.length>0){if(key==='ArrowRight'){onTagRight();}if(key==='ArrowLeft'){onTagLeft();}if(key==='Backspace'){onTagRemove();}}};return {onInputKeydownTagHandler:onInputKeydownTagHandler,visibleTagsCountRef:visibleTagsCountRef};};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,onInputKeydownTagHandler=_ref.onInputKeydownTagHandler;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;onInputKeydownTagHandler(key);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,tags=_ref11.tags,_ref11$showAllTags=_ref11.showAllTags,showAllTags=_ref11$showAllTags===void 0?false:_ref11$showAllTags,_ref11$activeTagIndex=_ref11.activeTagIndex,activeTagIndex=_ref11$activeTagIndex===void 0?-1:_ref11$activeTagIndex,setActiveTagIndex=_ref11.setActiveTagIndex,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,maxTagRows=_ref11.maxTagRows,shouldIgnoreBlurAnimation=_ref11.shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation=_ref11.setShouldIgnoreBlurAnimation,autoCapitalize=_ref11.autoCapitalize,setInputWrapperRef=_ref11.setInputWrapperRef,testID=_ref11.testID,isDropdownTrigger=_ref11.isDropdownTrigger,isLabelInsideInput=_ref11.isLabelInsideInput,styledProps=_objectWithoutProperties(_ref11,_excluded$l);var _useTheme=useTheme(),theme=_useTheme.theme;var inputWrapperRef=React__default.useRef(null);var _useTags=useTags(tags,activeTagIndex,setActiveTagIndex),onInputKeydownTagHandler=_useTags.onInputKeydownTagHandler,visibleTagsCountRef=_useTags.visibleTagsCountRef;var _React$useState3=React__default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),showAllTagsWithAnimation=_React$useState4[0],setShowAllTagsWithAnimation=_React$useState4[1];var isReactNative=getPlatformType()==='react-native';React__default.useEffect(function(){if(showAllTags){setShowAllTagsWithAnimation(true);}},[showAllTags]);var _useInput=useInput({defaultValue:defaultValue,value:value,onFocus:onFocus,onClick:onClick,onChange:onChange,onBlur:onBlur,onSubmit:onSubmit,onInput:onInput,onKeyDown:onKeyDown,onInputKeydownTagHandler:onInputKeydownTagHandler}),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';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&&!isLabelInsideInput&&jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'column':'row',justifyContent:"space-between",alignSelf:isTextArea?'flex-start':undefined,marginY: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(value!=null?value:inputValue)]}),jsxs(BaseInputWrapper,{isDropdownTrigger:isDropdownTrigger,isTextArea:isTextArea,isDisabled:isDisabled,validationState:validationState,currentInteraction:currentInteraction,isLabelLeftPositioned:isLabelLeftPositioned,showAllTags:showAllTags,setShowAllTagsWithAnimation:setShowAllTagsWithAnimation,ref:function ref(refNode){if(refNode){setInputWrapperRef==null?void 0:setInputWrapperRef(refNode);inputWrapperRef.current=refNode;}},maxTagRows:maxTagRows,children:[jsx(BaseInputVisuals,{leadingIcon:leadingIcon,prefix:prefix,isDisabled:isDisabled}),jsx(BaseInputTagSlot,{renderAs:as,tags:tags,isDisabled:isDisabled,showAllTags:showAllTagsWithAnimation,setFocusOnInput:function setFocusOnInput(){if(ref&&!isReactNative&&'current'in ref){var _ref$current;(_ref$current=ref.current)==null?void 0:_ref$current.focus();}},labelPrefix:isLabelInsideInput?label:undefined,isDropdownTrigger:isDropdownTrigger,visibleTagsCountRef:visibleTagsCountRef,handleOnInputClick:function handleOnInputClick(e){handleOnClick({name:name,value:isReactNative?value:e});},setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,maxTagRows:maxTagRows,inputWrapperRef:inputWrapperRef,children:jsx(StyledBaseInput,Object.assign({as: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||maxTagRows==='multiple'||maxTagRows==='expandable',hasPopup:hasPopup,hasTags:!!(tags&&tags.length>0),shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,autoCapitalize:autoCapitalize,isDropdownTrigger:isDropdownTrigger},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(value!=null?value:inputValue)]})})]}));});
|
|
2844
2844
|
|
|
2845
2845
|
var CharacterCounter=function CharacterCounter(_ref){var currentCount=_ref.currentCount,maxCount=_ref.maxCount;return jsxs(Text,{variant:"caption",weight:"regular",type:"muted",children:[currentCount,"/",maxCount]});};
|
|
2846
2846
|
|
|
@@ -2856,23 +2856,25 @@ var _excluded$h=["label","accessibilityLabel","labelPosition","necessityIndicato
|
|
|
2856
2856
|
|
|
2857
2857
|
var _excluded$g=["autoFocus","errorText","helpText","isDisabled","keyboardReturnKeyType","keyboardType","label","accessibilityLabel","labelPosition","name","onChange","onFocus","onBlur","onOTPFilled","otpLength","placeholder","successText","validationState","value","isMasked","autoCompleteSuggestionType","testID"];var isReactNative=getPlatformType()==='react-native';var otpToArray=function otpToArray(code){var _code$split;return (_code$split=code==null?void 0:code.split(''))!=null?_code$split:Array(6).fill('');};var _OTPInput=function _OTPInput(_ref,incomingRef){var autoFocus=_ref.autoFocus,errorText=_ref.errorText,helpText=_ref.helpText,isDisabled=_ref.isDisabled,keyboardReturnKeyType=_ref.keyboardReturnKeyType,_ref$keyboardType=_ref.keyboardType,keyboardType=_ref$keyboardType===void 0?'decimal':_ref$keyboardType,label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,labelPosition=_ref.labelPosition,name=_ref.name,onChange=_ref.onChange,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onOTPFilled=_ref.onOTPFilled,_ref$otpLength=_ref.otpLength,otpLength=_ref$otpLength===void 0?6:_ref$otpLength,placeholder=_ref.placeholder,successText=_ref.successText,validationState=_ref.validationState,inputValue=_ref.value,isMasked=_ref.isMasked,_ref$autoCompleteSugg=_ref.autoCompleteSuggestionType,autoCompleteSuggestionType=_ref$autoCompleteSugg===void 0?'oneTimeCode':_ref$autoCompleteSugg,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$g);var inputRefs=[];var _useState=useState(otpToArray(inputValue)),_useState2=_slicedToArray(_useState,2),otpValue=_useState2[0],setOtpValue=_useState2[1];var _useState3=useState([]),_useState4=_slicedToArray(_useState3,2),inputType=_useState4[0],setInputType=_useState4[1];var isLabelLeftPositioned=labelPosition==='left';var _useFormId=useFormId('otp'),inputId=_useFormId.inputId,helpTextId=_useFormId.helpTextId,errorTextId=_useFormId.errorTextId,successTextId=_useFormId.successTextId;useImperativeHandle(incomingRef,function(){return inputRefs.map(function(ref){return ref.current;});},[inputRefs]);useEffect(function(){if(inputValue&&inputValue.length>=otpLength){onOTPFilled==null?void 0:onOTPFilled({value:inputValue.slice(0,otpLength),name:name});}else if(!inputValue&&otpValue.join('').length>=otpLength){onOTPFilled==null?void 0:onOTPFilled({value:otpValue.slice(0,otpLength).join(''),name:name});}},[otpValue,otpLength,name,inputValue,onOTPFilled]);useEffect(function(){otpValue.forEach(function(otp,index){if(!isEmpty$1(otp)&&!inputType[index]&&isMasked){var newInputType=Array.from(inputType);newInputType[index]='password';setInputType(newInputType);}if(isEmpty$1(otp)&&inputType[index]){var _newInputType=Array.from(inputType);_newInputType[index]=undefined;setInputType(_newInputType);}});},[otpValue,inputType,isMasked]);var setOtpValueByIndex=function setOtpValueByIndex(_ref2){var value=_ref2.value,index=_ref2.index;var newOtpValue=Array.from(otpValue);newOtpValue[index]=value;setOtpValue(newOtpValue);return newOtpValue.join('');};var focusOnOtpByIndex=function focusOnOtpByIndex(index){var _inputRefs$index,_inputRefs$index$curr;(_inputRefs$index=inputRefs[index])==null?void 0:(_inputRefs$index$curr=_inputRefs$index.current)==null?void 0:_inputRefs$index$curr.focus();if(!isReactNative){var _inputRefs$index2,_inputRefs$index2$cur;(_inputRefs$index2=inputRefs[index])==null?void 0:(_inputRefs$index2$cur=_inputRefs$index2.current)==null?void 0:_inputRefs$index2$cur.select();}};var handleOnChange=function handleOnChange(_ref3){var value=_ref3.value,currentOtpIndex=_ref3.currentOtpIndex;if(value&&value===' '){return;}if(inputValue&&inputValue.length>0){var newOtpValue=Array.from(inputValue);newOtpValue[currentOtpIndex]=value!=null?value:'';setOtpValue(newOtpValue);onChange==null?void 0:onChange({name:name,value:newOtpValue.join('')});}else if(value&&value.trim().length>1){setOtpValue(Array.from(value));onChange==null?void 0:onChange({name:name,value:value.trim().slice(0,otpLength)});}else if(otpValue[currentOtpIndex]!==(value==null?void 0:value.trim())){var _value$trim;var newValue=setOtpValueByIndex({value:(_value$trim=value==null?void 0:value.trim())!=null?_value$trim:'',index:currentOtpIndex});onChange==null?void 0:onChange({name:name,value:newValue});}};var handleOnInput=function handleOnInput(_ref4){var value=_ref4.value,currentOtpIndex=_ref4.currentOtpIndex;if(value&&value.trim().length===1){focusOnOtpByIndex(++currentOtpIndex);}};var handleOnKeyDown=function handleOnKeyDown(_ref5){var key=_ref5.key,code=_ref5.code,event=_ref5.event,currentOtpIndex=_ref5.currentOtpIndex;if(key==='Backspace'||code==='Backspace'||code==='Delete'||key==='Delete'){event.preventDefault==null?void 0:event.preventDefault();handleOnChange({value:'',currentOtpIndex:currentOtpIndex});focusOnOtpByIndex(--currentOtpIndex);}else if(key==='ArrowLeft'||code==='ArrowLeft'){event.preventDefault==null?void 0:event.preventDefault();focusOnOtpByIndex(--currentOtpIndex);}else if(key==='ArrowRight'||code==='ArrowRight'){event.preventDefault==null?void 0:event.preventDefault();focusOnOtpByIndex(++currentOtpIndex);}else if(key===' '||code==='Space'){event.preventDefault==null?void 0:event.preventDefault();}};var getHiddenInput=function getHiddenInput(){if(!isReactNative){var _ref6;return jsx("input",{hidden:true,id:inputId,name:name,value:(_ref6=inputValue!=null?inputValue:otpValue.join(''))!=null?_ref6:'',readOnly:true});}return null;};var getOTPInputFields=function getOTPInputFields(){var inputs=[];var _loop=function _loop(index){var _otpValue$index,_Array$from$index;var currentValue=inputValue?otpToArray(inputValue)[index]||'':otpValue[index]||'';var ref=React__default.createRef();var currentInputType=void 0;if(isMasked){currentInputType=inputValue?'password':inputType[index];}inputRefs.push(ref);inputs.push(jsx(BaseBox,{flex:1,marginLeft:index==0?'spacing.0':'spacing.3',children:jsx(BaseInput,{autoFocus:autoFocus&&index===0,accessibilityLabel:`${index===0?label||accessibilityLabel:''} character ${index+1}`,label:label,hideLabelText:true,id:`${inputId}-${index}`,textAlign:"center",ref:ref,name:name,value:currentValue,maxCharacters:((_otpValue$index=otpValue[index])==null?void 0:_otpValue$index.length)>0?1:undefined,onChange:function onChange(formEvent){return handleOnChange(Object.assign({},formEvent,{currentOtpIndex:index}));},onFocus:function onFocus(formEvent){return _onFocus==null?void 0:_onFocus(Object.assign({},formEvent,{inputIndex:index}));},onBlur:function onBlur(formEvent){return _onBlur==null?void 0:_onBlur(Object.assign({},formEvent,{inputIndex:index}));},onInput:function onInput(formEvent){return handleOnInput(Object.assign({},formEvent,{currentOtpIndex:index}));},onKeyDown:function onKeyDown(keyboardEvent){return handleOnKeyDown(Object.assign({},keyboardEvent,{currentOtpIndex:index}));},isDisabled:isDisabled,placeholder:(_Array$from$index=Array.from(placeholder!=null?placeholder:'')[index])!=null?_Array$from$index:'',isRequired:true,autoCompleteSuggestionType:autoCompleteSuggestionType,keyboardType:keyboardType,keyboardReturnKeyType:keyboardReturnKeyType,validationState:validationState,successText:successText,errorText:errorText,helpText:helpText,hideFormHint:true,type:currentInputType})},`${inputId}-${index}`));};for(var index=0;index<otpLength;index++){_loop(index);}return inputs;};return jsxs(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.OTPInput,testID:testID}),getStyledProps(styledProps),{children:[jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'row':'column',alignItems:isLabelLeftPositioned?'center':undefined,position:"relative",children:[Boolean(label)&&jsx(FormLabel,{as:"label",position:labelPosition,htmlFor:inputId,children:label}),jsxs(BaseBox,{display:"flex",flexDirection:"row",children:[getHiddenInput(),getOTPInputFields()]})]}),jsx(BaseBox,{marginLeft:makeSize(isLabelLeftPositioned?136:0),children:jsx(FormHint,{type:getHintType({validationState:validationState,hasHelpText:Boolean(helpText)}),helpText:helpText,errorText:errorText,successText:successText,helpTextId:helpTextId,errorTextId:errorTextId,successTextId:successTextId})})]}));};var OTPInput=React__default.forwardRef(_OTPInput);
|
|
2858
2858
|
|
|
2859
|
-
var
|
|
2859
|
+
var Chevron=function Chevron(props){var iconColor=`surface.text.${props.isDisabled?'placeholder':'normal'}.lowContrast`;return jsxs(Fragment,{children:[jsx(ChevronDownIcon,{display:props.isOpen?'none':'flex',size:"medium",color:iconColor}),jsx(ChevronUpIcon,{display:props.isOpen?'flex':'none',size:"medium",color:iconColor})]});};
|
|
2860
|
+
|
|
2861
|
+
var StyledChevronIconContainer=styled(TouchableOpacity)(function(_props){return {display:'flex',justifyContent:'center',margin:'auto'};});var InputChevronIcon=function InputChevronIcon(props){return jsx(StyledChevronIconContainer,{accessibilityLabel:"Chevron Icon",onPress:props.onClick,children:jsx(Chevron,{isDisabled:props.isDisabled,isOpen:props.isOpen})});};
|
|
2860
2862
|
|
|
2861
2863
|
var _excluded$f=["size","icon","onDismiss","children","isDisabled","testID","_isVirtuallyFocused","_isTagInsideInput"];var FocussableTag=styled(BaseBox)(function(props){if(props._isVirtuallyFocused&&!isReactNative$4()){return {outline:`${makeSize(size['1'])} solid ${props.theme.colors.surface.background.level1.lowContrast}`,boxShadow:`0px 0px 0px 4px ${props.theme.colors.brand.primary[400]}`};}return {};});var Tag=function Tag(_ref){var _ref$size=_ref.size,size$1=_ref$size===void 0?'medium':_ref$size,Icon=_ref.icon,onDismiss=_ref.onDismiss,children=_ref.children,isDisabled=_ref.isDisabled,testID=_ref.testID,_isVirtuallyFocused=_ref._isVirtuallyFocused,_isTagInsideInput=_ref._isTagInsideInput,styledProps=_objectWithoutProperties(_ref,_excluded$f);var isMobile=useIsMobile();var textColor=isDisabled?'surface.text.placeholder.lowContrast':'surface.text.subtle.lowContrast';var mediumPadding={base:['spacing.2','spacing.3','spacing.2','spacing.4'],m:['spacing.1','spacing.2','spacing.1','spacing.3']};var largePadding={base:['spacing.2','spacing.3','spacing.2','spacing.4'],m:['spacing.2','spacing.3','spacing.2','spacing.4']};var assetSize=React__default.useMemo(function(){if(isMobile&&size$1==='large'){return 'medium';}return 'small';},[isMobile,size$1]);return jsx(BaseBox,Object.assign({display:isReactNative$4()?'flex':'inline-flex'},getStyledProps(styledProps),metaAttribute({name:MetaConstants.Tag,testID:testID}),{children:jsxs(FocussableTag,{display:isReactNative$4()?'flex':'inline-flex',alignSelf:isReactNative$4()?'center':undefined,flexDirection:"row",flexWrap:"nowrap",backgroundColor:"brand.gray.a100.lowContrast",borderRadius:"max",padding:size$1==='medium'?mediumPadding:largePadding,_isVirtuallyFocused:_isVirtuallyFocused,children:[Icon?jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",children:jsx(Icon,{color:textColor,size:assetSize,marginRight:"spacing.2"})}):null,jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",maxWidth:makeSize(size['100']),children:jsx(Text,{truncateAfterLines:1,marginRight:"spacing.2",color:textColor,size:assetSize,children:children})}),jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",children:jsx(IconButton,{size:assetSize,icon:CloseIcon,accessibilityLabel:`Close ${children} tag`,isDisabled:isDisabled,_tabIndex:_isTagInsideInput?-1:undefined,onClick:function onClick(e){if(_isTagInsideInput){e.stopPropagation();}onDismiss();}})})]})}));};
|
|
2862
2864
|
|
|
2863
2865
|
var TAG_MAX_WIDTH_START=size['140'];var TAG_MAX_WIDTH_END=size['0'];var TAG_OPACITY_START=1;var TAG_OPACITY_END=0;
|
|
2864
2866
|
|
|
2865
|
-
var useAnimatedTag=function useAnimatedTag(onAnimationEndCallback){var maxWidth=useSharedValue(TAG_MAX_WIDTH_START);var opacity=useSharedValue(TAG_OPACITY_START);var _useTheme=useTheme(),theme=_useTheme.theme;var entering=new Keyframe({0:{opacity:TAG_OPACITY_END},100:{opacity:TAG_OPACITY_START,easing:theme.motion.easing.exit.effective}}).duration(makeMotionTime(theme.motion.duration.xquick));var animate=function animate(){maxWidth.value=withTiming(TAG_MAX_WIDTH_END,{duration:makeMotionTime(theme.motion.duration.xquick),easing:castNativeType(theme.motion.easing.exit.effective)},function(isComplete){if(isComplete){runOnJS(onAnimationEndCallback)();}});opacity.value=withTiming(TAG_OPACITY_END,{duration:makeMotionTime(theme.motion.duration.xquick),easing:Easing.out(Easing.exp)});};var animatedStyle=useAnimatedStyle(function(){return {maxWidth:maxWidth.value,opacity:opacity.value};});return {animate:animate,animatedStyle:animatedStyle,entering:entering};};var AnimatedTag=function AnimatedTag(_ref){var children=_ref.children,currentTagIndex=_ref.currentTagIndex,activeTagIndex=_ref.activeTagIndex,onDismiss=_ref.onDismiss,tagsLength=_ref.tagsLength;var onAnimationEnd=function onAnimationEnd(){onDismiss({tagIndex:currentTagIndex,tagName:children});};var prevSelectionsLength=React__default.useRef();var _useAnimatedTag=useAnimatedTag(onAnimationEnd),animate=_useAnimatedTag.animate,animatedStyle=_useAnimatedTag.animatedStyle,entering=_useAnimatedTag.entering;var isTagRemoved=prevSelectionsLength.current?prevSelectionsLength.current>tagsLength:false;return jsx(Animated$1.View,{style:animatedStyle,entering:isTagRemoved?undefined:entering,children:jsx(Tag,{_isVirtuallyFocused:currentTagIndex===activeTagIndex,_isTagInsideInput:true,onDismiss:function onDismiss(){animate();},marginRight:"spacing.3",marginY:"spacing.2",children:children})});};
|
|
2867
|
+
var useAnimatedTag=function useAnimatedTag(onAnimationEndCallback){var maxWidth=useSharedValue(TAG_MAX_WIDTH_START);var opacity=useSharedValue(TAG_OPACITY_START);var _useTheme=useTheme(),theme=_useTheme.theme;var entering=new Keyframe({0:{opacity:TAG_OPACITY_END},100:{opacity:TAG_OPACITY_START,easing:theme.motion.easing.exit.effective}}).duration(makeMotionTime(theme.motion.duration.xquick));var animate=function animate(){maxWidth.value=withTiming(TAG_MAX_WIDTH_END,{duration:makeMotionTime(theme.motion.duration.xquick),easing:castNativeType(theme.motion.easing.exit.effective)},function(isComplete){if(isComplete){runOnJS(onAnimationEndCallback)();}});opacity.value=withTiming(TAG_OPACITY_END,{duration:makeMotionTime(theme.motion.duration.xquick),easing:Easing.out(Easing.exp)});};var animatedStyle=useAnimatedStyle(function(){return {maxWidth:maxWidth.value,opacity:opacity.value};});return {animate:animate,animatedStyle:animatedStyle,entering:entering};};var AnimatedTag=function AnimatedTag(_ref){var children=_ref.children,currentTagIndex=_ref.currentTagIndex,activeTagIndex=_ref.activeTagIndex,onDismiss=_ref.onDismiss,tagsLength=_ref.tagsLength,isDisabled=_ref.isDisabled;var onAnimationEnd=function onAnimationEnd(){onDismiss({tagIndex:currentTagIndex,tagName:children});};var prevSelectionsLength=React__default.useRef();var _useAnimatedTag=useAnimatedTag(onAnimationEnd),animate=_useAnimatedTag.animate,animatedStyle=_useAnimatedTag.animatedStyle,entering=_useAnimatedTag.entering;var isTagRemoved=prevSelectionsLength.current?prevSelectionsLength.current>tagsLength:false;return jsx(Animated$1.View,{style:animatedStyle,entering:isTagRemoved?undefined:entering,children:jsx(Tag,{_isVirtuallyFocused:currentTagIndex===activeTagIndex,_isTagInsideInput:true,onDismiss:function onDismiss(){animate();},marginRight:"spacing.3",marginY:"spacing.2",isDisabled:isDisabled,children:children})});};
|
|
2866
2868
|
|
|
2867
|
-
var getTagsGroup=function getTagsGroup(_ref){var tags=_ref.tags,activeTagIndex=_ref.activeTagIndex,onDismiss=_ref.onDismiss;return tags.map(function(tagName,tagIndex){return jsx(AnimatedTag,{activeTagIndex:activeTagIndex,onDismiss:onDismiss,currentTagIndex:tagIndex,tagsLength:tags.length,children:tagName},tagName);});};
|
|
2869
|
+
var getTagsGroup=function getTagsGroup(_ref){var tags=_ref.tags,activeTagIndex=_ref.activeTagIndex,isDisabled=_ref.isDisabled,onDismiss=_ref.onDismiss;return tags.map(function(tagName,tagIndex){return jsx(AnimatedTag,{activeTagIndex:activeTagIndex,onDismiss:onDismiss,currentTagIndex:tagIndex,tagsLength:tags.length,isDisabled:isDisabled,children:tagName},tagName);});};
|
|
2868
2870
|
|
|
2869
2871
|
var useFirstRender=function useFirstRender(){var isFirstRenderRef=React__default.useRef(true);React__default.useEffect(function(){if(isFirstRenderRef.current){isFirstRenderRef.current=false;}},[]);return isFirstRenderRef.current;};
|
|
2870
2872
|
|
|
2871
|
-
var useControlledDropdownInput=function useControlledDropdownInput(props){var isFirstRender=useFirstRender();var _useDropdown=useDropdown(),changeCallbackTriggerer=_useDropdown.changeCallbackTriggerer,isControlled=_useDropdown.isControlled,options=_useDropdown.options,selectedIndices=_useDropdown.selectedIndices,controlledValueIndices=_useDropdown.controlledValueIndices,setSelectedIndices=_useDropdown.setSelectedIndices,selectionType=_useDropdown.selectionType,setIsControlled=_useDropdown.setIsControlled;var getValuesArrayFromIndices=function getValuesArrayFromIndices(){var indices=[];if(isControlled){indices=controlledValueIndices;}else {indices=selectedIndices;}return indices.map(function(selectionIndex){return options[selectionIndex].value;});};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);if(selectionType==='single'&&!Array.isArray(props.value)&&!props.isSelectInput){props.syncInputValueWithSelection==null?void 0:props.syncInputValueWithSelection(props.value);}}},[props.value,options]);React__default.useEffect(function(){if(!isFirstRender){props.onChange==null?void 0:props.onChange({name:props.name,values:getValuesArrayFromIndices()});}},[changeCallbackTriggerer]);};var _BaseDropdownInputTrigger=function _BaseDropdownInputTrigger(props,ref){var _props$placeholder,_props$maxRows,_props$label;var _useDropdown2=useDropdown(),isOpen=_useDropdown2.isOpen,activeTagIndex=_useDropdown2.activeTagIndex,setActiveTagIndex=_useDropdown2.setActiveTagIndex,displayValue=_useDropdown2.displayValue,selectionType=_useDropdown2.selectionType,dropdownTriggerer=_useDropdown2.dropdownTriggerer,dropdownBaseId=_useDropdown2.dropdownBaseId,selectedIndices=_useDropdown2.selectedIndices,triggererRef=_useDropdown2.triggererRef,triggererWrapperRef=_useDropdown2.triggererWrapperRef,isTagDismissedRef=_useDropdown2.isTagDismissedRef,onTriggerClick=_useDropdown2.onTriggerClick,value=_useDropdown2.value,shouldIgnoreBlurAnimation=_useDropdown2.shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation=_useDropdown2.setShouldIgnoreBlurAnimation,activeIndex=_useDropdown2.activeIndex,hasFooterAction=_useDropdown2.hasFooterAction,hasAutoCompleteInBottomSheetHeader=_useDropdown2.hasAutoCompleteInBottomSheetHeader,options=_useDropdown2.options,removeOption=_useDropdown2.removeOption,setChangeCallbackTriggerer=_useDropdown2.setChangeCallbackTriggerer,changeCallbackTriggerer=_useDropdown2.changeCallbackTriggerer;var dropdownTriggerPlaceholder=(_props$placeholder=props.placeholder)!=null?_props$placeholder:'Select Option';var isAutoCompleteInHeader=!props.isSelectInput&&hasAutoCompleteInBottomSheetHeader;var getShowAllTags=React__default.useCallback(function(){if(hasAutoCompleteInBottomSheetHeader){if(props.isSelectInput){return false;}return true;}return isOpen;},[hasAutoCompleteInBottomSheetHeader,props.isSelectInput,isOpen]);useControlledDropdownInput({onChange:props.onChange,name:props.name,value:props.value,defaultValue:props.defaultValue,syncInputValueWithSelection:props.syncInputValueWithSelection,isSelectInput:props.isSelectInput});var getValue=function getValue(){var prefix='';if(props.labelPosition==='inside-input'&&props.label){prefix=`${props.label}: `;}if(props.isSelectInput){if(selectionType==='single'){return `${prefix}${displayValue}`;}return undefined;}return props.inputValue;};var getTags=React__default.useMemo(function(){return function(){if(selectionType==='single'){return undefined;}return getTagsGroup({tags:selectedIndices.map(function(selectedIndex){return options[selectedIndex].title;}),activeTagIndex:activeTagIndex,onDismiss:function onDismiss(_ref){var tagIndex=_ref.tagIndex;if(isTagDismissedRef.current){isTagDismissedRef.current.value=true;}if(!isReactNative$4()){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();}removeOption(selectedIndices[tagIndex]);setChangeCallbackTriggerer(Number(changeCallbackTriggerer)+1);}});};},[selectedIndices,selectionType,activeTagIndex,changeCallbackTriggerer,options]);return jsx(BaseInput,{as:props.isSelectInput?'button':'input',ref:!isReactNative$4()?function(node){triggererRef.current=node;if(ref){if(typeof ref==='function'){ref(node);}else {ref.current=node;}}}:null,isDropdownTrigger:true,setInputWrapperRef:function setInputWrapperRef(wrapperNode){triggererWrapperRef.current=wrapperNode;},maxTagRows:(_props$maxRows=props.maxRows)!=null?_props$maxRows:'single',tags:getTags(),showAllTags:getShowAllTags(),activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,textAlign:"left",label:props.label,placeholder:selectionType==='multiple'&&selectedIndices.length>0?undefined:dropdownTriggerPlaceholder,hideLabelText:((_props$label=props.label)==null?void 0:_props$label.length)===0,accessibilityLabel:props.accessibilityLabel,labelPosition:props.labelPosition==='inside-input'?undefined:props.labelPosition,isLabelInsideInput:props.labelPosition==='inside-input',necessityIndicator:props.necessityIndicator,autoCompleteSuggestionType:"none",validationState:props.validationState,helpText:props.helpText,errorText:props.errorText,successText:props.successText,name:props.name,isDisabled:props.isDisabled,isRequired:props.isRequired,prefix:props.prefix,suffix:props.suffix,autoFocus:props.autoFocus,value:getValue(),onClick:props.onTriggerClick,onFocus:props.onFocus,onBlur:function onBlur(_ref2){var name=_ref2.name;props.onBlur==null?void 0:props.onBlur({name:name,value:value});},leadingIcon:props.icon,componentName:props.isSelectInput?MetaConstants.SelectInput:MetaConstants.AutoComplete,testID:props.testID,id:`${dropdownBaseId}-trigger`,labelId:`${dropdownBaseId}-label`,hasPopup:getActionListContainerRole(hasFooterAction,dropdownTriggerer),isPopupExpanded:isOpen,activeDescendant:activeIndex>=0?`${dropdownBaseId}-${activeIndex}`:undefined,popupId:`${dropdownBaseId}-actionlist`,onChange:props.isSelectInput?undefined:props.onInputValueChange,onKeyDown:props.onTriggerKeydown,interactionElement:isAutoCompleteInHeader?null:jsx(InputChevronIcon,{onClick:function onClick(){if(!props.isDisabled){if(!isReactNative$4()){var _triggererRef$current2;(_triggererRef$current2=triggererRef.current)==null?void 0:_triggererRef$current2.focus();}onTriggerClick();}},isOpen:isOpen})});};var BaseDropdownInputTrigger=React__default.forwardRef(_BaseDropdownInputTrigger);
|
|
2873
|
+
var useControlledDropdownInput=function useControlledDropdownInput(props){var isFirstRender=useFirstRender();var _useDropdown=useDropdown(),changeCallbackTriggerer=_useDropdown.changeCallbackTriggerer,isControlled=_useDropdown.isControlled,options=_useDropdown.options,selectedIndices=_useDropdown.selectedIndices,controlledValueIndices=_useDropdown.controlledValueIndices,setSelectedIndices=_useDropdown.setSelectedIndices,selectionType=_useDropdown.selectionType,setIsControlled=_useDropdown.setIsControlled;var getValuesArrayFromIndices=function getValuesArrayFromIndices(){var indices=[];if(isControlled){indices=controlledValueIndices;}else {indices=selectedIndices;}return indices.map(function(selectionIndex){return options[selectionIndex].value;});};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);if(selectionType==='single'&&!Array.isArray(props.value)&&!props.isSelectInput){props.syncInputValueWithSelection==null?void 0:props.syncInputValueWithSelection(props.value);}}},[props.value,options]);React__default.useEffect(function(){if(!isFirstRender){props.onChange==null?void 0:props.onChange({name:props.name,values:getValuesArrayFromIndices()});}},[changeCallbackTriggerer]);};var _BaseDropdownInputTrigger=function _BaseDropdownInputTrigger(props,ref){var _props$placeholder,_props$maxRows,_props$label;var _useDropdown2=useDropdown(),isOpen=_useDropdown2.isOpen,activeTagIndex=_useDropdown2.activeTagIndex,setActiveTagIndex=_useDropdown2.setActiveTagIndex,displayValue=_useDropdown2.displayValue,selectionType=_useDropdown2.selectionType,dropdownTriggerer=_useDropdown2.dropdownTriggerer,dropdownBaseId=_useDropdown2.dropdownBaseId,selectedIndices=_useDropdown2.selectedIndices,triggererRef=_useDropdown2.triggererRef,triggererWrapperRef=_useDropdown2.triggererWrapperRef,isTagDismissedRef=_useDropdown2.isTagDismissedRef,onTriggerClick=_useDropdown2.onTriggerClick,value=_useDropdown2.value,shouldIgnoreBlurAnimation=_useDropdown2.shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation=_useDropdown2.setShouldIgnoreBlurAnimation,activeIndex=_useDropdown2.activeIndex,hasFooterAction=_useDropdown2.hasFooterAction,hasAutoCompleteInBottomSheetHeader=_useDropdown2.hasAutoCompleteInBottomSheetHeader,options=_useDropdown2.options,removeOption=_useDropdown2.removeOption,setChangeCallbackTriggerer=_useDropdown2.setChangeCallbackTriggerer,changeCallbackTriggerer=_useDropdown2.changeCallbackTriggerer;var dropdownTriggerPlaceholder=(_props$placeholder=props.placeholder)!=null?_props$placeholder:'Select Option';var isAutoCompleteInHeader=!props.isSelectInput&&hasAutoCompleteInBottomSheetHeader;var getShowAllTags=React__default.useCallback(function(){if(hasAutoCompleteInBottomSheetHeader){if(props.isSelectInput){return false;}return true;}return isOpen;},[hasAutoCompleteInBottomSheetHeader,props.isSelectInput,isOpen]);useControlledDropdownInput({onChange:props.onChange,name:props.name,value:props.value,defaultValue:props.defaultValue,syncInputValueWithSelection:props.syncInputValueWithSelection,isSelectInput:props.isSelectInput});var getValue=function getValue(){var prefix='';if(props.labelPosition==='inside-input'&&props.label){prefix=`${props.label}: `;}if(props.isSelectInput){if(selectionType==='single'){return `${prefix}${displayValue}`;}return undefined;}return props.inputValue;};var getTags=React__default.useMemo(function(){return function(){if(selectionType==='single'){return undefined;}return getTagsGroup({tags:selectedIndices.map(function(selectedIndex){var _options$selectedInde;return (_options$selectedInde=options[selectedIndex])==null?void 0:_options$selectedInde.title;}),activeTagIndex:activeTagIndex,isDisabled:props.isDisabled,onDismiss:function onDismiss(_ref){var tagIndex=_ref.tagIndex;if(isTagDismissedRef.current){isTagDismissedRef.current.value=true;}if(!isReactNative$4()){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();}removeOption(selectedIndices[tagIndex]);setChangeCallbackTriggerer(Number(changeCallbackTriggerer)+1);}});};},[selectedIndices,selectionType,activeTagIndex,changeCallbackTriggerer,options]);return jsx(BaseInput,{as:props.isSelectInput?'button':'input',ref:!isReactNative$4()?function(node){triggererRef.current=node;if(ref){if(typeof ref==='function'){ref(node);}else {ref.current=node;}}}:null,isDropdownTrigger:true,setInputWrapperRef:function setInputWrapperRef(wrapperNode){triggererWrapperRef.current=wrapperNode;},maxTagRows:(_props$maxRows=props.maxRows)!=null?_props$maxRows:'single',tags:getTags(),showAllTags:getShowAllTags(),activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,textAlign:"left",label:props.label,placeholder:selectionType==='multiple'&&selectedIndices.length>0?undefined:dropdownTriggerPlaceholder,hideLabelText:((_props$label=props.label)==null?void 0:_props$label.length)===0,accessibilityLabel:props.accessibilityLabel,labelPosition:props.labelPosition==='inside-input'?undefined:props.labelPosition,isLabelInsideInput:props.labelPosition==='inside-input',necessityIndicator:props.necessityIndicator,autoCompleteSuggestionType:"none",validationState:props.validationState,helpText:props.helpText,errorText:props.errorText,successText:props.successText,name:props.name,isDisabled:props.isDisabled,isRequired:props.isRequired,prefix:props.prefix,suffix:props.suffix,autoFocus:props.autoFocus,value:getValue(),onClick:function onClick(e){if(props.isDisabled){return;}props.onTriggerClick==null?void 0:props.onTriggerClick(e);},onFocus:props.onFocus,onBlur:function onBlur(_ref2){var name=_ref2.name;props.onBlur==null?void 0:props.onBlur({name:name,value:value});},leadingIcon:props.icon,componentName:props.isSelectInput?MetaConstants.SelectInput:MetaConstants.AutoComplete,testID:props.testID,id:`${dropdownBaseId}-trigger`,labelId:`${dropdownBaseId}-label`,hasPopup:getActionListContainerRole(hasFooterAction,dropdownTriggerer),isPopupExpanded:isOpen,activeDescendant:activeIndex>=0?`${dropdownBaseId}-${activeIndex}`:undefined,popupId:`${dropdownBaseId}-actionlist`,onChange:props.isSelectInput?undefined:props.onInputValueChange,onKeyDown:props.onTriggerKeydown,interactionElement:isAutoCompleteInHeader?null:jsx(InputChevronIcon,{onClick:function onClick(){if(!props.isDisabled){if(!isReactNative$4()){var _triggererRef$current2;(_triggererRef$current2=triggererRef.current)==null?void 0:_triggererRef$current2.focus();}onTriggerClick();}},isDisabled:props.isDisabled,isOpen:isOpen})});};var BaseDropdownInputTrigger=React__default.forwardRef(_BaseDropdownInputTrigger);
|
|
2872
2874
|
|
|
2873
2875
|
var _SelectInput=function _SelectInput(props,ref){var _useDropdown=useDropdown(),value=_useDropdown.value,triggererRef=_useDropdown.triggererRef,onTriggerKeydown=_useDropdown.onTriggerKeydown,_onTriggerClick=_useDropdown.onTriggerClick;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(BaseDropdownInputTrigger,Object.assign({},props,{isSelectInput:true,onTriggerKeydown:onTriggerKeydown,onTriggerClick:function onTriggerClick(e){_onTriggerClick();props==null?void 0:props.onClick==null?void 0:props.onClick(e);}}))]});};var SelectInput=assignWithoutSideEffects(React__default.forwardRef(_SelectInput),{componentId:dropdownComponentIds.triggers.SelectInput});
|
|
2874
2876
|
|
|
2875
|
-
var useAutoComplete=function useAutoComplete(_ref){var props=_ref.props,inputValue=_ref.inputValue,setInputValue=_ref.setInputValue,getOptionValues=_ref.getOptionValues;var _useDropdown=useDropdown(),onBaseDropdownInputKeydown=_useDropdown.onTriggerKeydown,isOpen=_useDropdown.isOpen,setIsOpen=_useDropdown.setIsOpen,selectedIndices=_useDropdown.selectedIndices,setSelectedIndices=_useDropdown.setSelectedIndices,setControlledValueIndices=_useDropdown.setControlledValueIndices,isControlled=_useDropdown.isControlled,options=_useDropdown.options,setGlobalFilteredValues=_useDropdown.setFilteredValues,activeTagIndex=_useDropdown.activeTagIndex,setActiveTagIndex=_useDropdown.setActiveTagIndex,setActiveIndex=_useDropdown.setActiveIndex,globalFilteredValues=_useDropdown.filteredValues,selectionType=_useDropdown.selectionType,triggererRef=_useDropdown.triggererRef,hasAutoCompleteInBottomSheetHeader=_useDropdown.hasAutoCompleteInBottomSheetHeader;var resetFilters=function resetFilters(){return setGlobalFilteredValues(getOptionValues());};React__default.useEffect(function(){var firstItemOptionIndex=options.findIndex(function(option){return option.value===globalFilteredValues[0];});if(firstItemOptionIndex>=0){setActiveIndex(firstItemOptionIndex);}},[globalFilteredValues.length,options.length]);React__default.useEffect(function(){if(isOpen&&!inputValue){resetFilters();}},[isOpen,options]);React__default.useEffect(function(){if(isOpen&&selectionType==='single'){resetFilters();}if(hasAutoCompleteInBottomSheetHeader&&isOpen&&!isReactNative$4()){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();}},[isOpen]);var onInputValueChange=function onInputValueChange(_ref2){var name=_ref2.name,value=_ref2.value;setInputValue(value!=null?value:'');props.onInputValueChange==null?void 0:props.onInputValueChange({name:name,value:value});setActiveTagIndex(-1);if(!isOpen){setIsOpen(true);}if(!props.filteredValues){if(value&&options&&options.length>0){var filteredOptions=getOptionValues().filter(function(optionValue){return optionValue.toLowerCase().includes(value.toLowerCase());});setGlobalFilteredValues(filteredOptions);}else {resetFilters();}}};var onTriggerKeydown=function onTriggerKeydown(e){if(e.key==='Backspace'&&!inputValue&&activeTagIndex<0&&selectedIndices.length>0){if(isControlled){setControlledValueIndices(selectedIndices.slice(0,-1));}else {setSelectedIndices(selectedIndices.slice(0,-1));}}onBaseDropdownInputKeydown==null?void 0:onBaseDropdownInputKeydown(e);};var onSelectionChange=function onSelectionChange(_ref3){var values=_ref3.values;if(selectionType==='multiple'){setInputValue('');props.onInputValueChange==null?void 0:props.onInputValueChange({name:props.name,value:''});setActiveTagIndex(-1);resetFilters();}else {var _options$find;var displayText=(_options$find=options.find(function(option){return option.value===values[0];}))==null?void 0:_options$find.title;props.onInputValueChange==null?void 0:props.onInputValueChange({name:props.name,value:displayText});setInputValue(displayText!=null?displayText:'');}props.onChange==null?void 0:props.onChange({name:props.name,values:values});};return {onSelectionChange:onSelectionChange,onTriggerKeydown:onTriggerKeydown,onInputValueChange:onInputValueChange};};var _AutoComplete=function _AutoComplete(props,ref){var _props$inputValue,_props$autoFocus;var _React$useState=React__default.useState(''),_React$useState2=_slicedToArray(_React$useState,2),uncontrolledInputValue=_React$useState2[0],setInputValue=_React$useState2[1];var inputValue=(_props$inputValue=props.inputValue)!=null?_props$inputValue:uncontrolledInputValue;var _useDropdown2=useDropdown(),options=_useDropdown2.options,setGlobalFilteredValues=_useDropdown2.setFilteredValues,hasAutoCompleteInBottomSheetHeader=_useDropdown2.hasAutoCompleteInBottomSheetHeader,setHasAutoCompleteInBottomSheetHeader=_useDropdown2.setHasAutoCompleteInBottomSheetHeader,_onTriggerClick=_useDropdown2.onTriggerClick,dropdownTriggerer=_useDropdown2.dropdownTriggerer;var getOptionValues=React__default.useCallback(function(){return options.map(function(option){return option.value;});},[options]);var _useAutoComplete=useAutoComplete({props:props,inputValue:inputValue,setInputValue:setInputValue,getOptionValues:getOptionValues}),onSelectionChange=_useAutoComplete.onSelectionChange,onTriggerKeydown=_useAutoComplete.onTriggerKeydown,onInputValueChange=_useAutoComplete.onInputValueChange;React__default.useEffect(function(){if(dropdownTriggerer!==dropdownComponentIds.triggers.AutoComplete){setHasAutoCompleteInBottomSheetHeader(true);}},[]);React__default.useEffect(function(){if(props.filteredValues){setGlobalFilteredValues(props.filteredValues);}},[props.filteredValues,setGlobalFilteredValues]);var defaultAutoFocusState=hasAutoCompleteInBottomSheetHeader?true:undefined;return jsx(BaseBox,{position:"relative",children:jsx(BaseDropdownInputTrigger,Object.assign({},props,{autoFocus:(_props$autoFocus=props.autoFocus)!=null?_props$autoFocus:defaultAutoFocusState,ref:ref,onChange:onSelectionChange,isSelectInput:false,inputValue:inputValue,syncInputValueWithSelection:function syncInputValueWithSelection(value){var _selectedOption$title;if(!value){setInputValue('');return;}var selectedOption=options.find(function(option){return option.value===value;});setInputValue((_selectedOption$title=selectedOption==null?void 0:selectedOption.title)!=null?_selectedOption$title:'');},onTriggerKeydown:onTriggerKeydown,onInputValueChange:onInputValueChange,onTriggerClick:function onTriggerClick(triggerEvent){if(!hasAutoCompleteInBottomSheetHeader){_onTriggerClick();}props==null?void 0:props.onClick==null?void 0:props.onClick(triggerEvent);}}))});};var AutoComplete=assignWithoutSideEffects(React__default.forwardRef(_AutoComplete),{componentId:dropdownComponentIds.triggers.AutoComplete});
|
|
2877
|
+
var useAutoComplete=function useAutoComplete(_ref){var props=_ref.props,inputValue=_ref.inputValue,setInputValue=_ref.setInputValue,getOptionValues=_ref.getOptionValues;var _useDropdown=useDropdown(),onBaseDropdownInputKeydown=_useDropdown.onTriggerKeydown,isOpen=_useDropdown.isOpen,setIsOpen=_useDropdown.setIsOpen,selectedIndices=_useDropdown.selectedIndices,setSelectedIndices=_useDropdown.setSelectedIndices,setControlledValueIndices=_useDropdown.setControlledValueIndices,isControlled=_useDropdown.isControlled,options=_useDropdown.options,setGlobalFilteredValues=_useDropdown.setFilteredValues,activeTagIndex=_useDropdown.activeTagIndex,setActiveTagIndex=_useDropdown.setActiveTagIndex,setActiveIndex=_useDropdown.setActiveIndex,globalFilteredValues=_useDropdown.filteredValues,selectionType=_useDropdown.selectionType,triggererRef=_useDropdown.triggererRef,hasAutoCompleteInBottomSheetHeader=_useDropdown.hasAutoCompleteInBottomSheetHeader;var resetFilters=function resetFilters(){return setGlobalFilteredValues(getOptionValues());};React__default.useEffect(function(){var firstItemOptionIndex=options.findIndex(function(option){return option.value===globalFilteredValues[0];});if(firstItemOptionIndex>=0){setActiveIndex(firstItemOptionIndex);}},[globalFilteredValues.length,options.length]);React__default.useEffect(function(){if(isOpen&&!inputValue){resetFilters();}},[isOpen,options]);React__default.useEffect(function(){if(isOpen&&selectionType==='single'){resetFilters();}if(hasAutoCompleteInBottomSheetHeader&&isOpen&&!isReactNative$4()){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();}},[isOpen]);var onInputValueChange=function onInputValueChange(_ref2){var name=_ref2.name,value=_ref2.value;setInputValue(value!=null?value:'');props.onInputValueChange==null?void 0:props.onInputValueChange({name:name,value:value});setActiveTagIndex(-1);if(!isOpen){setIsOpen(true);}if(!props.filteredValues){if(value&&options&&options.length>0){var filteredOptions=getOptionValues().filter(function(optionValue){return optionValue.toLowerCase().includes(value.toLowerCase());});setGlobalFilteredValues(filteredOptions);}else {resetFilters();}}};var onTriggerKeydown=function onTriggerKeydown(e){if(e.key==='Backspace'&&!inputValue&&activeTagIndex<0&&selectedIndices.length>0){if(isControlled){setControlledValueIndices(selectedIndices.slice(0,-1));}else {setSelectedIndices(selectedIndices.slice(0,-1));}}onBaseDropdownInputKeydown==null?void 0:onBaseDropdownInputKeydown(e);};var onSelectionChange=function onSelectionChange(_ref3){var values=_ref3.values;if(selectionType==='multiple'){setInputValue('');props.onInputValueChange==null?void 0:props.onInputValueChange({name:props.name,value:''});setActiveTagIndex(-1);resetFilters();}else {var _options$find;var displayText=(_options$find=options.find(function(option){return option.value===values[0];}))==null?void 0:_options$find.title;props.onInputValueChange==null?void 0:props.onInputValueChange({name:props.name,value:displayText});if(typeof props.value==='undefined'){setInputValue(displayText!=null?displayText:'');}}props.onChange==null?void 0:props.onChange({name:props.name,values:values});};return {onSelectionChange:onSelectionChange,onTriggerKeydown:onTriggerKeydown,onInputValueChange:onInputValueChange};};var _AutoComplete=function _AutoComplete(props,ref){var _props$inputValue,_props$autoFocus;var _React$useState=React__default.useState(''),_React$useState2=_slicedToArray(_React$useState,2),uncontrolledInputValue=_React$useState2[0],setInputValue=_React$useState2[1];var inputValue=(_props$inputValue=props.inputValue)!=null?_props$inputValue:uncontrolledInputValue;var _useDropdown2=useDropdown(),options=_useDropdown2.options,setGlobalFilteredValues=_useDropdown2.setFilteredValues,hasAutoCompleteInBottomSheetHeader=_useDropdown2.hasAutoCompleteInBottomSheetHeader,setHasAutoCompleteInBottomSheetHeader=_useDropdown2.setHasAutoCompleteInBottomSheetHeader,_onTriggerClick=_useDropdown2.onTriggerClick,dropdownTriggerer=_useDropdown2.dropdownTriggerer;var getOptionValues=React__default.useCallback(function(){return options.map(function(option){return option.value;});},[options]);var _useAutoComplete=useAutoComplete({props:props,inputValue:inputValue,setInputValue:setInputValue,getOptionValues:getOptionValues}),onSelectionChange=_useAutoComplete.onSelectionChange,onTriggerKeydown=_useAutoComplete.onTriggerKeydown,onInputValueChange=_useAutoComplete.onInputValueChange;React__default.useEffect(function(){if(dropdownTriggerer!==dropdownComponentIds.triggers.AutoComplete){setHasAutoCompleteInBottomSheetHeader(true);}},[]);React__default.useEffect(function(){if(props.filteredValues){setGlobalFilteredValues(props.filteredValues);}},[props.filteredValues,setGlobalFilteredValues]);var defaultAutoFocusState=hasAutoCompleteInBottomSheetHeader?true:undefined;return jsx(BaseBox,{position:"relative",children:jsx(BaseDropdownInputTrigger,Object.assign({},props,{autoFocus:(_props$autoFocus=props.autoFocus)!=null?_props$autoFocus:defaultAutoFocusState,ref:ref,onChange:onSelectionChange,isSelectInput:false,inputValue:inputValue,syncInputValueWithSelection:function syncInputValueWithSelection(value){var _selectedOption$title;if(!value){setInputValue('');return;}var selectedOption=options.find(function(option){return option.value===value;});setInputValue((_selectedOption$title=selectedOption==null?void 0:selectedOption.title)!=null?_selectedOption$title:'');},onTriggerKeydown:onTriggerKeydown,onInputValueChange:onInputValueChange,onTriggerClick:function onTriggerClick(triggerEvent){if(!hasAutoCompleteInBottomSheetHeader){_onTriggerClick();}props==null?void 0:props.onClick==null?void 0:props.onClick(triggerEvent);}}))});};var AutoComplete=assignWithoutSideEffects(React__default.forwardRef(_AutoComplete),{componentId:dropdownComponentIds.triggers.AutoComplete});
|
|
2876
2878
|
|
|
2877
2879
|
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})})]})}));};
|
|
2878
2880
|
|