@razorpay/blade/build/lib/native/components/Input/BaseInput/BaseInputVisuals.js

The Design System that powers Razorpay

import React__default from 'react';
import { BaseBox } from '../../Box/BaseBox/BaseBox.native.js';
import '../../Typography/Heading/Heading.js';
import { Text } from '../../Typography/Text/Text.js';
import '../../Typography/Code/Code.js';
import '../../Typography/Display/Display.js';
import { isValidAllowedChildren } from '../../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
import { throwBladeError } from '../../../utils/logger/logger.js';
import { Tooltip } from '../../Tooltip/Tooltip.native.js';
import '../../Tooltip/TooltipInteractiveWrapper.native.js';
import { Box } from '../../Box/Box.js';
import 'react-native';
import '@babel/runtime/helpers/slicedToArray';
import { isReactNative } from '../../../utils/platform/isReactNative.js';
import '../../BladeProvider/useTheme.js';
import { jsxs, jsx } from 'react/jsx-runtime';

var getVisualContainerStyles=function getVisualContainerStyles(){var _ref=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{},shouldStretchTrailingBox=_ref.shouldStretchTrailingBox;return {display:'flex',flexDirection:'row',alignItems:'center',alignSelf:shouldStretchTrailingBox?'stretch':'center'};};var trailingIconColor={none:'surface.icon.gray.subtle',error:'feedback.icon.negative.intense',success:'feedback.icon.positive.intense'};var iconSize={medium:'medium',large:'large'};var textSize={medium:'medium',large:'large'};var getPrefixStyles=function getPrefixStyles(_ref2){var hasLeadingIcon=_ref2.hasLeadingIcon,hasPrefix=_ref2.hasPrefix;if(hasPrefix&&hasLeadingIcon){return {paddingLeft:'spacing.3'};}if(hasPrefix&&!hasLeadingIcon){return {paddingLeft:'spacing.4'};}return {paddingLeft:'spacing.0'};};var getInteractionElementStyles=function getInteractionElementStyles(_ref3){var hasTrailingIcon=_ref3.hasTrailingIcon,hasLeadingInteractionElement=_ref3.hasLeadingInteractionElement,hasTrailingInteractionElement=_ref3.hasTrailingInteractionElement,hasSuffix=_ref3.hasSuffix,hasTrailingButton=_ref3.hasTrailingButton;if(hasTrailingInteractionElement&&(hasSuffix||hasTrailingIcon||hasTrailingButton)){return 'spacing.2';}if(hasTrailingInteractionElement&&!hasSuffix&&!hasTrailingIcon&&!hasTrailingButton){return 'spacing.4';}if(hasLeadingInteractionElement){return 'spacing.3';}return 'spacing.0';};var getSuffixStyles=function getSuffixStyles(_ref4){var hasTrailingIcon=_ref4.hasTrailingIcon,hasSuffix=_ref4.hasSuffix,hasTrailingButton=_ref4.hasTrailingButton;if(hasSuffix&&(hasTrailingIcon||hasTrailingButton)){return {paddingRight:'spacing.3'};}if(hasSuffix&&!hasTrailingIcon&&!hasTrailingButton){return {paddingRight:'spacing.4'};}return {paddingRight:'spacing.0'};};var getTrailingIconStyles=function getTrailingIconStyles(_ref5){var hasTrailingIcon=_ref5.hasTrailingIcon,hasTrailingButton=_ref5.hasTrailingButton;if(hasTrailingIcon&&hasTrailingButton){return {paddingRight:'spacing.3'};}if(hasTrailingIcon&&!hasTrailingButton){return {paddingRight:'spacing.4'};}return {paddingRight:'spacing.0'};};var getInputVisualsToBeRendered=function getInputVisualsToBeRendered(_ref6){var leadingIcon=_ref6.leadingIcon,prefix=_ref6.prefix,trailingInteractionElement=_ref6.trailingInteractionElement,leadingInteractionElement=_ref6.leadingInteractionElement,suffix=_ref6.suffix,trailingIcon=_ref6.trailingIcon,trailingButton=_ref6.trailingButton;return {hasLeadingIcon:Boolean(leadingIcon),hasPrefix:Boolean(prefix),hasTrailingInteractionElement:Boolean(trailingInteractionElement),hasLeadingInteractionElement:Boolean(leadingInteractionElement),hasSuffix:Boolean(suffix),hasTrailingIcon:Boolean(trailingIcon),hasTrailingButton:Boolean(trailingButton)};};var getTooltipContent=function getTooltipContent(_ref7){var validationState=_ref7.validationState,errorText=_ref7.errorText,successText=_ref7.successText;if(validationState==='error'&&errorText){return errorText;}if(validationState==='success'&&successText){return successText;}return '';};var ValidationIconTooltip=function ValidationIconTooltip(_ref8){var children=_ref8.children,validationState=_ref8.validationState,errorText=_ref8.errorText,successText=_ref8.successText,showHintsAsTooltip=_ref8.showHintsAsTooltip;if(showHintsAsTooltip&&validationState==='error'&&errorText||validationState==='success'&&successText){return jsx(Tooltip,{content:getTooltipContent({validationState:validationState,errorText:errorText,successText:successText}),children:jsx(Box,{display:"flex",justifyContent:"center",alignItems:"center",children:children})});}return children;};var BaseInputVisuals=function BaseInputVisuals(_ref9){var LeadingIcon=_ref9.leadingIcon,prefix=_ref9.prefix,trailingInteractionElement=_ref9.trailingInteractionElement,onTrailingInteractionElementClick=_ref9.onTrailingInteractionElementClick,leadingInteractionElement=_ref9.leadingInteractionElement,suffix=_ref9.suffix,TrailingIcon=_ref9.trailingIcon,isDisabled=_ref9.isDisabled,_ref9$validationState=_ref9.validationState,validationState=_ref9$validationState===void 0?'none':_ref9$validationState,size=_ref9.size,showHintsAsTooltip=_ref9.showHintsAsTooltip,errorText=_ref9.errorText,successText=_ref9.successText,TrailingButton=_ref9.trailingButton;var _getInputVisualsToBeR=getInputVisualsToBeRendered({leadingIcon:LeadingIcon,prefix:prefix,leadingInteractionElement:leadingInteractionElement,trailingInteractionElement:trailingInteractionElement,suffix:suffix,trailingIcon:TrailingIcon,trailingButton:TrailingButton,size:size}),hasLeadingIcon=_getInputVisualsToBeR.hasLeadingIcon,hasPrefix=_getInputVisualsToBeR.hasPrefix,hasSuffix=_getInputVisualsToBeR.hasSuffix,hasTrailingInteractionElement=_getInputVisualsToBeR.hasTrailingInteractionElement,hasLeadingInteractionElement=_getInputVisualsToBeR.hasLeadingInteractionElement,hasTrailingIcon=_getInputVisualsToBeR.hasTrailingIcon,hasTrailingButton=_getInputVisualsToBeR.hasTrailingButton;var hasLeadingVisuals=hasLeadingInteractionElement||hasLeadingIcon||hasPrefix;var hasTrailingVisuals=hasTrailingInteractionElement||hasSuffix||hasTrailingIcon||hasTrailingButton;if(__DEV__){if(hasTrailingButton&&!isValidAllowedChildren(TrailingButton,'Link')){throwBladeError({message:'trailingButton must be a valid Blade Link component',moduleName:'BaseInput'});}}if(hasLeadingVisuals){return jsxs(BaseBox,Object.assign({},getVisualContainerStyles(),{children:[hasLeadingInteractionElement?jsx(BaseBox,{paddingLeft:getInteractionElementStyles({hasTrailingIcon:hasTrailingIcon,hasLeadingInteractionElement:hasLeadingInteractionElement,hasSuffix:hasSuffix,hasTrailingButton:hasTrailingButton}),display:"flex",alignItems:"stretch",alignSelf:"stretch",children:leadingInteractionElement}):null,LeadingIcon?jsx(BaseBox,{paddingLeft:"spacing.4",display:"flex",children:jsx(LeadingIcon,{size:iconSize[size],color:isDisabled?'surface.icon.gray.disabled':'surface.icon.gray.muted'})}):null,hasPrefix?jsx(BaseBox,Object.assign({},getPrefixStyles({hasLeadingIcon:hasLeadingIcon,hasPrefix:hasPrefix}),{children:jsx(Text,{size:textSize[size],variant:"body",weight:"regular",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',children:prefix})})):null]}));}if(hasTrailingVisuals){return jsxs(BaseBox,Object.assign({},getVisualContainerStyles({shouldStretchTrailingBox:hasTrailingInteractionElement&&Boolean(onTrailingInteractionElementClick)}),{children:[hasTrailingInteractionElement?jsx(BaseBox,Object.assign({},getVisualContainerStyles({shouldStretchTrailingBox:hasTrailingInteractionElement&&Boolean(onTrailingInteractionElementClick)}),{children:jsx(BaseBox,Object.assign({paddingRight:getInteractionElementStyles({hasTrailingIcon:hasTrailingIcon,hasTrailingInteractionElement:hasTrailingInteractionElement,hasSuffix:hasSuffix,hasTrailingButton:hasTrailingButton}),display:"flex",alignItems:"stretch",alignSelf:"stretch"},!isReactNative()&&{onClick:onTrailingInteractionElementClick},{children:trailingInteractionElement}))})):null,hasSuffix?jsx(BaseBox,Object.assign({},getSuffixStyles({hasTrailingIcon:hasTrailingIcon,hasSuffix:hasSuffix,hasTrailingButton:hasTrailingButton}),{children:jsx(Text,{size:textSize[size],variant:"body",weight:"regular",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',children:suffix})})):null,TrailingIcon?jsx(BaseBox,Object.assign({display:"flex",justifyContent:"center",alignItems:"center"},getTrailingIconStyles({hasTrailingIcon:hasTrailingIcon,hasTrailingButton:hasTrailingButton}),{children:jsx(ValidationIconTooltip,{showHintsAsTooltip:showHintsAsTooltip,errorText:errorText,successText:successText,validationState:validationState,children:jsx(TrailingIcon,{size:iconSize[size],color:isDisabled?'interactive.icon.gray.disabled':trailingIconColor[validationState]})})})):null,TrailingButton?jsx(BaseBox,{paddingRight:"spacing.4",display:"flex",children:React__default.cloneElement(TrailingButton,{size:size,variant:'button',isDisabled:isDisabled})}):null]}));}return null;};

export { BaseInputVisuals, getInputVisualsToBeRendered };
//# sourceMappingURL=BaseInputVisuals.js.map