@razorpay/blade
Version:
The Design System that powers Razorpay
31 lines (28 loc) • 7.02 kB
JavaScript
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import 'react';
import { useVerifyInsideCard } from './CardContext.js';
import { ComponentIds } from './Card.js';
import { Badge } from '../Badge/Badge.js';
import Link from '../Link/Link/Link.js';
import Button from '../Button/Button/Button.js';
import { Counter } from '../Counter/Counter.js';
import { Divider } from '../Divider/Divider.js';
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 { minHeight } from '../Button/BaseButton/buttonTokens.js';
import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
import { makeSpace } from '../../utils/makeSpace/makeSpace.js';
import { isValidAllowedChildren, getComponentId } from '../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
import { throwBladeError } from '../../utils/logger/logger.js';
import { useVerifyAllowedChildren } from '../../utils/useVerifyAllowedChildren/useVerifyAllowedChildren.js';
import { Amount } from '../Amount/Amount.js';
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
import { jsx, jsxs } from 'react/jsx-runtime';
var _excluded=["children","testID","marginBottom","paddingBottom","showDivider"],_excluded2=["title","subtitle","prefix","suffix"];var _CardHeaderIcon=function _CardHeaderIcon(_ref){var Icon=_ref.icon;useVerifyInsideCard('CardHeaderIcon');return jsx(Icon,{color:"surface.icon.gray.normal",size:"large"});};var CardHeaderIcon=assignWithoutSideEffects(_CardHeaderIcon,{componentId:ComponentIds.CardHeaderIcon});var _CardHeaderCounter=function _CardHeaderCounter(props){useVerifyInsideCard('CardHeaderCounter');return jsx(Counter,Object.assign({},props));};var CardHeaderCounter=assignWithoutSideEffects(_CardHeaderCounter,{componentId:ComponentIds.CardHeaderCounter});var _CardHeaderBadge=function _CardHeaderBadge(props){useVerifyInsideCard('CardHeaderBadge');return jsx(Badge,Object.assign({},props));};var CardHeaderBadge=assignWithoutSideEffects(_CardHeaderBadge,{componentId:ComponentIds.CardHeaderBadge});var _CardHeaderAmount=function _CardHeaderAmount(props){useVerifyInsideCard('CardHeaderAmount');return jsx(Amount,Object.assign({},props));};var CardHeaderAmount=assignWithoutSideEffects(_CardHeaderAmount,{componentId:ComponentIds.CardHeaderAmount});var _CardHeaderText=function _CardHeaderText(props){useVerifyInsideCard('CardHeaderText');return jsx(Text,Object.assign({textAlign:"left"},props));};var CardHeaderText=assignWithoutSideEffects(_CardHeaderText,{componentId:ComponentIds.CardHeaderText});var _CardHeaderLink=function _CardHeaderLink(props){useVerifyInsideCard('CardHeaderLink');return jsx(Link,Object.assign({},props));};var CardHeaderLink=assignWithoutSideEffects(_CardHeaderLink,{componentId:ComponentIds.CardHeaderLink});var _CardHeaderIconButton=function _CardHeaderIconButton(props){useVerifyInsideCard('CardHeaderIconButton');return jsx(BaseBox,{width:makeSpace(minHeight.xsmall),children:jsx(Button,Object.assign({},props,{variant:"tertiary",size:"xsmall",iconPosition:"left",isFullWidth:true}))});};var CardHeaderIconButton=assignWithoutSideEffects(_CardHeaderIconButton,{componentId:ComponentIds.CardHeaderIconButton});var _CardHeader=function _CardHeader(_ref2){var children=_ref2.children,testID=_ref2.testID,_ref2$marginBottom=_ref2.marginBottom,marginBottom=_ref2$marginBottom===void 0?'spacing.4':_ref2$marginBottom,_ref2$paddingBottom=_ref2.paddingBottom,paddingBottom=_ref2$paddingBottom===void 0?'spacing.4':_ref2$paddingBottom,_ref2$showDivider=_ref2.showDivider,showDivider=_ref2$showDivider===void 0?true:_ref2$showDivider,rest=_objectWithoutProperties(_ref2,_excluded);useVerifyInsideCard('CardHeader');useVerifyAllowedChildren({children:children,componentName:'CardHeader',allowedComponents:[ComponentIds.CardHeaderLeading,ComponentIds.CardHeaderTrailing]});return jsxs(BaseBox,Object.assign({marginBottom:marginBottom},metaAttribute({name:MetaConstants.CardHeader,testID:testID}),makeAnalyticsAttribute(rest),{children:[jsx(BaseBox,{paddingBottom:paddingBottom,display:"flex",flexDirection:"row",justifyContent:"space-between",children:children}),showDivider?jsx(Divider,{}):null]}));};var CardHeader=assignWithoutSideEffects(_CardHeader,{componentId:ComponentIds.CardHeader});var _CardHeaderLeading=function _CardHeaderLeading(_ref3){var title=_ref3.title,subtitle=_ref3.subtitle,prefix=_ref3.prefix,suffix=_ref3.suffix,rest=_objectWithoutProperties(_ref3,_excluded2);useVerifyInsideCard('CardHeaderLeading');if(__DEV__){if(prefix&&!isValidAllowedChildren(prefix,ComponentIds.CardHeaderIcon)){throwBladeError({message:`Only \`${ComponentIds.CardHeaderIcon}\` component is accepted in prefix`,moduleName:'CardHeaderLeading'});}if(suffix&&!isValidAllowedChildren(suffix,ComponentIds.CardHeaderCounter)){throwBladeError({message:`Only \`${ComponentIds.CardHeaderCounter}\` component is accepted in prefix`,moduleName:'CardHeaderLeading'});}}return jsxs(BaseBox,Object.assign({},makeAnalyticsAttribute(rest),{flex:1,display:"flex",flexDirection:"row",children:[jsx(BaseBox,{marginRight:"spacing.3",alignSelf:"center",display:"flex",children:prefix}),jsxs(BaseBox,{marginRight:"spacing.5",children:[jsxs(BaseBox,{display:"flex",flexDirection:"row",alignItems:"center",flexWrap:"wrap",children:[jsx(Text,{color:"surface.text.gray.normal",size:"large",weight:"semibold",children:title}),jsx(BaseBox,{marginLeft:"spacing.3",children:suffix})]}),subtitle&&jsx(Text,{color:"surface.text.gray.subtle",textAlign:"left",size:"small",children:subtitle})]})]}));};var CardHeaderLeading=assignWithoutSideEffects(_CardHeaderLeading,{componentId:ComponentIds.CardHeaderLeading});var headerTrailingAllowedComponents=[ComponentIds.CardHeaderLink,ComponentIds.CardHeaderText,ComponentIds.CardHeaderIconButton,ComponentIds.CardHeaderBadge,ComponentIds.CardHeaderAmount];var _CardHeaderTrailing=function _CardHeaderTrailing(_ref4){var visual=_ref4.visual;useVerifyInsideCard('CardHeaderTrailing');if(__DEV__){if(visual&&!headerTrailingAllowedComponents.includes(getComponentId(visual))){throwBladeError({message:`Only one of \`${headerTrailingAllowedComponents.join(', ')}\` component is accepted in visual`,moduleName:'CardHeaderTrailing'});}}return jsx(BaseBox,{alignSelf:"center",children:visual});};var CardHeaderTrailing=assignWithoutSideEffects(_CardHeaderTrailing,{componentId:ComponentIds.CardHeaderTrailing});
export { CardHeader, CardHeaderAmount, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing };
//# sourceMappingURL=CardHeader.js.map