@razorpay/blade 5.4.2 → 5.4.3

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @razorpay/blade
 
+## 5.4.3
+
+### Patch Changes
+
+- e6c3ea9: fix(blade): restrict childrens in Card component
+
 ## 5.4.2
 
 ### Patch Changes

package/build/components/index.d.ts

@@ -1050,6 +1050,21 @@ declare type Theme = {
     typography: Typography;
 };
 
+declare const ComponentIds: {
+    CardHeader: string;
+    CardHeaderTrailing: string;
+    CardHeaderLeading: string;
+    CardFooter: string;
+    CardFooterTrailing: string;
+    CardFooterLeading: string;
+    CardBody: string;
+    CardHeaderIcon: string;
+    CardHeaderCounter: string;
+    CardHeaderBadge: string;
+    CardHeaderText: string;
+    CardHeaderLink: string;
+    CardHeaderIconButton: string;
+};
 declare type CardProps = {
     /**
      * Card contents
@@ -1069,13 +1084,13 @@ declare type CardProps = {
      * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens
      * - Figma: https://shorturl.at/fsvwK
      */
-    surfaceLevel: 2 | 3;
+    surfaceLevel?: 2 | 3;
 };
 declare const Card: ({ children, surfaceLevel }: CardProps) => React__default.ReactElement;
 declare type CardBodyProps = {
     children: React__default.ReactNode;
 };
-declare const CardBody: ({ children }: CardBodyProps) => React__default.ReactElement;
+declare const CardBody: WithComponentId<CardBodyProps>;
 
 declare type LinkCommonProps = {
     variant?: 'anchor' | 'button';
@@ -1271,7 +1286,7 @@ declare const CardHeaderIconButton: WithComponentId<CardHeaderIconButtonProps>;
 declare type CardHeaderProps = {
     children?: React__default.ReactNode;
 };
-declare const CardHeader: ({ children }: CardHeaderProps) => React__default.ReactElement;
+declare const CardHeader: WithComponentId<CardHeaderProps>;
 declare type CardHeaderLeadingProps = {
     title: string;
     subtitle?: string;
@@ -1288,7 +1303,7 @@ declare type CardHeaderLeadingProps = {
      */
     suffix?: React__default.ReactNode;
 };
-declare const CardHeaderLeading: ({ title, subtitle, prefix, suffix, }: CardHeaderLeadingProps) => React__default.ReactElement;
+declare const CardHeaderLeading: WithComponentId<CardHeaderLeadingProps>;
 declare type CardHeaderTrailingProps = {
     /**
      * Renders a visual ornament in card header trailing section
@@ -1297,27 +1312,27 @@ declare type CardHeaderTrailingProps = {
      */
     visual?: React__default.ReactNode;
 };
-declare const CardHeaderTrailing: ({ visual }: CardHeaderTrailingProps) => React__default.ReactElement;
+declare const CardHeaderTrailing: WithComponentId<CardHeaderTrailingProps>;
 
 declare type CardFooterAction = Pick<ButtonProps, 'type' | 'accessibilityLabel' | 'isLoading' | 'isDisabled' | 'icon' | 'iconPosition' | 'onClick'> & {
     text: ButtonProps['children'];
 };
 declare type CardFooterProps = {
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
 };
-declare const CardFooter: ({ children }: CardFooterProps) => React.ReactElement;
+declare const CardFooter: WithComponentId<CardFooterProps>;
 declare type CardFooterLeadingProps = {
     title?: string;
     subtitle?: string;
 };
-declare const CardFooterLeading: ({ title, subtitle }: CardFooterLeadingProps) => React.ReactElement;
+declare const CardFooterLeading: WithComponentId<CardFooterLeadingProps>;
 declare type CardFooterTrailingProps = {
     actions?: {
         primary?: CardFooterAction;
         secondary?: CardFooterAction;
     };
 };
-declare const CardFooterTrailing: ({ actions }: CardFooterTrailingProps) => React.ReactElement;
+declare const CardFooterTrailing: WithComponentId<CardFooterTrailingProps>;
 
 declare type IconButtonProps = {
     /**
@@ -2393,4 +2408,4 @@ declare const VisuallyHidden: ({ children }: VisuallyHiddenProps) => JSX.Element
 
 declare const screenReaderStyles: CSSObject;
 
-export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, Counter, CounterProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileTextIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconComponent, IconProps, IconSize, Indicator, IndicatorProps, InfoIcon, Link, LinkIcon, LinkProps, LockIcon, MailIcon, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SettingsIcon, SkipNavContent, SkipNavLink, SlashIcon, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, UsersIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
+export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, ComponentIds, Counter, CounterProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileTextIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconComponent, IconProps, IconSize, Indicator, IndicatorProps, InfoIcon, Link, LinkIcon, LinkProps, LockIcon, MailIcon, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SettingsIcon, SkipNavContent, SkipNavLink, SlashIcon, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, UsersIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };

package/build/components/index.native.d.ts

@@ -1050,6 +1050,21 @@ declare type Theme = {
     typography: Typography;
 };
 
+declare const ComponentIds: {
+    CardHeader: string;
+    CardHeaderTrailing: string;
+    CardHeaderLeading: string;
+    CardFooter: string;
+    CardFooterTrailing: string;
+    CardFooterLeading: string;
+    CardBody: string;
+    CardHeaderIcon: string;
+    CardHeaderCounter: string;
+    CardHeaderBadge: string;
+    CardHeaderText: string;
+    CardHeaderLink: string;
+    CardHeaderIconButton: string;
+};
 declare type CardProps = {
     /**
      * Card contents
@@ -1069,13 +1084,13 @@ declare type CardProps = {
      * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens
      * - Figma: https://shorturl.at/fsvwK
      */
-    surfaceLevel: 2 | 3;
+    surfaceLevel?: 2 | 3;
 };
 declare const Card: ({ children, surfaceLevel }: CardProps) => React__default.ReactElement;
 declare type CardBodyProps = {
     children: React__default.ReactNode;
 };
-declare const CardBody: ({ children }: CardBodyProps) => React__default.ReactElement;
+declare const CardBody: WithComponentId<CardBodyProps>;
 
 declare type LinkCommonProps = {
     variant?: 'anchor' | 'button';
@@ -1271,7 +1286,7 @@ declare const CardHeaderIconButton: WithComponentId<CardHeaderIconButtonProps>;
 declare type CardHeaderProps = {
     children?: React__default.ReactNode;
 };
-declare const CardHeader: ({ children }: CardHeaderProps) => React__default.ReactElement;
+declare const CardHeader: WithComponentId<CardHeaderProps>;
 declare type CardHeaderLeadingProps = {
     title: string;
     subtitle?: string;
@@ -1288,7 +1303,7 @@ declare type CardHeaderLeadingProps = {
      */
     suffix?: React__default.ReactNode;
 };
-declare const CardHeaderLeading: ({ title, subtitle, prefix, suffix, }: CardHeaderLeadingProps) => React__default.ReactElement;
+declare const CardHeaderLeading: WithComponentId<CardHeaderLeadingProps>;
 declare type CardHeaderTrailingProps = {
     /**
      * Renders a visual ornament in card header trailing section
@@ -1297,27 +1312,27 @@ declare type CardHeaderTrailingProps = {
      */
     visual?: React__default.ReactNode;
 };
-declare const CardHeaderTrailing: ({ visual }: CardHeaderTrailingProps) => React__default.ReactElement;
+declare const CardHeaderTrailing: WithComponentId<CardHeaderTrailingProps>;
 
 declare type CardFooterAction = Pick<ButtonProps, 'type' | 'accessibilityLabel' | 'isLoading' | 'isDisabled' | 'icon' | 'iconPosition' | 'onClick'> & {
     text: ButtonProps['children'];
 };
 declare type CardFooterProps = {
-    children?: React.ReactNode;
+    children?: React__default.ReactNode;
 };
-declare const CardFooter: ({ children }: CardFooterProps) => React.ReactElement;
+declare const CardFooter: WithComponentId<CardFooterProps>;
 declare type CardFooterLeadingProps = {
     title?: string;
     subtitle?: string;
 };
-declare const CardFooterLeading: ({ title, subtitle }: CardFooterLeadingProps) => React.ReactElement;
+declare const CardFooterLeading: WithComponentId<CardFooterLeadingProps>;
 declare type CardFooterTrailingProps = {
     actions?: {
         primary?: CardFooterAction;
         secondary?: CardFooterAction;
     };
 };
-declare const CardFooterTrailing: ({ actions }: CardFooterTrailingProps) => React.ReactElement;
+declare const CardFooterTrailing: WithComponentId<CardFooterTrailingProps>;
 
 declare type IconButtonProps = {
     /**
@@ -2381,4 +2396,4 @@ declare const VisuallyHidden: ({ children }: VisuallyHiddenProps) => JSX.Element
 
 declare const screenReaderStyles: CSSObject;
 
-export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, Counter, CounterProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileTextIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconComponent, IconProps, IconSize, Indicator, IndicatorProps, InfoIcon, Link, LinkIcon, LinkProps, LockIcon, MailIcon, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SettingsIcon, SkipNavContent, SkipNavLink, SlashIcon, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, UsersIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
+export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, ComponentIds, Counter, CounterProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileTextIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconComponent, IconProps, IconSize, Indicator, IndicatorProps, InfoIcon, Link, LinkIcon, LinkProps, LockIcon, MailIcon, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SettingsIcon, SkipNavContent, SkipNavLink, SlashIcon, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, UsersIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };

package/build/components/index.native.js

@@ -3381,9 +3381,9 @@ var isFeedbackVariant=function isFeedbackVariant(variant){var feedbackVariants=[
 
 var _excluded$2=["children","surfaceLevel"];var isAndroid=Platform.OS==='android';var androidShadow={color:undefined,elevation:2};var CardSurfaceStyled=styled(Box)(function(_ref){var surfaceLevel=_ref.surfaceLevel,theme=_ref.theme;var backgroundColor=theme.colors.surface.background["level"+surfaceLevel].lowContrast;return {width:'100%',display:'flex',flexDirection:'column',shadowOpacity:'1',shadowRadius:theme.shadows.blurRadius.level[1],shadowColor:isAndroid?androidShadow.color:theme.shadows.color.level[1],shadowOffset:"0px "+theme.shadows.offsetY.level[1]+"px",backgroundColor:backgroundColor};});var CardSurface=function CardSurface(_ref2){var children=_ref2.children,surfaceLevel=_ref2.surfaceLevel,props=_objectWithoutProperties(_ref2,_excluded$2);var _useTheme=useTheme(),theme=_useTheme.theme;return jsx(CardSurfaceStyled,_extends({},props,{surfaceLevel:surfaceLevel,elevation:isAndroid?androidShadow.elevation:theme.shadows.androidElevation.level[1],children:children}));};
 
-var CardContext=React__default.createContext(null);var useVerifyInsideCard=function useVerifyInsideCard(componentName){var context=React__default.useContext(CardContext);if(!context){throw new Error("[Blade Card]: "+componentName+" cannot be used outside of Card component");}return true;};var CardProvider=function CardProvider(_ref){var children=_ref.children;return jsx(CardContext.Provider,{value:true,children:children});};
+var CardContext=React__default.createContext(null);var useVerifyInsideCard=function useVerifyInsideCard(componentName){var context=React__default.useContext(CardContext);if(!context){throw new Error("[Blade Card]: "+componentName+" cannot be used outside of Card component");}return true;};var useVerifyAllowedComponents=function useVerifyAllowedComponents(children,componentName,allowedComponents){React__default.Children.forEach(children,function(child){var isValidChild=child&&allowedComponents.includes(getComponentId(child));if(!isValidChild){throw new Error("[Blade Card]: Only one of `"+allowedComponents.join(', ')+"` component is accepted as "+componentName+" children");}});};var CardProvider=function CardProvider(_ref){var children=_ref.children;return jsx(CardContext.Provider,{value:true,children:children});};
 
-var Card=function Card(_ref){var children=_ref.children,_ref$surfaceLevel=_ref.surfaceLevel,surfaceLevel=_ref$surfaceLevel===void 0?3:_ref$surfaceLevel;return jsx(CardProvider,{children:jsx(CardSurface,_extends({},metaAttribute(),{paddingLeft:"spacing.7",paddingRight:"spacing.7",paddingTop:"spacing.6",paddingBottom:"spacing.6",borderRadius:"medium",surfaceLevel:surfaceLevel,children:children}))});};var CardBody=function CardBody(_ref2){var children=_ref2.children;useVerifyInsideCard('CardBody');return jsx(Box,_extends({},metaAttribute(),{children:children}));};
+var ComponentIds={CardHeader:'CardHeader',CardHeaderTrailing:'CardHeaderTrailing',CardHeaderLeading:'CardHeaderLeading',CardFooter:'CardFooter',CardFooterTrailing:'CardFooterTrailing',CardFooterLeading:'CardFooterLeading',CardBody:'CardBody',CardHeaderIcon:'CardHeaderIcon',CardHeaderCounter:'CardHeaderCounter',CardHeaderBadge:'CardHeaderBadge',CardHeaderText:'CardHeaderText',CardHeaderLink:'CardHeaderLink',CardHeaderIconButton:'CardHeaderIconButton'};var Card=function Card(_ref){var children=_ref.children,_ref$surfaceLevel=_ref.surfaceLevel,surfaceLevel=_ref$surfaceLevel===void 0?3:_ref$surfaceLevel;useVerifyAllowedComponents(children,'Card',[ComponentIds.CardHeader,ComponentIds.CardBody,ComponentIds.CardFooter]);return jsx(CardProvider,{children:jsx(CardSurface,_extends({},metaAttribute(),{paddingLeft:"spacing.7",paddingRight:"spacing.7",paddingTop:"spacing.6",paddingBottom:"spacing.6",borderRadius:"medium",surfaceLevel:surfaceLevel,children:children}))});};var CardBody=function CardBody(_ref2){var children=_ref2.children;useVerifyInsideCard('CardBody');return jsx(Box,_extends({},metaAttribute(),{children:children}));};CardBody.componentId=ComponentIds.CardBody;
 
 var Link=function Link(_ref){var children=_ref.children,icon=_ref.icon,_ref$iconPosition=_ref.iconPosition,iconPosition=_ref$iconPosition===void 0?'left':_ref$iconPosition,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,onClick=_ref.onClick,_ref$variant=_ref.variant,variant=_ref$variant===void 0?'anchor':_ref$variant,href=_ref.href,target=_ref.target,rel=_ref.rel,accessibilityLabel=_ref.accessibilityLabel,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size;return jsx(BaseLink,_extends({},icon?{icon:icon,children:children}:{children:children},variant==='anchor'?{variant:variant,href:href,target:target,rel:rel}:{variant:variant,isDisabled:isDisabled},{iconPosition:iconPosition,onClick:onClick,accessibilityLabel:accessibilityLabel,size:size}));};
 
@@ -3399,9 +3399,9 @@ var StyledCounter=styled.View(function(props){return _extends({},getStyledCounte
 
 var getColorProps=function getColorProps(_ref){var _ref$intent=_ref.intent,intent=_ref$intent===void 0?'neutral':_ref$intent,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast;var props={textColor:"feedback.text."+intent+"."+contrast+"Contrast",backgroundColor:"feedback.background."+intent+"."+contrast+"Contrast"};return props;};var Counter=function Counter(_ref2){var value=_ref2.value,max=_ref2.max,_ref2$intent=_ref2.intent,intent=_ref2$intent===void 0?'neutral':_ref2$intent,_ref2$contrast=_ref2.contrast,contrast=_ref2$contrast===void 0?'low':_ref2$contrast,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size;var content=""+value;if(max&&value>max){content=max+"+";}var _useTheme=useTheme(),platform=_useTheme.platform;var _getColorProps=getColorProps({intent:intent,contrast:contrast}),backgroundColor=_getColorProps.backgroundColor,textColor=_getColorProps.textColor;var textSizes={small:{variant:'caption'},medium:{variant:'body',size:'small'},large:{variant:'body',size:'medium'}};return jsx(StyledCounter,{backgroundColor:backgroundColor,size:size,platform:platform,children:jsx(Box,_extends({paddingRight:horizontalPadding[size],paddingLeft:horizontalPadding[size],paddingTop:verticalPadding[size],paddingBottom:verticalPadding[size],display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",overflow:"hidden"},metaAttribute(),{children:jsx(Text,_extends({},textSizes[size],{type:"normal",weight:"regular",truncateAfterLines:1,color:textColor,children:content}))}))});};
 
-var ComponentIds={CardHeaderIcon:'CardHeaderIcon',CardHeaderCounter:'CardHeaderCounter',CardHeaderBadge:'CardHeaderBadge',CardHeaderText:'CardHeaderText',CardHeaderLink:'CardHeaderLink',CardHeaderIconButton:'CardHeaderIconButton'};var CardHeaderIcon=function CardHeaderIcon(_ref){var Icon=_ref.icon;useVerifyInsideCard('CardHeaderIcon');return jsx(Icon,{color:"surface.text.normal.lowContrast",size:"xlarge"});};CardHeaderIcon.componentId=ComponentIds.CardHeaderIcon;var CardHeaderCounter=function CardHeaderCounter(props){useVerifyInsideCard('CardHeaderCounter');return jsx(Counter,_extends({},props));};CardHeaderCounter.componentId=ComponentIds.CardHeaderCounter;var CardHeaderBadge=function CardHeaderBadge(props){useVerifyInsideCard('CardHeaderBadge');return jsx(Badge,_extends({},props));};CardHeaderBadge.componentId=ComponentIds.CardHeaderBadge;var CardHeaderText=function CardHeaderText(props){useVerifyInsideCard('CardHeaderText');return jsx(Text,_extends({},props));};CardHeaderText.componentId=ComponentIds.CardHeaderText;var CardHeaderLink=function CardHeaderLink(props){useVerifyInsideCard('CardHeaderLink');return jsx(Link,_extends({},props));};CardHeaderLink.componentId=ComponentIds.CardHeaderLink;var CardHeaderIconButton=function CardHeaderIconButton(props){useVerifyInsideCard('CardHeaderIconButton');return jsx(Box,{width:makeSpace(minHeight.xsmall),children:jsx(Button,_extends({},props,{variant:"tertiary",size:"xsmall",iconPosition:"left",isFullWidth:true}))});};CardHeaderIconButton.componentId=ComponentIds.CardHeaderIconButton;var CardHeader=function CardHeader(_ref2){var children=_ref2.children;useVerifyInsideCard('CardHeader');return jsxs(Box,_extends({marginBottom:"spacing.7"},metaAttribute(),{children:[jsx(Box,{marginBottom:"spacing.7",display:"flex",flexDirection:"row",justifyContent:"space-between",children:children}),jsx(Divider,{})]}));};var CardHeaderLeading=function CardHeaderLeading(_ref3){var title=_ref3.title,subtitle=_ref3.subtitle,prefix=_ref3.prefix,suffix=_ref3.suffix;useVerifyInsideCard('CardHeaderLeading');if(prefix&&!isValidAllowedChildren(prefix,ComponentIds.CardHeaderIcon)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds.CardHeaderIcon+"` component is accepted in prefix");}if(suffix&&!isValidAllowedChildren(suffix,ComponentIds.CardHeaderCounter)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds.CardHeaderCounter+"` component is accepted in prefix");}return jsxs(Box,{flex:1,display:"flex",flexDirection:"row",children:[jsx(Box,{marginRight:"spacing.3",alignSelf:"center",display:"flex",children:prefix}),jsxs(Box,{children:[jsxs(Box,{display:"flex",flexDirection:"row",alignItems:"center",flexWrap:"wrap",children:[jsx(Heading,{size:"small",variant:"regular",type:"normal",children:title}),jsx(Box,{marginLeft:"spacing.3",children:suffix})]}),jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]})]});};var headerTrailingAllowedComponents=[ComponentIds.CardHeaderLink,ComponentIds.CardHeaderText,ComponentIds.CardHeaderIconButton,ComponentIds.CardHeaderBadge];var CardHeaderTrailing=function CardHeaderTrailing(_ref4){var visual=_ref4.visual;useVerifyInsideCard('CardHeaderTrailing');if(visual&&!headerTrailingAllowedComponents.includes(getComponentId(visual))){throw new Error("[Blade CardHeaderTrailing]: Only one of `"+headerTrailingAllowedComponents.join(', ')+"` component is accepted in visual");}return jsx(Box,{alignSelf:"center",children:visual});};
+var CardHeaderIcon=function CardHeaderIcon(_ref){var Icon=_ref.icon;useVerifyInsideCard('CardHeaderIcon');return jsx(Icon,{color:"surface.text.normal.lowContrast",size:"xlarge"});};CardHeaderIcon.componentId=ComponentIds.CardHeaderIcon;var CardHeaderCounter=function CardHeaderCounter(props){useVerifyInsideCard('CardHeaderCounter');return jsx(Counter,_extends({},props));};CardHeaderCounter.componentId=ComponentIds.CardHeaderCounter;var CardHeaderBadge=function CardHeaderBadge(props){useVerifyInsideCard('CardHeaderBadge');return jsx(Badge,_extends({},props));};CardHeaderBadge.componentId=ComponentIds.CardHeaderBadge;var CardHeaderText=function CardHeaderText(props){useVerifyInsideCard('CardHeaderText');return jsx(Text,_extends({},props));};CardHeaderText.componentId=ComponentIds.CardHeaderText;var CardHeaderLink=function CardHeaderLink(props){useVerifyInsideCard('CardHeaderLink');return jsx(Link,_extends({},props));};CardHeaderLink.componentId=ComponentIds.CardHeaderLink;var CardHeaderIconButton=function CardHeaderIconButton(props){useVerifyInsideCard('CardHeaderIconButton');return jsx(Box,{width:makeSpace(minHeight.xsmall),children:jsx(Button,_extends({},props,{variant:"tertiary",size:"xsmall",iconPosition:"left",isFullWidth:true}))});};CardHeaderIconButton.componentId=ComponentIds.CardHeaderIconButton;var CardHeader=function CardHeader(_ref2){var children=_ref2.children;useVerifyInsideCard('CardHeader');useVerifyAllowedComponents(children,'CardHeader',[ComponentIds.CardHeaderLeading,ComponentIds.CardHeaderTrailing]);return jsxs(Box,_extends({marginBottom:"spacing.7"},metaAttribute(),{children:[jsx(Box,{marginBottom:"spacing.7",display:"flex",flexDirection:"row",justifyContent:"space-between",children:children}),jsx(Divider,{})]}));};CardHeader.componentId=ComponentIds.CardHeader;var CardHeaderLeading=function CardHeaderLeading(_ref3){var title=_ref3.title,subtitle=_ref3.subtitle,prefix=_ref3.prefix,suffix=_ref3.suffix;useVerifyInsideCard('CardHeaderLeading');if(prefix&&!isValidAllowedChildren(prefix,ComponentIds.CardHeaderIcon)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds.CardHeaderIcon+"` component is accepted in prefix");}if(suffix&&!isValidAllowedChildren(suffix,ComponentIds.CardHeaderCounter)){throw new Error("[Blade CardHeaderLeading]: Only `"+ComponentIds.CardHeaderCounter+"` component is accepted in prefix");}return jsxs(Box,{flex:1,display:"flex",flexDirection:"row",children:[jsx(Box,{marginRight:"spacing.3",alignSelf:"center",display:"flex",children:prefix}),jsxs(Box,{children:[jsxs(Box,{display:"flex",flexDirection:"row",alignItems:"center",flexWrap:"wrap",children:[jsx(Heading,{size:"small",variant:"regular",type:"normal",children:title}),jsx(Box,{marginLeft:"spacing.3",children:suffix})]}),jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]})]});};CardHeaderLeading.componentId=ComponentIds.CardHeaderLeading;var headerTrailingAllowedComponents=[ComponentIds.CardHeaderLink,ComponentIds.CardHeaderText,ComponentIds.CardHeaderIconButton,ComponentIds.CardHeaderBadge];var CardHeaderTrailing=function CardHeaderTrailing(_ref4){var visual=_ref4.visual;useVerifyInsideCard('CardHeaderTrailing');if(visual&&!headerTrailingAllowedComponents.includes(getComponentId(visual))){throw new Error("[Blade CardHeaderTrailing]: Only one of `"+headerTrailingAllowedComponents.join(', ')+"` component is accepted in visual");}return jsx(Box,{alignSelf:"center",children:visual});};CardHeaderTrailing.componentId=ComponentIds.CardHeaderTrailing;
 
-var useIsMobile=function useIsMobile(){var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;return matchedDeviceType==='mobile';};var CardFooter=function CardFooter(_ref){var children=_ref.children;var isMobile=useIsMobile();useVerifyInsideCard('CardFooter');return jsxs(Box,_extends({marginTop:"auto"},metaAttribute(),{children:[jsx(Box,{marginTop:"spacing.7"}),jsx(Divider,{}),jsx(Box,{marginTop:"spacing.7",display:"flex",flexDirection:isMobile?'column':'row',justifyContent:"space-between",alignItems:isMobile?'stretch':'center',children:children})]}));};var CardFooterLeading=function CardFooterLeading(_ref2){var title=_ref2.title,subtitle=_ref2.subtitle;useVerifyInsideCard('CardFooterLeading');return jsxs(Box,{children:[title&&jsx(Text,{variant:"body",size:"medium",weight:"bold",children:title}),subtitle&&jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]});};var CardFooterTrailing=function CardFooterTrailing(_ref3){var actions=_ref3.actions;var isMobile=useIsMobile();useVerifyInsideCard('CardFooterTrailing');return jsxs(Box,{display:"flex",flexDirection:"row",alignSelf:isMobile?'auto':'center',marginTop:isMobile?'spacing.5':'spacing.0',marginLeft:isMobile?'spacing.0':'spacing.5',children:[jsx(Box,{flexGrow:1,children:actions!=null&&actions.secondary?jsx(Button,_extends({isFullWidth:true,size:"medium",variant:"secondary"},actions.secondary,{children:actions.secondary.text})):null}),jsx(Box,{marginLeft:"spacing.5"}),jsx(Box,{flexGrow:1,children:actions!=null&&actions.primary?jsx(Button,_extends({isFullWidth:true,size:"medium"},actions.primary,{children:actions.primary.text})):null})]});};
+var useIsMobile=function useIsMobile(){var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;return matchedDeviceType==='mobile';};var CardFooter=function CardFooter(_ref){var children=_ref.children;var isMobile=useIsMobile();useVerifyInsideCard('CardFooter');useVerifyAllowedComponents(children,'CardFooter',[ComponentIds.CardFooterLeading,ComponentIds.CardFooterTrailing]);return jsxs(Box,_extends({marginTop:"auto"},metaAttribute(),{children:[jsx(Box,{marginTop:"spacing.7"}),jsx(Divider,{}),jsx(Box,{marginTop:"spacing.7",display:"flex",flexDirection:isMobile?'column':'row',justifyContent:"space-between",alignItems:isMobile?'stretch':'center',children:children})]}));};CardFooter.componentId=ComponentIds.CardFooter;var CardFooterLeading=function CardFooterLeading(_ref2){var title=_ref2.title,subtitle=_ref2.subtitle;useVerifyInsideCard('CardFooterLeading');return jsxs(Box,{children:[title&&jsx(Text,{variant:"body",size:"medium",weight:"bold",children:title}),subtitle&&jsx(Text,{variant:"body",size:"small",weight:"regular",children:subtitle})]});};CardFooterLeading.componentId=ComponentIds.CardFooterLeading;var CardFooterTrailing=function CardFooterTrailing(_ref3){var actions=_ref3.actions;var isMobile=useIsMobile();useVerifyInsideCard('CardFooterTrailing');return jsxs(Box,{display:"flex",flexDirection:"row",alignSelf:isMobile?'auto':'center',marginTop:isMobile?'spacing.5':'spacing.0',marginLeft:isMobile?'spacing.0':'spacing.5',children:[jsx(Box,{flexGrow:1,children:actions!=null&&actions.secondary?jsx(Button,_extends({isFullWidth:true,size:"medium",variant:"secondary"},actions.secondary,{children:actions.secondary.text})):null}),jsx(Box,{marginLeft:"spacing.5"}),jsx(Box,{flexGrow:1,children:actions!=null&&actions.primary?jsx(Button,_extends({isFullWidth:true,size:"medium"},actions.primary,{children:actions.primary.text})):null})]});};CardFooterTrailing.componentId=ComponentIds.CardFooterTrailing;
 
 /**
  * Checks if `value` is `undefined`.
@@ -3703,5 +3703,5 @@ var RadioGroup=function RadioGroup(_ref){var children=_ref.children,label=_ref.l
 
 var SkipNavLink=function SkipNavLink(_props){throw new Error('[Blade: SkipNav]: SkipNavLink is not available on React Native');};var SkipNavContent=function SkipNavContent(_props){throw new Error('[Blade: SkipNav]: SkipNavContent is not available on React Native');};
 
-export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BladeProvider, Button, Card, CardBody, CardFooter, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, Counter, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileTextIcon, Heading, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, Indicator, InfoIcon, Link, LinkIcon, LockIcon, MailIcon, MinusIcon, OTPInput, PasswordInput, PauseIcon, PlusIcon, ProgressBar, Radio, RadioGroup, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SettingsIcon, SkipNavContent, SkipNavLink, SlashIcon, Spinner, Text, TextArea, TextInput, Title, TrashIcon, TrendingDownIcon, TrendingUpIcon, UsersIcon, VisuallyHidden, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
+export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BladeProvider, Button, Card, CardBody, CardFooter, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, ComponentIds, Counter, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileTextIcon, Heading, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, Indicator, InfoIcon, Link, LinkIcon, LockIcon, MailIcon, MinusIcon, OTPInput, PasswordInput, PauseIcon, PlusIcon, ProgressBar, Radio, RadioGroup, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SettingsIcon, SkipNavContent, SkipNavLink, SlashIcon, Spinner, Text, TextArea, TextInput, Title, TrashIcon, TrendingDownIcon, TrendingUpIcon, UsersIcon, VisuallyHidden, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
 //# sourceMappingURL=index.native.js.map