@razorpay/blade/build/lib/native/components/Card/Card.js

The Design System that powers Razorpay

import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React__default from 'react';
import { CardSurface } from './CardSurface.native.js';
import { CardProvider, useVerifyInsideCard } from './CardContext.js';
import { LinkOverlay } from './LinkOverlay.native.js';
import { CardRoot } from './CardRoot.native.js';
import { CARD_LINK_OVERLAY_ID } from './constants.js';
import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
import 'react-native';
import '../../tokens/global/typography.js';
import '../../tokens/global/motion.js';
import { isReactNative } from '../../utils/platform/isReactNative.js';
import '../BladeProvider/useTheme.js';
import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.native.js';
import { useVerifyAllowedChildren } from '../../utils/useVerifyAllowedChildren/useVerifyAllowedChildren.js';
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
import { jsx, jsxs } from 'react/jsx-runtime';

var _excluded=["children","backgroundColor","borderRadius","elevation","testID","padding","width","height","minHeight","minWidth","onClick","isSelected","accessibilityLabel","shouldScaleOnHover","onHover","href","target","rel","as"],_excluded2=["height","children","testID"];var ComponentIds={CardHeader:'CardHeader',CardHeaderTrailing:'CardHeaderTrailing',CardHeaderLeading:'CardHeaderLeading',CardFooter:'CardFooter',CardFooterTrailing:'CardFooterTrailing',CardFooterLeading:'CardFooterLeading',CardBody:'CardBody',CardHeaderIcon:'CardHeaderIcon',CardHeaderCounter:'CardHeaderCounter',CardHeaderBadge:'CardHeaderBadge',CardHeaderAmount:'CardHeaderAmount',CardHeaderText:'CardHeaderText',CardHeaderLink:'CardHeaderLink',CardHeaderIconButton:'CardHeaderIconButton'};var _Card=function _Card(_ref,ref){var children=_ref.children,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?'surface.background.gray.intense':_ref$backgroundColor,_ref$borderRadius=_ref.borderRadius,borderRadius=_ref$borderRadius===void 0?'medium':_ref$borderRadius,_ref$elevation=_ref.elevation,elevation=_ref$elevation===void 0?'lowRaised':_ref$elevation,testID=_ref.testID,_ref$padding=_ref.padding,padding=_ref$padding===void 0?'spacing.7':_ref$padding,width=_ref.width,height=_ref.height,minHeight=_ref.minHeight,minWidth=_ref.minWidth,onClick=_ref.onClick,_ref$isSelected=_ref.isSelected,isSelected=_ref$isSelected===void 0?false:_ref$isSelected,accessibilityLabel=_ref.accessibilityLabel,_ref$shouldScaleOnHov=_ref.shouldScaleOnHover,shouldScaleOnHover=_ref$shouldScaleOnHov===void 0?false:_ref$shouldScaleOnHov,onHover=_ref.onHover,href=_ref.href,target=_ref.target,rel=_ref.rel,as=_ref.as,rest=_objectWithoutProperties(_ref,_excluded);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isFocused=_React$useState2[0],setIsFocused=_React$useState2[1];useVerifyAllowedChildren({children:children,componentName:'Card',allowedComponents:[ComponentIds.CardHeader,ComponentIds.CardBody,ComponentIds.CardFooter]});var linkOverlayProps=Object.assign({},metaAttribute({name:CARD_LINK_OVERLAY_ID}),makeAccessible({label:accessibilityLabel,pressed:isSelected}),{onFocus:function onFocus(){setIsFocused(true);},onBlur:function onBlur(){setIsFocused(false);}});var defaultRel=target&&target==='_blank'?'noreferrer noopener':undefined;return jsx(CardProvider,{children:jsx(CardRoot,Object.assign({as:as,ref:ref,display:'block',borderRadius:borderRadius,onMouseEnter:onHover,shouldScaleOnHover:shouldScaleOnHover,isSelected:isSelected,isFocused:isFocused,onClick:isReactNative()?onClick:undefined,width:width,height:height,minHeight:minHeight,minWidth:minWidth,href:href,accessibilityLabel:accessibilityLabel},metaAttribute({name:MetaConstants.Card,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{children:jsxs(CardSurface,{height:height,minHeight:minHeight,padding:padding,borderRadius:borderRadius,elevation:elevation,textAlign:'left',backgroundColor:backgroundColor,children:[href?jsx(LinkOverlay,Object.assign({onClick:onClick,href:href,target:target,rel:rel!=null?rel:defaultRel},linkOverlayProps)):null,!href&&onClick?jsx(LinkOverlay,Object.assign({as:"button",onClick:onClick},linkOverlayProps)):null,children]})}))});};var _CardBody=function _CardBody(_ref2){var height=_ref2.height,children=_ref2.children,testID=_ref2.testID,rest=_objectWithoutProperties(_ref2,_excluded2);useVerifyInsideCard('CardBody');return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.CardBody,testID:testID}),makeAnalyticsAttribute(rest),{height:height,children:children}));};var Card=React__default.forwardRef(_Card);var CardBody=assignWithoutSideEffects(_CardBody,{componentId:ComponentIds.CardBody});

export { Card, CardBody, ComponentIds };
//# sourceMappingURL=Card.js.map