@razorpay/blade
Version:
The Design System that powers Razorpay
24 lines (21 loc) • 3.53 kB
JavaScript
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React__default from 'react';
import styled from 'styled-components/native';
import { BaseText } from '../BaseText/BaseText.native.js';
import { BaseBox } from '../../Box/BaseBox/BaseBox.native.js';
import { getStyledProps } from '../../Box/styledProps/getStyledProps.js';
import '@babel/runtime/helpers/slicedToArray';
import 'react-native';
import '../../../tokens/global/typography.js';
import '../../../tokens/global/motion.js';
import { getPlatformType } from '../../../utils/getPlatformType/getPlatformType.js';
import { throwBladeError } from '../../../utils/logger/logger.js';
import { makeSpace } from '../../../utils/makeSpace/makeSpace.js';
import { makeTypographySize } from '../../../utils/makeTypographySize/makeTypographySize.native.js';
import '../../BladeProvider/useTheme.js';
import { metaAttribute } from '../../../utils/metaAttribute/metaAttribute.native.js';
import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
import { jsx } from 'react/jsx-runtime';
var _excluded=["children","size","weight","isHighlighted","color","testID"];var platformType=getPlatformType();var isPlatformWeb=platformType==='browser'||platformType==='node';var getCodeFontSizeAndLineHeight=function getCodeFontSizeAndLineHeight(size){switch(size){case'medium':return {fontSize:75,lineHeight:75};case'small':return {fontSize:25,lineHeight:25};default:if(__DEV__){throwBladeError({moduleName:'Code',message:`Unexpected size: ${size}`});}return undefined;}};var CodeContainer=styled(BaseBox)(function(props){var padding=`${makeSpace(props.theme.spacing[0])} ${makeSpace(props.theme.spacing[2])}`;return {padding:padding,backgroundColor:props.isHighlighted?props.theme.colors.feedback.background.neutral.subtle:undefined,borderRadius:props.theme.border.radius.medium,display:isPlatformWeb?'inline-block':'flex',alignSelf:isPlatformWeb?undefined:'center',verticalAlign:'middle',lineHeight:makeTypographySize(props.theme.typography.lineHeights[0])};});var getCodeColor=function getCodeColor(_ref){var isHighlighted=_ref.isHighlighted,color=_ref.color;if(isHighlighted){if(__DEV__){if(color){throwBladeError({moduleName:'Code',message:'`color` prop cannot be used without `isHighlighted={false}`'});}}return 'surface.text.gray.subtle';}if(color){return color;}return 'surface.text.gray.normal';};var _Code=function _Code(_ref2,ref){var children=_ref2.children,_ref2$size=_ref2.size,size=_ref2$size===void 0?'small':_ref2$size,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'regular':_ref2$weight,_ref2$isHighlighted=_ref2.isHighlighted,isHighlighted=_ref2$isHighlighted===void 0?true:_ref2$isHighlighted,color=_ref2.color,testID=_ref2.testID,styledProps=_objectWithoutProperties(_ref2,_excluded);var _ref3=getCodeFontSizeAndLineHeight(size),fontSize=_ref3.fontSize,lineHeight=_ref3.lineHeight;var codeTextColor=React__default.useMemo(function(){return getCodeColor({isHighlighted:isHighlighted,color:color});},[isHighlighted,color]);return jsx(CodeContainer,Object.assign({ref:ref,size:size,isHighlighted:isHighlighted,as:isPlatformWeb?'span':undefined},metaAttribute({name:MetaConstants.Code,testID:testID}),getStyledProps(styledProps),{children:jsx(BaseText,{color:codeTextColor,fontFamily:"code",fontSize:fontSize,fontWeight:weight,as:isPlatformWeb?'code':undefined,lineHeight:lineHeight,children:children})}));};var Code=React__default.forwardRef(_Code);
export { Code };
//# sourceMappingURL=Code.js.map