@razorpay/blade 4.0.0 → 5.0.0

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/CHANGELOG.md CHANGED
@@ -1,5 +1,33 @@
1
1
  # @razorpay/blade
2
2
 
3
+ ## 5.0.0
4
+
5
+ ### Major Changes
6
+
7
+ - fc2a3bf: > **Warning**
8
+
9
+ > This is a breaking change for `Alert` component. The UI is updated to match the designs.
10
+
11
+ feat(Alert): design revamp
12
+
13
+ - `Alert` is updated to match the new designs
14
+ - Bordered variant is now more compact and smaller in size
15
+ - A new `neutral` intent is added. This is the new default if you haven't passed any `intent` explicitly.
16
+
17
+ ### Migration guide for consumers
18
+
19
+ - Earlier the default `intent` was `information`, this is now updated to `neutral`. If you were earlier using alerts without explicitly passing `intent` you should update that to continue using `information` as intent:
20
+
21
+ ```diff
22
+ <Alert
23
+ + intent="information"
24
+ />
25
+ ```
26
+
27
+ ### Patch Changes
28
+
29
+ - bb170bb: fix: set input type='text' when type='search' passed
30
+
3
31
  ## 4.0.0
4
32
 
5
33
  ### Major Changes
@@ -890,9 +890,9 @@ declare type AlertProps = {
890
890
  /**
891
891
  * Sets the color tone
892
892
  *
893
- * @default information
893
+ * @default neutral
894
894
  */
895
- intent?: Exclude<Feedback, 'neutral'>;
895
+ intent?: Feedback;
896
896
  /**
897
897
  * Removes border and border radii, useful for creating full bleed layouts. Automatically sets `isFullWidth` to `true` when enabled.
898
898
  *
@@ -890,9 +890,9 @@ declare type AlertProps = {
890
890
  /**
891
891
  * Sets the color tone
892
892
  *
893
- * @default information
893
+ * @default neutral
894
894
  */
895
- intent?: Exclude<Feedback, 'neutral'>;
895
+ intent?: Feedback;
896
896
  /**
897
897
  * Removes border and border radii, useful for creating full bleed layouts. Automatically sets `isFullWidth` to `true` when enabled.
898
898
  *
@@ -3213,7 +3213,7 @@ function usePrevious(value){var ref=useRef();useEffect(function(){ref.current=va
3213
3213
 
3214
3214
  var castWebType=function castWebType(value){return value;};var castNativeType=function castNativeType(value){return value;};
3215
3215
 
3216
- var MAX_WIDTH=584;var getCommonStyles=function getCommonStyles(props){var theme=props.theme,contrastType=props.contrastType,intent=props.intent,isFullWidth=props.isFullWidth,isBorderless=props.isBorderless;var _isFullWidth=isFullWidth||isBorderless;var feedbackColors=theme.colors.feedback;return {background:feedbackColors.background[intent][contrastType],padding:makeSpace(theme.spacing[4])+" "+makeSpace(theme.spacing[5]),borderRadius:makeBorderSize(isBorderless?theme.border.radius.none:theme.border.radius.medium),borderColor:feedbackColors.border[intent][contrastType],borderWidth:makeBorderSize(isBorderless?theme.border.width.none:theme.border.width.thin),borderStyle:'solid',display:'flex',flexDirection:'row',maxWidth:_isFullWidth?'auto':makeSize(MAX_WIDTH),alignItems:'flex-start'};};
3216
+ var MAX_WIDTH=584;var getCommonStyles=function getCommonStyles(props){var theme=props.theme,contrastType=props.contrastType,intent=props.intent,isFullWidth=props.isFullWidth,isBorderless=props.isBorderless;var _isFullWidth=isFullWidth||isBorderless;var feedbackColors=theme.colors.feedback;return {background:feedbackColors.background[intent][contrastType],padding:isBorderless?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(isBorderless?theme.border.radius.none:theme.border.radius.medium),borderColor:feedbackColors.border[intent][contrastType],borderWidth:makeBorderSize(isBorderless?theme.border.width.none:theme.border.width.thin),borderStyle:'solid',display:'flex',flexDirection:'row',maxWidth:_isFullWidth?'auto':makeSize(MAX_WIDTH),alignItems:'flex-start'};};
3217
3217
 
3218
3218
  var StyledAlert=styled.View(getCommonStyles);
3219
3219
 
@@ -3353,7 +3353,7 @@ var useInteraction=function useInteraction(){var _useState=useState('default'),_
3353
3353
 
3354
3354
  var _excluded$2=["currentInteraction","setCurrentInteraction"];var getColorToken=function getColorToken(_ref){var variant=_ref.variant,intent=_ref.intent,contrast=_ref.contrast,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'&&!intent){state='visited';}if(intent&&state!=='visited'){return "feedback."+intent+".action."+element+".link."+state+"."+contrast+"Contrast";}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,intent=_ref2.intent,contrast=_ref2.contrast,isVisited=_ref2.isVisited,target=_ref2.target,size=_ref2.size;var isButton=variant==='button';var props={as:isButton?'button':'a',textDecorationLine:!isButton&&currentInteraction!=='default'?'underline':'none',iconColor:getColorToken({variant:variant,intent:intent,contrast:contrast,element:'icon',currentInteraction:currentInteraction,isDisabled:isDisabled,isVisited:isVisited}),fontSize:size==='medium'?100:75,iconSize:size,iconPadding:children!=null&&children.trim()?'spacing.2':'spacing.0',textColor:getColorToken({variant:variant,intent:intent,contrast:contrast,element:'text',currentInteraction:currentInteraction,isDisabled:isDisabled,isVisited:isVisited}),focusRingColor:get_1(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){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,_ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'anchor':_ref3$variant,href=_ref3.href,target=_ref3.target,rel=_ref3.rel,intent=_ref3.intent,_ref3$contrast=_ref3.contrast,contrast=_ref3$contrast===void 0?'low':_ref3$contrast,accessibilityLabel=_ref3.accessibilityLabel,className=_ref3.className,style=_ref3.style,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isVisited=_useState2[0],setIsVisited=_useState2[1];var _useInteraction=useInteraction(),currentInteraction=_useInteraction.currentInteraction,setCurrentInteraction=_useInteraction.setCurrentInteraction,syntheticEvents=_objectWithoutProperties(_useInteraction,_excluded$2);var _useTheme=useTheme(),theme=_useTheme.theme;if(!Icon&&!(children!=null&&children.trim())){throw new Error("[Blade: BaseLink]: At least one of icon or text is required to render a link.");}var _getProps=getProps({theme:theme,variant:variant,currentInteraction:currentInteraction,children:children,isDisabled:isDisabled,intent:intent,contrast:contrast,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;var handleOnClick=function handleOnClick(event){if(!isVisited&&!intent&&variant==='anchor'){setIsVisited(true);}if(onClick){onClick(event);}};return jsx(StyledLink,_extends({},syntheticEvents,{accessibilityProps:_extends({},makeAccessible({role:role,label:accessibilityLabel,disabled:disabled})),variant:variant,as:as,href:href,target:target,rel:rel!=null?rel:defaultRel,onClick:handleOnClick,disabled:disabled,type:type,cursor:cursor,focusRingColor:focusRingColor,motionDuration:motionDuration,motionEasing:motionEasing,setCurrentInteraction:setCurrentInteraction,className:className,style:style,children:jsxs(Box,{display:"flex",flexDirection:"row",className:"content-container",alignItems:"center",children:[Icon&&iconPosition=='left'?jsx(Box,{paddingRight:iconPadding,display:"flex",alignItems:"center",children:jsx(Icon,{color:iconColor,size:iconSize})}):null,jsx(BaseText,{textDecorationLine:textDecorationLine,color:textColor,fontSize:fontSize,textAlign:"center",fontWeight:"bold",children:children}),Icon&&iconPosition=='right'?jsx(Box,{paddingLeft:iconPadding,display:"flex",alignItems:"center",children:jsx(Icon,{color:iconColor,size:iconSize})}):null]})}));};
3355
3355
 
3356
- var isReactNative$3=getPlatformType()==='react-native';var SecondaryActionWrapper=isReactNative$3?Box:Fragment;var CloseButtonWrapper=isReactNative$3?Box:Fragment;var intentIconMap={positive:CheckCircleIcon,negative:AlertTriangleIcon,information:AlertTriangleIcon,notice:AlertTriangleIcon$1};var Alert=function Alert(_ref){var description=_ref.description,title=_ref.title,_ref$isDismissable=_ref.isDismissable,isDismissable=_ref$isDismissable===void 0?true:_ref$isDismissable,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?'information':_ref$intent,_ref$isBorderless=_ref.isBorderless,isBorderless=_ref$isBorderless===void 0?false:_ref$isBorderless,actions=_ref.actions;if(!(actions!=null&&actions.primary)&&actions!=null&&actions.secondary){throw new Error('[Blade: Alert]: SecondaryAction is allowed only when PrimaryAction is defined.');}var _useState=useState(true),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var contrastType=contrast+"Contrast";var Icon=intentIconMap[intent];var icon=jsx(Icon,{color:"feedback.icon."+intent+"."+contrastType,size:"large"});var _title=title?jsx(Box,{marginBottom:"spacing.2",children:jsx(Heading,{size:"small",contrast:contrast,children:title})}):null;var _description=jsx(Text,{contrast:contrast,children:description});var primaryAction=actions!=null&&actions.primary?jsx(Box,{marginRight:"spacing.5",display:isReactNative$3?'flex':'inline-flex',children:jsx(BaseButton,{onClick:actions.primary.onClick,intent:intent,contrast:contrast,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(SecondaryActionWrapper,{children:jsx(BaseLink,_extends({contrast:contrast,intent:intent},secondaryActionParams,{children:actions.secondary.text}))}):null;var _actions=primaryAction||secondaryAction?jsxs(Box,{marginTop:"spacing.4",flexDirection:"row",alignItems:"center",children:[primaryAction,secondaryAction]}):null;var onClickDismiss=function onClickDismiss(){if(onDismiss){onDismiss();}setIsVisible(false);};var closeButton=isDismissable?jsx(CloseButtonWrapper,{children:jsx(IconButton,{accessibilityLabel:"Dismiss alert",onClick:onClickDismiss,contrast:contrast,size:"large",icon:CloseIcon})}):null;var a11yProps=makeAccessible(_extends({role:isReactNative$3||intent==='negative'||intent==='notice'?'alert':'status'},intent==='notice'&&{liveRegion:'polite'}));if(!isVisible){return null;}return jsxs(StyledAlert,_extends({intent:intent,contrastType:contrastType,isFullWidth:isFullWidth,isBorderless:isBorderless},a11yProps,{children:[icon,jsxs(Box,{flex:1,paddingLeft:"spacing.4",paddingRight:"spacing.2",children:[_title,_description,_actions]}),closeButton]}));};
3356
+ var isReactNative$3=getPlatformType()==='react-native';var SecondaryActionWrapper=isReactNative$3?Box:Fragment;var CloseButtonWrapper=isReactNative$3?Box:Fragment;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$isDismissable=_ref.isDismissable,isDismissable=_ref$isDismissable===void 0?true:_ref$isDismissable,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,_ref$isBorderless=_ref.isBorderless,isBorderless=_ref$isBorderless===void 0?false:_ref$isBorderless,actions=_ref.actions;if(!(actions!=null&&actions.primary)&&actions!=null&&actions.secondary){throw new Error('[Blade: Alert]: SecondaryAction is allowed only when PrimaryAction is defined.');}var _useState=useState(true),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var contrastType=contrast+"Contrast";var iconSize=isBorderless?'large':'medium';var textSize=isBorderless?'medium':'small';var Icon=intentIconMap[intent];var icon=jsx(Box,{marginTop:"spacing.1",display:"flex",children:jsx(Icon,{color:"feedback.icon."+intent+"."+contrastType,size:iconSize})});var _title=title?jsx(Box,{marginBottom:"spacing.2",children:isBorderless?jsx(Heading,{size:"small",contrast:contrast,children:title}):jsx(Text,{weight:"bold",contrast:contrast,children:title})}):null;var _description=jsx(Box,{marginTop:title||isReactNative$3?'spacing.0':'spacing.1',children:jsx(Text,{size:textSize,contrast:contrast,children:description})});var primaryAction=actions!=null&&actions.primary?jsx(Box,{marginRight:"spacing.5",display:isReactNative$3?'flex':'inline-flex',children:jsx(BaseButton,{size:textSize,onClick:actions.primary.onClick,intent:intent,contrast:contrast,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(SecondaryActionWrapper,{children:jsx(BaseLink,_extends({size:textSize,contrast:contrast,intent:intent},secondaryActionParams,{children:actions.secondary.text}))}):null;var _actions=primaryAction||secondaryAction?jsxs(Box,{marginTop:"spacing.4",flexDirection:"row",alignItems:"center",children:[primaryAction,secondaryAction]}):null;var onClickDismiss=function onClickDismiss(){if(onDismiss){onDismiss();}setIsVisible(false);};var closeButton=isDismissable?jsx(CloseButtonWrapper,{children:jsx(IconButton,{accessibilityLabel:"Dismiss alert",onClick:onClickDismiss,contrast:contrast,size:iconSize,icon:CloseIcon})}):null;var a11yProps=makeAccessible(_extends({role:isReactNative$3||intent==='negative'||intent==='notice'?'alert':'status'},intent==='notice'&&{liveRegion:'polite'}));if(!isVisible){return null;}return jsxs(StyledAlert,_extends({intent:intent,contrastType:contrastType,isFullWidth:isFullWidth,isBorderless:isBorderless},a11yProps,{children:[icon,jsxs(Box,{flex:1,paddingLeft:isBorderless?'spacing.4':'spacing.3',paddingRight:"spacing.2",children:[_title,_description,_actions]}),closeButton]}));};
3357
3357
 
3358
3358
  var verticalPadding$1={small:'spacing.0',medium:'spacing.1',large:'spacing.2'};var horizontalPadding$1={small:'spacing.3',medium:'spacing.3',large:'spacing.4'};var iconPadding={small:'spacing.1',medium:'spacing.2',large:'spacing.2'};var iconSize={small:'xsmall',medium:'small',large:'small'};var maxWidth$1={onMobile:100,onDesktop:120};
3359
3359
 
@@ -3461,7 +3461,7 @@ var autoCompleteSuggestionTypeValues=['none','name','email','username','password
3461
3461
 
3462
3462
  var CharacterCounter=function CharacterCounter(_ref){var currentCount=_ref.currentCount,maxCount=_ref.maxCount;return jsxs(Text,{variant:"caption",weight:"regular",type:"muted",children:[currentCount,"/",maxCount]});};
3463
3463
 
3464
- var getKeyboardAndAutocompleteProps=function getKeyboardAndAutocompleteProps(_ref){var _ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType;var keyboardAndAutocompleteProps={type:type,keyboardType:'text',keyboardReturnKeyType:'default',autoCompleteSuggestionType:'none'};var keyboardConfigMap={text:{keyboardType:'text',keyboardReturnKeyType:'default',autoCompleteSuggestionType:'none'},telephone:{keyboardType:'telephone',keyboardReturnKeyType:'done',autoCompleteSuggestionType:'telephone'},email:{keyboardType:'email',keyboardReturnKeyType:'done',autoCompleteSuggestionType:'email'},url:{keyboardType:'url',keyboardReturnKeyType:'go',autoCompleteSuggestionType:'none'},numeric:{keyboardType:'decimal',keyboardReturnKeyType:'done',autoCompleteSuggestionType:'none'},search:{keyboardType:'search',keyboardReturnKeyType:'search',autoCompleteSuggestionType:'none'}};var keyboardConfig=keyboardConfigMap[type];keyboardAndAutocompleteProps.keyboardType=keyboardConfig.keyboardType;keyboardAndAutocompleteProps.keyboardReturnKeyType=keyboardReturnKeyType!=null?keyboardReturnKeyType:keyboardConfig.keyboardReturnKeyType;keyboardAndAutocompleteProps.autoCompleteSuggestionType=autoCompleteSuggestionType!=null?autoCompleteSuggestionType:keyboardConfig.autoCompleteSuggestionType;if(type==='numeric'){keyboardAndAutocompleteProps.type='text';}return keyboardAndAutocompleteProps;};var isReactNative$2=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var TextInput=function TextInput(_ref2){var _Boolean;var label=_ref2.label,_ref2$labelPosition=_ref2.labelPosition,labelPosition=_ref2$labelPosition===void 0?'top':_ref2$labelPosition,placeholder=_ref2.placeholder,_ref2$type=_ref2.type,type=_ref2$type===void 0?'text':_ref2$type,defaultValue=_ref2.defaultValue,name=_ref2.name,value=_ref2.value,maxCharacters=_ref2.maxCharacters,_onChange=_ref2.onChange,onBlur=_ref2.onBlur,isDisabled=_ref2.isDisabled,necessityIndicator=_ref2.necessityIndicator,validationState=_ref2.validationState,errorText=_ref2.errorText,helpText=_ref2.helpText,successText=_ref2.successText,isRequired=_ref2.isRequired,icon=_ref2.icon,prefix=_ref2.prefix,showClearButton=_ref2.showClearButton,onClearButtonClick=_ref2.onClearButtonClick,isLoading=_ref2.isLoading,suffix=_ref2.suffix,autoFocus=_ref2.autoFocus,keyboardReturnKeyType=_ref2.keyboardReturnKeyType,autoCompleteSuggestionType=_ref2.autoCompleteSuggestionType;var textInputRef=React__default.useRef(null);var _useState=useState((_Boolean=Boolean(defaultValue!=null?defaultValue:value))!=null?_Boolean:false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(InfoIcon,{size:"medium",color:"surface.text.subtle.lowContrast"});}if(shouldShowClearButton){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty_1(value)&&textInputRef.current){if(isReactNative$2(textInputRef.current)){textInputRef.current.clear();textInputRef.current.focus();}else if(textInputRef.current instanceof HTMLInputElement){textInputRef.current.value='';textInputRef.current.focus();}}onClearButtonClick==null?void 0:onClearButtonClick();textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setShouldShowClearButton(false);},accessibilityLabel:"Clear Input Content"});}return null;};return jsx(BaseInput,_extends({id:"textinput",ref:textInputRef,label:label,labelPosition:labelPosition,placeholder:placeholder,defaultValue:defaultValue,value:value,name:name,maxCharacters:maxCharacters,onChange:function onChange(_ref3){var name=_ref3.name,value=_ref3.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}_onChange==null?void 0:_onChange({name:name,value:value});},onBlur:onBlur,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:icon,prefix:prefix,interactionElement:renderInteractionElement(),suffix:suffix,validationState:validationState,errorText:errorText,helpText:helpText,successText:successText,trailingFooterSlot:function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(Box,{marginTop:"spacing.2",marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters})}):null;},autoFocus:autoFocus},getKeyboardAndAutocompleteProps({type:type,keyboardReturnKeyType:keyboardReturnKeyType,autoCompleteSuggestionType:autoCompleteSuggestionType})));};
3464
+ var getKeyboardAndAutocompleteProps=function getKeyboardAndAutocompleteProps(_ref){var _ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType;var keyboardAndAutocompleteProps={type:type,keyboardType:'text',keyboardReturnKeyType:'default',autoCompleteSuggestionType:'none'};var keyboardConfigMap={text:{keyboardType:'text',keyboardReturnKeyType:'default',autoCompleteSuggestionType:'none'},telephone:{keyboardType:'telephone',keyboardReturnKeyType:'done',autoCompleteSuggestionType:'telephone'},email:{keyboardType:'email',keyboardReturnKeyType:'done',autoCompleteSuggestionType:'email'},url:{keyboardType:'url',keyboardReturnKeyType:'go',autoCompleteSuggestionType:'none'},numeric:{keyboardType:'decimal',keyboardReturnKeyType:'done',autoCompleteSuggestionType:'none'},search:{keyboardType:'search',keyboardReturnKeyType:'search',autoCompleteSuggestionType:'none'}};var keyboardConfig=keyboardConfigMap[type];keyboardAndAutocompleteProps.keyboardType=keyboardConfig.keyboardType;keyboardAndAutocompleteProps.keyboardReturnKeyType=keyboardReturnKeyType!=null?keyboardReturnKeyType:keyboardConfig.keyboardReturnKeyType;keyboardAndAutocompleteProps.autoCompleteSuggestionType=autoCompleteSuggestionType!=null?autoCompleteSuggestionType:keyboardConfig.autoCompleteSuggestionType;if(type==='numeric'){keyboardAndAutocompleteProps.type='text';}if(type==='search'){keyboardAndAutocompleteProps.type='text';}return keyboardAndAutocompleteProps;};var isReactNative$2=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var TextInput=function TextInput(_ref2){var _Boolean;var label=_ref2.label,_ref2$labelPosition=_ref2.labelPosition,labelPosition=_ref2$labelPosition===void 0?'top':_ref2$labelPosition,placeholder=_ref2.placeholder,_ref2$type=_ref2.type,type=_ref2$type===void 0?'text':_ref2$type,defaultValue=_ref2.defaultValue,name=_ref2.name,value=_ref2.value,maxCharacters=_ref2.maxCharacters,_onChange=_ref2.onChange,onBlur=_ref2.onBlur,isDisabled=_ref2.isDisabled,necessityIndicator=_ref2.necessityIndicator,validationState=_ref2.validationState,errorText=_ref2.errorText,helpText=_ref2.helpText,successText=_ref2.successText,isRequired=_ref2.isRequired,icon=_ref2.icon,prefix=_ref2.prefix,showClearButton=_ref2.showClearButton,onClearButtonClick=_ref2.onClearButtonClick,isLoading=_ref2.isLoading,suffix=_ref2.suffix,autoFocus=_ref2.autoFocus,keyboardReturnKeyType=_ref2.keyboardReturnKeyType,autoCompleteSuggestionType=_ref2.autoCompleteSuggestionType;var textInputRef=React__default.useRef(null);var _useState=useState((_Boolean=Boolean(defaultValue!=null?defaultValue:value))!=null?_Boolean:false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(InfoIcon,{size:"medium",color:"surface.text.subtle.lowContrast"});}if(shouldShowClearButton){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty_1(value)&&textInputRef.current){if(isReactNative$2(textInputRef.current)){textInputRef.current.clear();textInputRef.current.focus();}else if(textInputRef.current instanceof HTMLInputElement){textInputRef.current.value='';textInputRef.current.focus();}}onClearButtonClick==null?void 0:onClearButtonClick();textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setShouldShowClearButton(false);},accessibilityLabel:"Clear Input Content"});}return null;};return jsx(BaseInput,_extends({id:"textinput",ref:textInputRef,label:label,labelPosition:labelPosition,placeholder:placeholder,defaultValue:defaultValue,value:value,name:name,maxCharacters:maxCharacters,onChange:function onChange(_ref3){var name=_ref3.name,value=_ref3.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}_onChange==null?void 0:_onChange({name:name,value:value});},onBlur:onBlur,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:icon,prefix:prefix,interactionElement:renderInteractionElement(),suffix:suffix,validationState:validationState,errorText:errorText,helpText:helpText,successText:successText,trailingFooterSlot:function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(Box,{marginTop:"spacing.2",marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters})}):null;},autoFocus:autoFocus},getKeyboardAndAutocompleteProps({type:type,keyboardReturnKeyType:keyboardReturnKeyType,autoCompleteSuggestionType:autoCompleteSuggestionType})));};
3465
3465
 
3466
3466
  var PasswordInput=function PasswordInput(_ref){var label=_ref.label,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$showRevealButton=_ref.showRevealButton,showRevealButton=_ref$showRevealButton===void 0?true:_ref$showRevealButton,maxCharacters=_ref.maxCharacters,validationState=_ref.validationState,errorText=_ref.errorText,successText=_ref.successText,helpText=_ref.helpText,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,defaultValue=_ref.defaultValue,placeholder=_ref.placeholder,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,value=_ref.value,onChange=_ref.onChange,onFocus=_ref.onFocus,onBlur=_ref.onBlur,name=_ref.name,_ref$autoFocus=_ref.autoFocus,autoFocus=_ref$autoFocus===void 0?false:_ref$autoFocus,_ref$keyboardReturnKe=_ref.keyboardReturnKeyType,keyboardReturnKeyType=_ref$keyboardReturnKe===void 0?'done':_ref$keyboardReturnKe,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isRevealed=_useState2[0],setIsRevealed=_useState2[1];var isEnabled=!isDisabled;var isRevealedAndEnabled=isRevealed&&isEnabled;var toggleIsRevealed=function toggleIsRevealed(){return setIsRevealed(function(revealed){return !revealed;});};var accessibilityLabel=isRevealedAndEnabled?'Hide password':'Show password';var type=isRevealedAndEnabled?'text':'password';var revealButtonIcon=isRevealedAndEnabled?EyeOffIcon:EyeIcon;var revealButton=showRevealButton&&!isDisabled?jsx(IconButton,{size:"medium",icon:revealButtonIcon,onClick:toggleIsRevealed,accessibilityLabel:accessibilityLabel}):null;var trailingFooterSlot=function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(Box,{marginTop:"spacing.2",marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters})}):null;};return jsx(BaseInput,{id:"password-field",label:label,labelPosition:labelPosition,type:type,interactionElement:revealButton,trailingFooterSlot:trailingFooterSlot,maxCharacters:maxCharacters,validationState:validationState,errorText:errorText,successText:successText,helpText:helpText,isDisabled:isDisabled,defaultValue:defaultValue,placeholder:placeholder,isRequired:isRequired,necessityIndicator:necessityIndicator,value:value,onChange:onChange,onBlur:onBlur,onFocus:onFocus,name:name,autoFocus:autoFocus,autoCompleteSuggestionType:autoCompleteSuggestionType,keyboardReturnKeyType:keyboardReturnKeyType});};
3467
3467