@razorpay/blade 10.23.4 → 10.23.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 24 Jan 2024 07:43:44 GMT
3
+ * Generated on Wed, 24 Jan 2024 09:24:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1 +1 @@
1
- {"version":3,"file":"Card.js","sources":["../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport type { SpacingValueType } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { SurfaceLevels } from '~tokens/theme/theme';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport { isReactNative } from '~utils';\n\nexport const ComponentIds = {\n CardHeader: 'CardHeader',\n CardHeaderTrailing: 'CardHeaderTrailing',\n CardHeaderLeading: 'CardHeaderLeading',\n CardFooter: 'CardFooter',\n CardFooterTrailing: 'CardFooterTrailing',\n CardFooterLeading: 'CardFooterLeading',\n CardBody: 'CardBody',\n CardHeaderIcon: 'CardHeaderIcon',\n CardHeaderCounter: 'CardHeaderCounter',\n CardHeaderBadge: 'CardHeaderBadge',\n CardHeaderText: 'CardHeaderText',\n CardHeaderLink: 'CardHeaderLink',\n CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\nexport type CardProps = {\n /**\n * Card contents\n */\n children: React.ReactNode;\n /**\n * Sets the background color of the Card according to the surface level tokens\n *\n * eg: `theme.colors.surface.background.level1`\n *\n * @default `2`\n *\n * **Description:**\n *\n * - 2: Used in layouts which are on top of the main background\n * - 3: Used over the cards template or as a text input backgrounds.\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens\n */\n surfaceLevel?: Exclude<SurfaceLevels, 1>;\n /**\n * Sets the elevation for Cards\n *\n * eg: `theme.elevation.midRaised`\n *\n * @default `theme.elevation.lowRaised`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--page\n */\n elevation?: keyof Elevation;\n /**\n * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n * @default `spacing.7`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--page\n */\n padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.3' | 'spacing.5' | 'spacing.7'>;\n /**\n * Sets the width of the card\n */\n width?: BoxProps['width'];\n /**\n * Sets the height of the card\n */\n height?: BoxProps['height'];\n /**\n * Sets minimum height of the card\n */\n minHeight?: BoxProps['minHeight'];\n /**\n * Sets minimum width of the card\n */\n minWidth?: BoxProps['minWidth'];\n /**\n * If `true`, the card will be in selected state\n * Card will have a primary color border around it.\n *\n * @default false\n */\n\n isSelected?: boolean;\n /**\n * Makes the Card linkable by setting the `href` prop\n *\n * @default undefined\n */\n href?: string;\n /**\n * Sets the `target` attribute for the linkable card\n */\n target?: string;\n /**\n * Sets the `rel` attribute for the linkable card\n */\n rel?: string;\n /**\n * Sets the accessibility label for the card\n * This is useful when the card has an `href` or `onClick` prop\n * Setting this will announce the label when the card is focused\n */\n accessibilityLabel?: string;\n /**\n * If `true`, the card will scale up on hover\n *\n * On mobile devices it will scale down on press\n *\n * @default false\n */\n shouldScaleOnHover?: boolean;\n /**\n * Callback triggered when the card is hovered\n */\n onHover?: () => void;\n /**\n * Callback triggered when the card is clicked\n */\n onClick?: () => void;\n /**\n * Sets the HTML element for the Card\n *\n * When `as` is set to `label`, the card will be rendered as a label element\n * This can be used to create a custom checkbox or radio button using the card\n *\n * @default undefined\n */\n as?: 'label';\n} & TestID &\n StyledPropsBlade;\n\nconst Card = ({\n children,\n surfaceLevel = 2,\n elevation = 'lowRaised',\n testID,\n padding = 'spacing.7',\n width,\n height,\n minHeight,\n minWidth,\n onClick,\n isSelected = false,\n accessibilityLabel,\n shouldScaleOnHover = false,\n onHover,\n href,\n target,\n rel,\n as,\n ...styledProps\n}: CardProps): React.ReactElement => {\n const [isFocused, setIsFocused] = React.useState(false);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Card',\n allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n });\n\n const linkOverlayProps: LinkOverlayProps = {\n ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n onFocus: () => {\n setIsFocused(true);\n },\n onBlur: () => {\n setIsFocused(false);\n },\n };\n const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n return (\n <CardProvider>\n <CardRoot\n as={as}\n display={'block' as never}\n borderRadius=\"medium\"\n onMouseEnter={onHover as never}\n shouldScaleOnHover={shouldScaleOnHover}\n isSelected={isSelected}\n isFocused={isFocused}\n // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n onClick={isReactNative() ? onClick : undefined}\n width={width}\n height={height}\n minHeight={minHeight}\n minWidth={minWidth}\n href={href}\n accessibilityLabel={accessibilityLabel}\n {...metaAttribute({ name: MetaConstants.Card, testID })}\n {...getStyledProps(styledProps)}\n >\n <CardSurface\n height={height}\n minHeight={minHeight}\n padding={padding}\n borderRadius=\"medium\"\n surfaceLevel={surfaceLevel}\n elevation={elevation}\n textAlign={'left' as never}\n >\n {href ? (\n <LinkOverlay\n onClick={onClick}\n href={href}\n target={target}\n rel={rel ?? defaultRel}\n {...linkOverlayProps}\n />\n ) : null}\n {!href && onClick ? (\n <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n ) : null}\n {children}\n </CardSurface>\n </CardRoot>\n </CardProvider>\n );\n};\n\ntype CardBodyProps = {\n children: React.ReactNode;\n height?: BoxProps['height'];\n} & TestID;\n\nconst _CardBody = ({ height, children, testID }: CardBodyProps): React.ReactElement => {\n useVerifyInsideCard('CardBody');\n\n return (\n <BaseBox {...metaAttribute({ name: MetaConstants.CardBody, testID })} height={height}>\n {children}\n </BaseBox>\n );\n};\n\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderText","CardHeaderLink","CardHeaderIconButton","Card","_ref","children","_ref$surfaceLevel","surfaceLevel","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","styledProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","Object","assign","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","borderRadius","onMouseEnter","isReactNative","MetaConstants","getStyledProps","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","useVerifyInsideCard","BaseBox","assignWithoutSideEffects","componentId"],"mappings":"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"}
1
+ {"version":3,"file":"Card.js","sources":["../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport type { SpacingValueType } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { SurfaceLevels } from '~tokens/theme/theme';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\n\nexport const ComponentIds = {\n CardHeader: 'CardHeader',\n CardHeaderTrailing: 'CardHeaderTrailing',\n CardHeaderLeading: 'CardHeaderLeading',\n CardFooter: 'CardFooter',\n CardFooterTrailing: 'CardFooterTrailing',\n CardFooterLeading: 'CardFooterLeading',\n CardBody: 'CardBody',\n CardHeaderIcon: 'CardHeaderIcon',\n CardHeaderCounter: 'CardHeaderCounter',\n CardHeaderBadge: 'CardHeaderBadge',\n CardHeaderText: 'CardHeaderText',\n CardHeaderLink: 'CardHeaderLink',\n CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\nexport type CardProps = {\n /**\n * Card contents\n */\n children: React.ReactNode;\n /**\n * Sets the background color of the Card according to the surface level tokens\n *\n * eg: `theme.colors.surface.background.level1`\n *\n * @default `2`\n *\n * **Description:**\n *\n * - 2: Used in layouts which are on top of the main background\n * - 3: Used over the cards template or as a text input backgrounds.\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens\n */\n surfaceLevel?: Exclude<SurfaceLevels, 1>;\n /**\n * Sets the elevation for Cards\n *\n * eg: `theme.elevation.midRaised`\n *\n * @default `theme.elevation.lowRaised`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--page\n */\n elevation?: keyof Elevation;\n /**\n * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n * @default `spacing.7`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--page\n */\n padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.3' | 'spacing.5' | 'spacing.7'>;\n /**\n * Sets the width of the card\n */\n width?: BoxProps['width'];\n /**\n * Sets the height of the card\n */\n height?: BoxProps['height'];\n /**\n * Sets minimum height of the card\n */\n minHeight?: BoxProps['minHeight'];\n /**\n * Sets minimum width of the card\n */\n minWidth?: BoxProps['minWidth'];\n /**\n * If `true`, the card will be in selected state\n * Card will have a primary color border around it.\n *\n * @default false\n */\n\n isSelected?: boolean;\n /**\n * Makes the Card linkable by setting the `href` prop\n *\n * @default undefined\n */\n href?: string;\n /**\n * Sets the `target` attribute for the linkable card\n */\n target?: string;\n /**\n * Sets the `rel` attribute for the linkable card\n */\n rel?: string;\n /**\n * Sets the accessibility label for the card\n * This is useful when the card has an `href` or `onClick` prop\n * Setting this will announce the label when the card is focused\n */\n accessibilityLabel?: string;\n /**\n * If `true`, the card will scale up on hover\n *\n * On mobile devices it will scale down on press\n *\n * @default false\n */\n shouldScaleOnHover?: boolean;\n /**\n * Callback triggered when the card is hovered\n */\n onHover?: () => void;\n /**\n * Callback triggered when the card is clicked\n */\n onClick?: (\n event: Platform.Select<{\n web: React.MouseEvent;\n native: GestureResponderEvent;\n }>,\n ) => void;\n /**\n * Sets the HTML element for the Card\n *\n * When `as` is set to `label`, the card will be rendered as a label element\n * This can be used to create a custom checkbox or radio button using the card\n *\n * @default undefined\n */\n as?: 'label';\n} & TestID &\n StyledPropsBlade;\n\nconst Card = ({\n children,\n surfaceLevel = 2,\n elevation = 'lowRaised',\n testID,\n padding = 'spacing.7',\n width,\n height,\n minHeight,\n minWidth,\n onClick,\n isSelected = false,\n accessibilityLabel,\n shouldScaleOnHover = false,\n onHover,\n href,\n target,\n rel,\n as,\n ...styledProps\n}: CardProps): React.ReactElement => {\n const [isFocused, setIsFocused] = React.useState(false);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Card',\n allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n });\n\n const linkOverlayProps: LinkOverlayProps = {\n ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n onFocus: () => {\n setIsFocused(true);\n },\n onBlur: () => {\n setIsFocused(false);\n },\n };\n const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n return (\n <CardProvider>\n <CardRoot\n as={as}\n display={'block' as never}\n borderRadius=\"medium\"\n onMouseEnter={onHover as never}\n shouldScaleOnHover={shouldScaleOnHover}\n isSelected={isSelected}\n isFocused={isFocused}\n // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n onClick={isReactNative() ? onClick : undefined}\n width={width}\n height={height}\n minHeight={minHeight}\n minWidth={minWidth}\n href={href}\n accessibilityLabel={accessibilityLabel}\n {...metaAttribute({ name: MetaConstants.Card, testID })}\n {...getStyledProps(styledProps)}\n >\n <CardSurface\n height={height}\n minHeight={minHeight}\n padding={padding}\n borderRadius=\"medium\"\n surfaceLevel={surfaceLevel}\n elevation={elevation}\n textAlign={'left' as never}\n >\n {href ? (\n <LinkOverlay\n onClick={onClick}\n href={href}\n target={target}\n rel={rel ?? defaultRel}\n {...linkOverlayProps}\n />\n ) : null}\n {!href && onClick ? (\n <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n ) : null}\n {children}\n </CardSurface>\n </CardRoot>\n </CardProvider>\n );\n};\n\ntype CardBodyProps = {\n children: React.ReactNode;\n height?: BoxProps['height'];\n} & TestID;\n\nconst _CardBody = ({ height, children, testID }: CardBodyProps): React.ReactElement => {\n useVerifyInsideCard('CardBody');\n\n return (\n <BaseBox {...metaAttribute({ name: MetaConstants.CardBody, testID })} height={height}>\n {children}\n </BaseBox>\n );\n};\n\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderText","CardHeaderLink","CardHeaderIconButton","Card","_ref","children","_ref$surfaceLevel","surfaceLevel","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","styledProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","Object","assign","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","borderRadius","onMouseEnter","isReactNative","MetaConstants","getStyledProps","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","useVerifyInsideCard","BaseBox","assignWithoutSideEffects","componentId"],"mappings":"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"}
@@ -17,7 +17,7 @@ import '../BottomSheet/BottomSheetStack.js';
17
17
  import { jsx } from 'react/jsx-runtime';
18
18
  import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.native.js';
19
19
 
20
- var _excluded=["isSelected"],_excluded2=["children","onClick","isSelected","shouldScaleOnHover","href","as","accessibilityLabel"];var StyledCardRoot=styled(BaseBox)(function(_ref){var isSelected=_ref.isSelected,props=_objectWithoutProperties(_ref,_excluded);var selectedColor=isSelected?props.theme.colors.brand.primary[500]:'transparent';return {border:`${props.theme.border.width.thicker}px solid ${selectedColor}`};});var AnimatedPressable=Animated.createAnimatedComponent(Pressable);var openURL=function(){var _ref2=_asyncToGenerator(function*(href){try{var canOpen=yield Linking.canOpenURL(href);if(canOpen){yield Linking.openURL(href);}}catch(_unused){if(__DEV__){logger({type:'warn',message:`Could not open the link "href=${href}"`,moduleName:'BaseButton'});}}});return function openURL(_x){return _ref2.apply(this,arguments);};}();var CardRoot=function CardRoot(_ref3){var children=_ref3.children,onClick=_ref3.onClick,isSelected=_ref3.isSelected,shouldScaleOnHover=_ref3.shouldScaleOnHover,href=_ref3.href;_ref3.as;var accessibilityLabel=_ref3.accessibilityLabel,props=_objectWithoutProperties(_ref3,_excluded2);var _useTheme=useTheme(),theme=_useTheme.theme;var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];var duration=castNativeType(makeMotionTime(theme.motion.duration.xquick));var easing=castNativeType(theme.motion.easing.standard.effective);var styles=useAnimatedStyle(function(){return {transform:[{scale:withTiming(isPressed?CARD_SCALE_DOWN_VALUE:1,{duration:duration,easing:easing})}]};},[isPressed]);if(onClick||shouldScaleOnHover||href){return jsx(AnimatedPressable,Object.assign({},makeAccessible({role:href?'link':undefined,label:accessibilityLabel,selected:isSelected}),{style:styles,onPressIn:function onPressIn(){if(onClick){onClick();}setIsPressed(true);},onPressOut:function onPressOut(){if(href){void openURL(href);}setIsPressed(false);},children:jsx(StyledCardRoot,Object.assign({as:undefined,isSelected:isSelected},props,{children:children}))}));}return jsx(StyledCardRoot,Object.assign({as:undefined,isSelected:isSelected},props,{children:children}));};
20
+ var _excluded=["isSelected"],_excluded2=["children","onClick","isSelected","shouldScaleOnHover","href","as","accessibilityLabel"];var StyledCardRoot=styled(BaseBox)(function(_ref){var isSelected=_ref.isSelected,props=_objectWithoutProperties(_ref,_excluded);var selectedColor=isSelected?props.theme.colors.brand.primary[500]:'transparent';return {border:`${props.theme.border.width.thicker}px solid ${selectedColor}`};});var AnimatedPressable=Animated.createAnimatedComponent(Pressable);var openURL=function(){var _ref2=_asyncToGenerator(function*(href){try{var canOpen=yield Linking.canOpenURL(href);if(canOpen){yield Linking.openURL(href);}}catch(_unused){if(__DEV__){logger({type:'warn',message:`Could not open the link "href=${href}"`,moduleName:'BaseButton'});}}});return function openURL(_x){return _ref2.apply(this,arguments);};}();var CardRoot=function CardRoot(_ref3){var children=_ref3.children,onClick=_ref3.onClick,isSelected=_ref3.isSelected,shouldScaleOnHover=_ref3.shouldScaleOnHover,href=_ref3.href;_ref3.as;var accessibilityLabel=_ref3.accessibilityLabel,props=_objectWithoutProperties(_ref3,_excluded2);var _useTheme=useTheme(),theme=_useTheme.theme;var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];var duration=castNativeType(makeMotionTime(theme.motion.duration.xquick));var easing=castNativeType(theme.motion.easing.standard.effective);var styles=useAnimatedStyle(function(){return {transform:[{scale:withTiming(isPressed?CARD_SCALE_DOWN_VALUE:1,{duration:duration,easing:easing})}]};},[isPressed]);if(onClick||shouldScaleOnHover||href){return jsx(AnimatedPressable,Object.assign({},makeAccessible({role:href?'link':undefined,label:accessibilityLabel,selected:isSelected}),{style:styles,onPressIn:function onPressIn(event){if(onClick){onClick(event);}setIsPressed(true);},onPressOut:function onPressOut(){if(href){void openURL(href);}setIsPressed(false);},children:jsx(StyledCardRoot,Object.assign({as:undefined,isSelected:isSelected},props,{children:children}))}));}return jsx(StyledCardRoot,Object.assign({as:undefined,isSelected:isSelected},props,{children:children}));};
21
21
 
22
22
  export { CardRoot };
23
23
  //# sourceMappingURL=CardRoot.native.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CardRoot.native.js","sources":["../../../../../src/components/Card/CardRoot.native.tsx"],"sourcesContent":["import React from 'react';\nimport { Linking, Pressable } from 'react-native';\nimport Animated, { useAnimatedStyle, withTiming } from 'react-native-reanimated';\nimport styled from 'styled-components';\nimport type { CardRootProps } from './types';\nimport { CARD_SCALE_DOWN_VALUE } from './constants';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castNativeType, makeMotionTime } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\nimport { logger } from '~utils/logger';\nimport { makeAccessible } from '~utils/makeAccessible/makeAccessible.native';\n\nconst StyledCardRoot = styled(BaseBox)<CardRootProps>(({ isSelected, ...props }) => {\n const selectedColor = isSelected ? props.theme.colors.brand.primary[500] : 'transparent';\n return {\n border: `${props.theme.border.width.thicker}px solid ${selectedColor}`,\n };\n});\n\nconst AnimatedPressable = Animated.createAnimatedComponent(Pressable);\n\nconst openURL = async (href: string): Promise<void> => {\n try {\n const canOpen = await Linking.canOpenURL(href);\n if (canOpen) {\n await Linking.openURL(href);\n }\n } catch {\n if (__DEV__) {\n logger({\n type: 'warn',\n message: `Could not open the link \"href=${href}\"`,\n moduleName: 'BaseButton',\n });\n }\n }\n};\n\nconst CardRoot = ({\n children,\n onClick,\n isSelected,\n shouldScaleOnHover,\n href,\n as,\n accessibilityLabel,\n ...props\n}: CardRootProps): React.ReactElement => {\n const { theme } = useTheme();\n const [isPressed, setIsPressed] = React.useState(false);\n const duration = castNativeType(makeMotionTime(theme.motion.duration.xquick));\n const easing = castNativeType(theme.motion.easing.standard.effective);\n\n const styles = useAnimatedStyle(() => {\n return {\n transform: [\n {\n // TODO: check with design once what to do on mobile\n scale: withTiming(isPressed ? CARD_SCALE_DOWN_VALUE : 1, { duration, easing }),\n },\n ],\n };\n }, [isPressed]);\n\n if (onClick || shouldScaleOnHover || href) {\n return (\n <AnimatedPressable\n {...makeAccessible({\n role: href ? 'link' : undefined,\n label: accessibilityLabel,\n selected: isSelected,\n })}\n style={styles}\n onPressIn={() => {\n if (onClick) {\n onClick();\n }\n setIsPressed(true);\n }}\n onPressOut={() => {\n if (href) {\n void openURL(href);\n }\n setIsPressed(false);\n }}\n >\n <StyledCardRoot as={undefined} isSelected={isSelected} {...props}>\n {children}\n </StyledCardRoot>\n </AnimatedPressable>\n );\n }\n\n return (\n <StyledCardRoot as={undefined} isSelected={isSelected} {...props}>\n {children}\n </StyledCardRoot>\n );\n};\n\nexport { CardRoot };\n"],"names":["StyledCardRoot","styled","BaseBox","_ref","isSelected","props","_objectWithoutProperties","_excluded","selectedColor","theme","colors","brand","primary","border","width","thicker","AnimatedPressable","Animated","createAnimatedComponent","Pressable","openURL","_ref2","_asyncToGenerator","href","canOpen","Linking","canOpenURL","_unused","__DEV__","logger","type","message","moduleName","_x","apply","arguments","CardRoot","_ref3","children","onClick","shouldScaleOnHover","as","accessibilityLabel","_excluded2","_useTheme","useTheme","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","duration","castNativeType","makeMotionTime","motion","xquick","easing","standard","effective","styles","useAnimatedStyle","transform","scale","withTiming","CARD_SCALE_DOWN_VALUE","_jsx","Object","assign","makeAccessible","role","undefined","label","selected","style","onPressIn","onPressOut"],"mappings":"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"}
1
+ {"version":3,"file":"CardRoot.native.js","sources":["../../../../../src/components/Card/CardRoot.native.tsx"],"sourcesContent":["import React from 'react';\nimport { Linking, Pressable } from 'react-native';\nimport Animated, { useAnimatedStyle, withTiming } from 'react-native-reanimated';\nimport styled from 'styled-components';\nimport type { CardRootProps } from './types';\nimport { CARD_SCALE_DOWN_VALUE } from './constants';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castNativeType, makeMotionTime } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\nimport { logger } from '~utils/logger';\nimport { makeAccessible } from '~utils/makeAccessible/makeAccessible.native';\n\nconst StyledCardRoot = styled(BaseBox)<CardRootProps>(({ isSelected, ...props }) => {\n const selectedColor = isSelected ? props.theme.colors.brand.primary[500] : 'transparent';\n return {\n border: `${props.theme.border.width.thicker}px solid ${selectedColor}`,\n };\n});\n\nconst AnimatedPressable = Animated.createAnimatedComponent(Pressable);\n\nconst openURL = async (href: string): Promise<void> => {\n try {\n const canOpen = await Linking.canOpenURL(href);\n if (canOpen) {\n await Linking.openURL(href);\n }\n } catch {\n if (__DEV__) {\n logger({\n type: 'warn',\n message: `Could not open the link \"href=${href}\"`,\n moduleName: 'BaseButton',\n });\n }\n }\n};\n\nconst CardRoot = ({\n children,\n onClick,\n isSelected,\n shouldScaleOnHover,\n href,\n as,\n accessibilityLabel,\n ...props\n}: CardRootProps): React.ReactElement => {\n const { theme } = useTheme();\n const [isPressed, setIsPressed] = React.useState(false);\n const duration = castNativeType(makeMotionTime(theme.motion.duration.xquick));\n const easing = castNativeType(theme.motion.easing.standard.effective);\n\n const styles = useAnimatedStyle(() => {\n return {\n transform: [\n {\n // TODO: check with design once what to do on mobile\n scale: withTiming(isPressed ? CARD_SCALE_DOWN_VALUE : 1, { duration, easing }),\n },\n ],\n };\n }, [isPressed]);\n\n if (onClick || shouldScaleOnHover || href) {\n return (\n <AnimatedPressable\n {...makeAccessible({\n role: href ? 'link' : undefined,\n label: accessibilityLabel,\n selected: isSelected,\n })}\n style={styles}\n onPressIn={(event) => {\n if (onClick) {\n onClick(event);\n }\n setIsPressed(true);\n }}\n onPressOut={() => {\n if (href) {\n void openURL(href);\n }\n setIsPressed(false);\n }}\n >\n <StyledCardRoot as={undefined} isSelected={isSelected} {...props}>\n {children}\n </StyledCardRoot>\n </AnimatedPressable>\n );\n }\n\n return (\n <StyledCardRoot as={undefined} isSelected={isSelected} {...props}>\n {children}\n </StyledCardRoot>\n );\n};\n\nexport { CardRoot };\n"],"names":["StyledCardRoot","styled","BaseBox","_ref","isSelected","props","_objectWithoutProperties","_excluded","selectedColor","theme","colors","brand","primary","border","width","thicker","AnimatedPressable","Animated","createAnimatedComponent","Pressable","openURL","_ref2","_asyncToGenerator","href","canOpen","Linking","canOpenURL","_unused","__DEV__","logger","type","message","moduleName","_x","apply","arguments","CardRoot","_ref3","children","onClick","shouldScaleOnHover","as","accessibilityLabel","_excluded2","_useTheme","useTheme","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","duration","castNativeType","makeMotionTime","motion","xquick","easing","standard","effective","styles","useAnimatedStyle","transform","scale","withTiming","CARD_SCALE_DOWN_VALUE","_jsx","Object","assign","makeAccessible","role","undefined","label","selected","style","onPressIn","event","onPressOut"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Card.js","sources":["../../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport type { SpacingValueType } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { SurfaceLevels } from '~tokens/theme/theme';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport { isReactNative } from '~utils';\n\nexport const ComponentIds = {\n CardHeader: 'CardHeader',\n CardHeaderTrailing: 'CardHeaderTrailing',\n CardHeaderLeading: 'CardHeaderLeading',\n CardFooter: 'CardFooter',\n CardFooterTrailing: 'CardFooterTrailing',\n CardFooterLeading: 'CardFooterLeading',\n CardBody: 'CardBody',\n CardHeaderIcon: 'CardHeaderIcon',\n CardHeaderCounter: 'CardHeaderCounter',\n CardHeaderBadge: 'CardHeaderBadge',\n CardHeaderText: 'CardHeaderText',\n CardHeaderLink: 'CardHeaderLink',\n CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\nexport type CardProps = {\n /**\n * Card contents\n */\n children: React.ReactNode;\n /**\n * Sets the background color of the Card according to the surface level tokens\n *\n * eg: `theme.colors.surface.background.level1`\n *\n * @default `2`\n *\n * **Description:**\n *\n * - 2: Used in layouts which are on top of the main background\n * - 3: Used over the cards template or as a text input backgrounds.\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens\n */\n surfaceLevel?: Exclude<SurfaceLevels, 1>;\n /**\n * Sets the elevation for Cards\n *\n * eg: `theme.elevation.midRaised`\n *\n * @default `theme.elevation.lowRaised`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--page\n */\n elevation?: keyof Elevation;\n /**\n * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n * @default `spacing.7`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--page\n */\n padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.3' | 'spacing.5' | 'spacing.7'>;\n /**\n * Sets the width of the card\n */\n width?: BoxProps['width'];\n /**\n * Sets the height of the card\n */\n height?: BoxProps['height'];\n /**\n * Sets minimum height of the card\n */\n minHeight?: BoxProps['minHeight'];\n /**\n * Sets minimum width of the card\n */\n minWidth?: BoxProps['minWidth'];\n /**\n * If `true`, the card will be in selected state\n * Card will have a primary color border around it.\n *\n * @default false\n */\n\n isSelected?: boolean;\n /**\n * Makes the Card linkable by setting the `href` prop\n *\n * @default undefined\n */\n href?: string;\n /**\n * Sets the `target` attribute for the linkable card\n */\n target?: string;\n /**\n * Sets the `rel` attribute for the linkable card\n */\n rel?: string;\n /**\n * Sets the accessibility label for the card\n * This is useful when the card has an `href` or `onClick` prop\n * Setting this will announce the label when the card is focused\n */\n accessibilityLabel?: string;\n /**\n * If `true`, the card will scale up on hover\n *\n * On mobile devices it will scale down on press\n *\n * @default false\n */\n shouldScaleOnHover?: boolean;\n /**\n * Callback triggered when the card is hovered\n */\n onHover?: () => void;\n /**\n * Callback triggered when the card is clicked\n */\n onClick?: () => void;\n /**\n * Sets the HTML element for the Card\n *\n * When `as` is set to `label`, the card will be rendered as a label element\n * This can be used to create a custom checkbox or radio button using the card\n *\n * @default undefined\n */\n as?: 'label';\n} & TestID &\n StyledPropsBlade;\n\nconst Card = ({\n children,\n surfaceLevel = 2,\n elevation = 'lowRaised',\n testID,\n padding = 'spacing.7',\n width,\n height,\n minHeight,\n minWidth,\n onClick,\n isSelected = false,\n accessibilityLabel,\n shouldScaleOnHover = false,\n onHover,\n href,\n target,\n rel,\n as,\n ...styledProps\n}: CardProps): React.ReactElement => {\n const [isFocused, setIsFocused] = React.useState(false);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Card',\n allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n });\n\n const linkOverlayProps: LinkOverlayProps = {\n ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n onFocus: () => {\n setIsFocused(true);\n },\n onBlur: () => {\n setIsFocused(false);\n },\n };\n const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n return (\n <CardProvider>\n <CardRoot\n as={as}\n display={'block' as never}\n borderRadius=\"medium\"\n onMouseEnter={onHover as never}\n shouldScaleOnHover={shouldScaleOnHover}\n isSelected={isSelected}\n isFocused={isFocused}\n // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n onClick={isReactNative() ? onClick : undefined}\n width={width}\n height={height}\n minHeight={minHeight}\n minWidth={minWidth}\n href={href}\n accessibilityLabel={accessibilityLabel}\n {...metaAttribute({ name: MetaConstants.Card, testID })}\n {...getStyledProps(styledProps)}\n >\n <CardSurface\n height={height}\n minHeight={minHeight}\n padding={padding}\n borderRadius=\"medium\"\n surfaceLevel={surfaceLevel}\n elevation={elevation}\n textAlign={'left' as never}\n >\n {href ? (\n <LinkOverlay\n onClick={onClick}\n href={href}\n target={target}\n rel={rel ?? defaultRel}\n {...linkOverlayProps}\n />\n ) : null}\n {!href && onClick ? (\n <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n ) : null}\n {children}\n </CardSurface>\n </CardRoot>\n </CardProvider>\n );\n};\n\ntype CardBodyProps = {\n children: React.ReactNode;\n height?: BoxProps['height'];\n} & TestID;\n\nconst _CardBody = ({ height, children, testID }: CardBodyProps): React.ReactElement => {\n useVerifyInsideCard('CardBody');\n\n return (\n <BaseBox {...metaAttribute({ name: MetaConstants.CardBody, testID })} height={height}>\n {children}\n </BaseBox>\n );\n};\n\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderText","CardHeaderLink","CardHeaderIconButton","Card","_ref","children","_ref$surfaceLevel","surfaceLevel","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","styledProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","_objectSpread","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","borderRadius","onMouseEnter","isReactNative","MetaConstants","getStyledProps","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","useVerifyInsideCard","BaseBox","assignWithoutSideEffects","componentId"],"mappings":"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"}
1
+ {"version":3,"file":"Card.js","sources":["../../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport type { SpacingValueType } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { SurfaceLevels } from '~tokens/theme/theme';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\n\nexport const ComponentIds = {\n CardHeader: 'CardHeader',\n CardHeaderTrailing: 'CardHeaderTrailing',\n CardHeaderLeading: 'CardHeaderLeading',\n CardFooter: 'CardFooter',\n CardFooterTrailing: 'CardFooterTrailing',\n CardFooterLeading: 'CardFooterLeading',\n CardBody: 'CardBody',\n CardHeaderIcon: 'CardHeaderIcon',\n CardHeaderCounter: 'CardHeaderCounter',\n CardHeaderBadge: 'CardHeaderBadge',\n CardHeaderText: 'CardHeaderText',\n CardHeaderLink: 'CardHeaderLink',\n CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\nexport type CardProps = {\n /**\n * Card contents\n */\n children: React.ReactNode;\n /**\n * Sets the background color of the Card according to the surface level tokens\n *\n * eg: `theme.colors.surface.background.level1`\n *\n * @default `2`\n *\n * **Description:**\n *\n * - 2: Used in layouts which are on top of the main background\n * - 3: Used over the cards template or as a text input backgrounds.\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens\n */\n surfaceLevel?: Exclude<SurfaceLevels, 1>;\n /**\n * Sets the elevation for Cards\n *\n * eg: `theme.elevation.midRaised`\n *\n * @default `theme.elevation.lowRaised`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--page\n */\n elevation?: keyof Elevation;\n /**\n * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n * @default `spacing.7`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--page\n */\n padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.3' | 'spacing.5' | 'spacing.7'>;\n /**\n * Sets the width of the card\n */\n width?: BoxProps['width'];\n /**\n * Sets the height of the card\n */\n height?: BoxProps['height'];\n /**\n * Sets minimum height of the card\n */\n minHeight?: BoxProps['minHeight'];\n /**\n * Sets minimum width of the card\n */\n minWidth?: BoxProps['minWidth'];\n /**\n * If `true`, the card will be in selected state\n * Card will have a primary color border around it.\n *\n * @default false\n */\n\n isSelected?: boolean;\n /**\n * Makes the Card linkable by setting the `href` prop\n *\n * @default undefined\n */\n href?: string;\n /**\n * Sets the `target` attribute for the linkable card\n */\n target?: string;\n /**\n * Sets the `rel` attribute for the linkable card\n */\n rel?: string;\n /**\n * Sets the accessibility label for the card\n * This is useful when the card has an `href` or `onClick` prop\n * Setting this will announce the label when the card is focused\n */\n accessibilityLabel?: string;\n /**\n * If `true`, the card will scale up on hover\n *\n * On mobile devices it will scale down on press\n *\n * @default false\n */\n shouldScaleOnHover?: boolean;\n /**\n * Callback triggered when the card is hovered\n */\n onHover?: () => void;\n /**\n * Callback triggered when the card is clicked\n */\n onClick?: (\n event: Platform.Select<{\n web: React.MouseEvent;\n native: GestureResponderEvent;\n }>,\n ) => void;\n /**\n * Sets the HTML element for the Card\n *\n * When `as` is set to `label`, the card will be rendered as a label element\n * This can be used to create a custom checkbox or radio button using the card\n *\n * @default undefined\n */\n as?: 'label';\n} & TestID &\n StyledPropsBlade;\n\nconst Card = ({\n children,\n surfaceLevel = 2,\n elevation = 'lowRaised',\n testID,\n padding = 'spacing.7',\n width,\n height,\n minHeight,\n minWidth,\n onClick,\n isSelected = false,\n accessibilityLabel,\n shouldScaleOnHover = false,\n onHover,\n href,\n target,\n rel,\n as,\n ...styledProps\n}: CardProps): React.ReactElement => {\n const [isFocused, setIsFocused] = React.useState(false);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Card',\n allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n });\n\n const linkOverlayProps: LinkOverlayProps = {\n ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n onFocus: () => {\n setIsFocused(true);\n },\n onBlur: () => {\n setIsFocused(false);\n },\n };\n const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n return (\n <CardProvider>\n <CardRoot\n as={as}\n display={'block' as never}\n borderRadius=\"medium\"\n onMouseEnter={onHover as never}\n shouldScaleOnHover={shouldScaleOnHover}\n isSelected={isSelected}\n isFocused={isFocused}\n // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n onClick={isReactNative() ? onClick : undefined}\n width={width}\n height={height}\n minHeight={minHeight}\n minWidth={minWidth}\n href={href}\n accessibilityLabel={accessibilityLabel}\n {...metaAttribute({ name: MetaConstants.Card, testID })}\n {...getStyledProps(styledProps)}\n >\n <CardSurface\n height={height}\n minHeight={minHeight}\n padding={padding}\n borderRadius=\"medium\"\n surfaceLevel={surfaceLevel}\n elevation={elevation}\n textAlign={'left' as never}\n >\n {href ? (\n <LinkOverlay\n onClick={onClick}\n href={href}\n target={target}\n rel={rel ?? defaultRel}\n {...linkOverlayProps}\n />\n ) : null}\n {!href && onClick ? (\n <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n ) : null}\n {children}\n </CardSurface>\n </CardRoot>\n </CardProvider>\n );\n};\n\ntype CardBodyProps = {\n children: React.ReactNode;\n height?: BoxProps['height'];\n} & TestID;\n\nconst _CardBody = ({ height, children, testID }: CardBodyProps): React.ReactElement => {\n useVerifyInsideCard('CardBody');\n\n return (\n <BaseBox {...metaAttribute({ name: MetaConstants.CardBody, testID })} height={height}>\n {children}\n </BaseBox>\n );\n};\n\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderText","CardHeaderLink","CardHeaderIconButton","Card","_ref","children","_ref$surfaceLevel","surfaceLevel","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","styledProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","_objectSpread","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","borderRadius","onMouseEnter","isReactNative","MetaConstants","getStyledProps","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","useVerifyInsideCard","BaseBox","assignWithoutSideEffects","componentId"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Card.js","sources":["../../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport type { SpacingValueType } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { SurfaceLevels } from '~tokens/theme/theme';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport { isReactNative } from '~utils';\n\nexport const ComponentIds = {\n CardHeader: 'CardHeader',\n CardHeaderTrailing: 'CardHeaderTrailing',\n CardHeaderLeading: 'CardHeaderLeading',\n CardFooter: 'CardFooter',\n CardFooterTrailing: 'CardFooterTrailing',\n CardFooterLeading: 'CardFooterLeading',\n CardBody: 'CardBody',\n CardHeaderIcon: 'CardHeaderIcon',\n CardHeaderCounter: 'CardHeaderCounter',\n CardHeaderBadge: 'CardHeaderBadge',\n CardHeaderText: 'CardHeaderText',\n CardHeaderLink: 'CardHeaderLink',\n CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\nexport type CardProps = {\n /**\n * Card contents\n */\n children: React.ReactNode;\n /**\n * Sets the background color of the Card according to the surface level tokens\n *\n * eg: `theme.colors.surface.background.level1`\n *\n * @default `2`\n *\n * **Description:**\n *\n * - 2: Used in layouts which are on top of the main background\n * - 3: Used over the cards template or as a text input backgrounds.\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens\n */\n surfaceLevel?: Exclude<SurfaceLevels, 1>;\n /**\n * Sets the elevation for Cards\n *\n * eg: `theme.elevation.midRaised`\n *\n * @default `theme.elevation.lowRaised`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--page\n */\n elevation?: keyof Elevation;\n /**\n * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n * @default `spacing.7`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--page\n */\n padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.3' | 'spacing.5' | 'spacing.7'>;\n /**\n * Sets the width of the card\n */\n width?: BoxProps['width'];\n /**\n * Sets the height of the card\n */\n height?: BoxProps['height'];\n /**\n * Sets minimum height of the card\n */\n minHeight?: BoxProps['minHeight'];\n /**\n * Sets minimum width of the card\n */\n minWidth?: BoxProps['minWidth'];\n /**\n * If `true`, the card will be in selected state\n * Card will have a primary color border around it.\n *\n * @default false\n */\n\n isSelected?: boolean;\n /**\n * Makes the Card linkable by setting the `href` prop\n *\n * @default undefined\n */\n href?: string;\n /**\n * Sets the `target` attribute for the linkable card\n */\n target?: string;\n /**\n * Sets the `rel` attribute for the linkable card\n */\n rel?: string;\n /**\n * Sets the accessibility label for the card\n * This is useful when the card has an `href` or `onClick` prop\n * Setting this will announce the label when the card is focused\n */\n accessibilityLabel?: string;\n /**\n * If `true`, the card will scale up on hover\n *\n * On mobile devices it will scale down on press\n *\n * @default false\n */\n shouldScaleOnHover?: boolean;\n /**\n * Callback triggered when the card is hovered\n */\n onHover?: () => void;\n /**\n * Callback triggered when the card is clicked\n */\n onClick?: () => void;\n /**\n * Sets the HTML element for the Card\n *\n * When `as` is set to `label`, the card will be rendered as a label element\n * This can be used to create a custom checkbox or radio button using the card\n *\n * @default undefined\n */\n as?: 'label';\n} & TestID &\n StyledPropsBlade;\n\nconst Card = ({\n children,\n surfaceLevel = 2,\n elevation = 'lowRaised',\n testID,\n padding = 'spacing.7',\n width,\n height,\n minHeight,\n minWidth,\n onClick,\n isSelected = false,\n accessibilityLabel,\n shouldScaleOnHover = false,\n onHover,\n href,\n target,\n rel,\n as,\n ...styledProps\n}: CardProps): React.ReactElement => {\n const [isFocused, setIsFocused] = React.useState(false);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Card',\n allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n });\n\n const linkOverlayProps: LinkOverlayProps = {\n ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n onFocus: () => {\n setIsFocused(true);\n },\n onBlur: () => {\n setIsFocused(false);\n },\n };\n const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n return (\n <CardProvider>\n <CardRoot\n as={as}\n display={'block' as never}\n borderRadius=\"medium\"\n onMouseEnter={onHover as never}\n shouldScaleOnHover={shouldScaleOnHover}\n isSelected={isSelected}\n isFocused={isFocused}\n // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n onClick={isReactNative() ? onClick : undefined}\n width={width}\n height={height}\n minHeight={minHeight}\n minWidth={minWidth}\n href={href}\n accessibilityLabel={accessibilityLabel}\n {...metaAttribute({ name: MetaConstants.Card, testID })}\n {...getStyledProps(styledProps)}\n >\n <CardSurface\n height={height}\n minHeight={minHeight}\n padding={padding}\n borderRadius=\"medium\"\n surfaceLevel={surfaceLevel}\n elevation={elevation}\n textAlign={'left' as never}\n >\n {href ? (\n <LinkOverlay\n onClick={onClick}\n href={href}\n target={target}\n rel={rel ?? defaultRel}\n {...linkOverlayProps}\n />\n ) : null}\n {!href && onClick ? (\n <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n ) : null}\n {children}\n </CardSurface>\n </CardRoot>\n </CardProvider>\n );\n};\n\ntype CardBodyProps = {\n children: React.ReactNode;\n height?: BoxProps['height'];\n} & TestID;\n\nconst _CardBody = ({ height, children, testID }: CardBodyProps): React.ReactElement => {\n useVerifyInsideCard('CardBody');\n\n return (\n <BaseBox {...metaAttribute({ name: MetaConstants.CardBody, testID })} height={height}>\n {children}\n </BaseBox>\n );\n};\n\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderText","CardHeaderLink","CardHeaderIconButton","Card","_ref","children","_ref$surfaceLevel","surfaceLevel","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","styledProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","_objectSpread","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","borderRadius","onMouseEnter","isReactNative","MetaConstants","getStyledProps","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","useVerifyInsideCard","BaseBox","assignWithoutSideEffects","componentId"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBO,IAAMA,YAAY,GAAG;AAC1BC,EAAAA,UAAU,EAAE,YAAY;AACxBC,EAAAA,kBAAkB,EAAE,oBAAoB;AACxCC,EAAAA,iBAAiB,EAAE,mBAAmB;AACtCC,EAAAA,UAAU,EAAE,YAAY;AACxBC,EAAAA,kBAAkB,EAAE,oBAAoB;AACxCC,EAAAA,iBAAiB,EAAE,mBAAmB;AACtCC,EAAAA,QAAQ,EAAE,UAAU;AACpBC,EAAAA,cAAc,EAAE,gBAAgB;AAChCC,EAAAA,iBAAiB,EAAE,mBAAmB;AACtCC,EAAAA,eAAe,EAAE,iBAAiB;AAClCC,EAAAA,cAAc,EAAE,gBAAgB;AAChCC,EAAAA,cAAc,EAAE,gBAAgB;AAChCC,EAAAA,oBAAoB,EAAE,sBAAA;AACxB,EAAC;AAkHD,IAAMC,IAAI,GAAG,SAAPA,IAAIA,CAAAC,IAAA,EAoB2B;AAAA,EAAA,IAnBnCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,iBAAA,GAAAF,IAAA,CACRG,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAG,KAAA,CAAA,GAAA,CAAC,GAAAA,iBAAA;IAAAE,cAAA,GAAAJ,IAAA,CAChBK,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,WAAW,GAAAA,cAAA;IACvBE,MAAM,GAAAN,IAAA,CAANM,MAAM;IAAAC,YAAA,GAAAP,IAAA,CACNQ,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAG,KAAA,CAAA,GAAA,WAAW,GAAAA,YAAA;IACrBE,KAAK,GAAAT,IAAA,CAALS,KAAK;IACLC,MAAM,GAAAV,IAAA,CAANU,MAAM;IACNC,SAAS,GAAAX,IAAA,CAATW,SAAS;IACTC,QAAQ,GAAAZ,IAAA,CAARY,QAAQ;IACRC,OAAO,GAAAb,IAAA,CAAPa,OAAO;IAAAC,eAAA,GAAAd,IAAA,CACPe,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAClBE,kBAAkB,GAAAhB,IAAA,CAAlBgB,kBAAkB;IAAAC,qBAAA,GAAAjB,IAAA,CAClBkB,kBAAkB;AAAlBA,IAAAA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,qBAAA;IAC1BE,OAAO,GAAAnB,IAAA,CAAPmB,OAAO;IACPC,IAAI,GAAApB,IAAA,CAAJoB,IAAI;IACJC,MAAM,GAAArB,IAAA,CAANqB,MAAM;IACNC,GAAG,GAAAtB,IAAA,CAAHsB,GAAG;IACHC,EAAE,GAAAvB,IAAA,CAAFuB,EAAE;AACCC,IAAAA,WAAW,GAAAC,wBAAA,CAAAzB,IAAA,EAAA0B,SAAA,CAAA,CAAA;AAEd,EAAA,IAAAC,eAAA,GAAkCC,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAJ,eAAA,EAAA,CAAA,CAAA;AAAhDK,IAAAA,SAAS,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,YAAY,GAAAH,gBAAA,CAAA,CAAA,CAAA,CAAA;AAE9BI,EAAAA,wBAAwB,CAAC;AACvBjC,IAAAA,QAAQ,EAARA,QAAQ;AACRkC,IAAAA,aAAa,EAAE,MAAM;AACrBC,IAAAA,iBAAiB,EAAE,CAACnD,YAAY,CAACC,UAAU,EAAED,YAAY,CAACO,QAAQ,EAAEP,YAAY,CAACI,UAAU,CAAA;AAC7F,GAAC,CAAC,CAAA;EAEF,IAAMgD,gBAAkC,GAAAC,aAAA,CAAAA,aAAA,CAAAA,aAAA,CACnCC,EAAAA,EAAAA,aAAa,CAAC;AAAEC,IAAAA,IAAI,EAAEC,oBAAAA;GAAsB,CAAC,CAC7CC,EAAAA,cAAc,CAAC;AAAEC,IAAAA,KAAK,EAAE3B,kBAAkB;AAAE4B,IAAAA,OAAO,EAAE7B,UAAAA;AAAW,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;IACrE8B,OAAO,EAAE,SAAAA,OAAAA,GAAM;MACbZ,YAAY,CAAC,IAAI,CAAC,CAAA;KACnB;IACDa,MAAM,EAAE,SAAAA,MAAAA,GAAM;MACZb,YAAY,CAAC,KAAK,CAAC,CAAA;AACrB,KAAA;GACD,CAAA,CAAA;EACD,IAAMc,UAAU,GAAG1B,MAAM,IAAIA,MAAM,KAAK,QAAQ,GAAG,qBAAqB,GAAG2B,SAAS,CAAA;EAEpF,oBACEC,GAAA,CAACC,YAAY,EAAA;IAAAjD,QAAA,eACXgD,GAAA,CAACE,QAAQ,EAAAb,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAA;AACPf,MAAAA,EAAE,EAAEA,EAAG;AACP6B,MAAAA,OAAO,EAAE,OAAiB;AAC1BC,MAAAA,YAAY,EAAC,QAAQ;AACrBC,MAAAA,YAAY,EAAEnC,OAAiB;AAC/BD,MAAAA,kBAAkB,EAAEA,kBAAmB;AACvCH,MAAAA,UAAU,EAAEA,UAAW;AACvBiB,MAAAA,SAAS,EAAEA,SAAAA;AACX;AAAA;AACAnB,MAAAA,OAAO,EAAE0C,aAAa,EAAE,GAAG1C,OAAO,GAAGmC,SAAU;AAC/CvC,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,MAAM,EAAEA,MAAO;AACfC,MAAAA,SAAS,EAAEA,SAAU;AACrBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBQ,MAAAA,IAAI,EAAEA,IAAK;AACXJ,MAAAA,kBAAkB,EAAEA,kBAAAA;AAAmB,KAAA,EACnCuB,aAAa,CAAC;MAAEC,IAAI,EAAEgB,aAAa,CAACzD,IAAI;AAAEO,MAAAA,MAAM,EAANA,MAAAA;AAAO,KAAC,CAAC,CAAA,EACnDmD,cAAc,CAACjC,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;MAAAvB,QAAA,eAE/ByD,IAAA,CAACC,WAAW,EAAA;AACVjD,QAAAA,MAAM,EAAEA,MAAO;AACfC,QAAAA,SAAS,EAAEA,SAAU;AACrBH,QAAAA,OAAO,EAAEA,OAAQ;AACjB6C,QAAAA,YAAY,EAAC,QAAQ;AACrBlD,QAAAA,YAAY,EAAEA,YAAa;AAC3BE,QAAAA,SAAS,EAAEA,SAAU;AACrBuD,QAAAA,SAAS,EAAE,MAAgB;AAAA3D,QAAAA,QAAA,GAE1BmB,IAAI,gBACH6B,GAAA,CAACY,WAAW,EAAAvB,aAAA,CAAA;AACVzB,UAAAA,OAAO,EAAEA,OAAQ;AACjBO,UAAAA,IAAI,EAAEA,IAAK;AACXC,UAAAA,MAAM,EAAEA,MAAO;AACfC,UAAAA,GAAG,EAAEA,GAAG,KAAA,IAAA,IAAHA,GAAG,KAAA,KAAA,CAAA,GAAHA,GAAG,GAAIyB,UAAAA;AAAW,SAAA,EACnBV,gBAAgB,CACrB,CAAC,GACA,IAAI,EACP,CAACjB,IAAI,IAAIP,OAAO,gBACfoC,GAAA,CAACY,WAAW,EAAAvB,aAAA,CAAA;AAACf,UAAAA,EAAE,EAAC,QAAQ;AAACV,UAAAA,OAAO,EAAEA,OAAAA;AAAQ,SAAA,EAAKwB,gBAAgB,CAAG,CAAC,GACjE,IAAI,EACPpC,QAAQ,CAAA;OACE,CAAA;KACL,CAAA,CAAA;AAAC,GACC,CAAC,CAAA;AAEnB,EAAC;AAOD,IAAM6D,SAAS,GAAG,SAAZA,SAASA,CAAAC,KAAA,EAAwE;AAAA,EAAA,IAAlErD,MAAM,GAAAqD,KAAA,CAANrD,MAAM;IAAET,QAAQ,GAAA8D,KAAA,CAAR9D,QAAQ;IAAEK,MAAM,GAAAyD,KAAA,CAANzD,MAAM,CAAA;EAC3C0D,mBAAmB,CAAC,UAAU,CAAC,CAAA;EAE/B,oBACEf,GAAA,CAACgB,OAAO,EAAA3B,aAAA,CAAAA,aAAA,CAAKC,EAAAA,EAAAA,aAAa,CAAC;IAAEC,IAAI,EAAEgB,aAAa,CAAChE,QAAQ;AAAEc,IAAAA,MAAM,EAANA,MAAAA;AAAO,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AAAEI,IAAAA,MAAM,EAAEA,MAAO;AAAAT,IAAAA,QAAA,EAClFA,QAAAA;AAAQ,GAAA,CACF,CAAC,CAAA;AAEd,CAAC,CAAA;AAED,IAAMT,QAAQ,gBAAG0E,wBAAwB,CAACJ,SAAS,EAAE;EAAEK,WAAW,EAAElF,YAAY,CAACO,QAAAA;AAAS,CAAC;;;;"}
1
+ {"version":3,"file":"Card.js","sources":["../../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport type { SpacingValueType } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { SurfaceLevels } from '~tokens/theme/theme';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\n\nexport const ComponentIds = {\n CardHeader: 'CardHeader',\n CardHeaderTrailing: 'CardHeaderTrailing',\n CardHeaderLeading: 'CardHeaderLeading',\n CardFooter: 'CardFooter',\n CardFooterTrailing: 'CardFooterTrailing',\n CardFooterLeading: 'CardFooterLeading',\n CardBody: 'CardBody',\n CardHeaderIcon: 'CardHeaderIcon',\n CardHeaderCounter: 'CardHeaderCounter',\n CardHeaderBadge: 'CardHeaderBadge',\n CardHeaderText: 'CardHeaderText',\n CardHeaderLink: 'CardHeaderLink',\n CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\nexport type CardProps = {\n /**\n * Card contents\n */\n children: React.ReactNode;\n /**\n * Sets the background color of the Card according to the surface level tokens\n *\n * eg: `theme.colors.surface.background.level1`\n *\n * @default `2`\n *\n * **Description:**\n *\n * - 2: Used in layouts which are on top of the main background\n * - 3: Used over the cards template or as a text input backgrounds.\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-colors--page#-theme-tokens\n */\n surfaceLevel?: Exclude<SurfaceLevels, 1>;\n /**\n * Sets the elevation for Cards\n *\n * eg: `theme.elevation.midRaised`\n *\n * @default `theme.elevation.lowRaised`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--page\n */\n elevation?: keyof Elevation;\n /**\n * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n * @default `spacing.7`\n *\n * **Links:**\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--page\n */\n padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.3' | 'spacing.5' | 'spacing.7'>;\n /**\n * Sets the width of the card\n */\n width?: BoxProps['width'];\n /**\n * Sets the height of the card\n */\n height?: BoxProps['height'];\n /**\n * Sets minimum height of the card\n */\n minHeight?: BoxProps['minHeight'];\n /**\n * Sets minimum width of the card\n */\n minWidth?: BoxProps['minWidth'];\n /**\n * If `true`, the card will be in selected state\n * Card will have a primary color border around it.\n *\n * @default false\n */\n\n isSelected?: boolean;\n /**\n * Makes the Card linkable by setting the `href` prop\n *\n * @default undefined\n */\n href?: string;\n /**\n * Sets the `target` attribute for the linkable card\n */\n target?: string;\n /**\n * Sets the `rel` attribute for the linkable card\n */\n rel?: string;\n /**\n * Sets the accessibility label for the card\n * This is useful when the card has an `href` or `onClick` prop\n * Setting this will announce the label when the card is focused\n */\n accessibilityLabel?: string;\n /**\n * If `true`, the card will scale up on hover\n *\n * On mobile devices it will scale down on press\n *\n * @default false\n */\n shouldScaleOnHover?: boolean;\n /**\n * Callback triggered when the card is hovered\n */\n onHover?: () => void;\n /**\n * Callback triggered when the card is clicked\n */\n onClick?: (\n event: Platform.Select<{\n web: React.MouseEvent;\n native: GestureResponderEvent;\n }>,\n ) => void;\n /**\n * Sets the HTML element for the Card\n *\n * When `as` is set to `label`, the card will be rendered as a label element\n * This can be used to create a custom checkbox or radio button using the card\n *\n * @default undefined\n */\n as?: 'label';\n} & TestID &\n StyledPropsBlade;\n\nconst Card = ({\n children,\n surfaceLevel = 2,\n elevation = 'lowRaised',\n testID,\n padding = 'spacing.7',\n width,\n height,\n minHeight,\n minWidth,\n onClick,\n isSelected = false,\n accessibilityLabel,\n shouldScaleOnHover = false,\n onHover,\n href,\n target,\n rel,\n as,\n ...styledProps\n}: CardProps): React.ReactElement => {\n const [isFocused, setIsFocused] = React.useState(false);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Card',\n allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n });\n\n const linkOverlayProps: LinkOverlayProps = {\n ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n onFocus: () => {\n setIsFocused(true);\n },\n onBlur: () => {\n setIsFocused(false);\n },\n };\n const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n return (\n <CardProvider>\n <CardRoot\n as={as}\n display={'block' as never}\n borderRadius=\"medium\"\n onMouseEnter={onHover as never}\n shouldScaleOnHover={shouldScaleOnHover}\n isSelected={isSelected}\n isFocused={isFocused}\n // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n onClick={isReactNative() ? onClick : undefined}\n width={width}\n height={height}\n minHeight={minHeight}\n minWidth={minWidth}\n href={href}\n accessibilityLabel={accessibilityLabel}\n {...metaAttribute({ name: MetaConstants.Card, testID })}\n {...getStyledProps(styledProps)}\n >\n <CardSurface\n height={height}\n minHeight={minHeight}\n padding={padding}\n borderRadius=\"medium\"\n surfaceLevel={surfaceLevel}\n elevation={elevation}\n textAlign={'left' as never}\n >\n {href ? (\n <LinkOverlay\n onClick={onClick}\n href={href}\n target={target}\n rel={rel ?? defaultRel}\n {...linkOverlayProps}\n />\n ) : null}\n {!href && onClick ? (\n <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n ) : null}\n {children}\n </CardSurface>\n </CardRoot>\n </CardProvider>\n );\n};\n\ntype CardBodyProps = {\n children: React.ReactNode;\n height?: BoxProps['height'];\n} & TestID;\n\nconst _CardBody = ({ height, children, testID }: CardBodyProps): React.ReactElement => {\n useVerifyInsideCard('CardBody');\n\n return (\n <BaseBox {...metaAttribute({ name: MetaConstants.CardBody, testID })} height={height}>\n {children}\n </BaseBox>\n );\n};\n\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderText","CardHeaderLink","CardHeaderIconButton","Card","_ref","children","_ref$surfaceLevel","surfaceLevel","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","styledProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","_objectSpread","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","borderRadius","onMouseEnter","isReactNative","MetaConstants","getStyledProps","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","useVerifyInsideCard","BaseBox","assignWithoutSideEffects","componentId"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import * as React$1 from 'react';
3
3
  import React__default, { ReactNode, ReactElement, ReactChild, SyntheticEvent, KeyboardEvent } from 'react';
4
- import { View, ViewStyle, AccessibilityRole, GestureResponderEvent } from 'react-native';
4
+ import { View, ViewStyle, GestureResponderEvent, AccessibilityRole } from 'react-native';
5
5
  import * as styled_components from 'styled-components';
6
6
  import { CSSObject } from 'styled-components';
7
7
  import * as csstype from 'csstype';
@@ -2879,7 +2879,10 @@ type CardProps = {
2879
2879
  /**
2880
2880
  * Callback triggered when the card is clicked
2881
2881
  */
2882
- onClick?: () => void;
2882
+ onClick?: (event: Platform.Select<{
2883
+ web: React__default.MouseEvent;
2884
+ native: GestureResponderEvent;
2885
+ }>) => void;
2883
2886
  /**
2884
2887
  * Sets the HTML element for the Card
2885
2888
  *
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import * as React$1 from 'react';
3
3
  import React__default, { ReactNode, ReactElement, ReactChild, SyntheticEvent, KeyboardEvent } from 'react';
4
- import { View, ViewStyle, ImageSourcePropType, AccessibilityRole, GestureResponderEvent, PressableProps } from 'react-native';
4
+ import { View, ViewStyle, ImageSourcePropType, GestureResponderEvent, AccessibilityRole, PressableProps } from 'react-native';
5
5
  import { CSSObject } from 'styled-components';
6
6
  import * as react_native_types from 'react-native/types';
7
7
  import { ReactDOMAttributes } from '@use-gesture/react/dist/declarations/src/types';
@@ -2691,7 +2691,10 @@ type CardProps = {
2691
2691
  /**
2692
2692
  * Callback triggered when the card is clicked
2693
2693
  */
2694
- onClick?: () => void;
2694
+ onClick?: (event: Platform.Select<{
2695
+ web: React__default.MouseEvent;
2696
+ native: GestureResponderEvent;
2697
+ }>) => void;
2695
2698
  /**
2696
2699
  * Sets the HTML element for the Card
2697
2700
  *
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@razorpay/blade",
3
3
  "description": "The Design System that powers Razorpay",
4
- "version": "10.23.4",
4
+ "version": "10.23.5",
5
5
  "license": "MIT",
6
6
  "engines": {
7
7
  "node": ">=18.12.1"