@razorpay/blade 10.4.2 → 10.4.3

package/build/components/index.development.web.js

@@ -17436,7 +17436,7 @@ var LinkOverlay = /*#__PURE__*/styled.a.withConfig({
       position: 'absolute',
       top: 0,
       left: 0,
-      zIndex: 0,
+      zIndex: 1,
       width: '100%',
       height: '100%'
     }
@@ -17446,6 +17446,7 @@ var LinkOverlay = /*#__PURE__*/styled.a.withConfig({
 // used for interactive card scale down animation
 var CARD_SCALE_DOWN_VALUE = 0.95;
 var CARD_SCALE_UP_VALUE = 1.05;
+var CARD_LINK_OVERLAY_ID = 'card-link-overlay';
 
 var useIsMobile = function useIsMobile() {
   var _useTheme = useTheme(),
@@ -17464,6 +17465,7 @@ var StyledCardRoot = /*#__PURE__*/styled(BaseBox).withConfig({
   displayName: "CardRootweb__StyledCardRoot",
   componentId: "sc-1nb70ck-0"
 })(function (_ref) {
+  var _objectSpread2;
   var theme = _ref.theme,
     isSelected = _ref.isSelected,
     isFocused = _ref.isFocused,
@@ -17486,14 +17488,13 @@ var StyledCardRoot = /*#__PURE__*/styled(BaseBox).withConfig({
     '&:hover': {
       transform: "scale(".concat(CARD_SCALE_UP_VALUE, ")")
     }
-  }), {}, {
-    // uplift all the nested links so they receive clicks and events (except the LinkOverlay)
-    // https://www.sarasoueidan.com/blog/nested-links
-    '& a[href]:not(a[data-blade-component="card-link-overlay"])': {
-      zIndex: 1,
-      position: 'relative'
-    }
-  });
+  }), {}, (_objectSpread2 = {}, _defineProperty$1(_objectSpread2, "& a[href]:not(a[data-blade-component=\"".concat(CARD_LINK_OVERLAY_ID, "\"])"), {
+    zIndex: 2,
+    position: 'relative'
+  }), _defineProperty$1(_objectSpread2, "& button:not(button[data-blade-component=\"".concat(CARD_LINK_OVERLAY_ID, "\"])"), {
+    zIndex: 2,
+    position: 'relative'
+  }), _objectSpread2));
 });
 var CardRoot = function CardRoot(_ref2) {
   var as = _ref2.as,
@@ -17509,7 +17510,7 @@ var CardRoot = function CardRoot(_ref2) {
     as: as
   }, props), {}, {
     isMobile: isMobile,
-    isPressed: isPressed,
+    isPressed: props.shouldScaleOnHover ? isPressed : false,
     onTouchStart: function onTouchStart() {
       return setIsPressed(true);
     },
@@ -17576,7 +17577,7 @@ var Card = function Card(_ref) {
     setIsFocused = _React$useState2[1];
   useVerifyAllowedComponents(children, 'Card', [ComponentIds$1.CardHeader, ComponentIds$1.CardBody, ComponentIds$1.CardFooter]);
   var linkOverlayProps = _objectSpread$1c(_objectSpread$1c(_objectSpread$1c({}, metaAttribute({
-    name: 'card-link-overlay'
+    name: CARD_LINK_OVERLAY_ID
   })), makeAccessible({
     label: accessibilityLabel,
     pressed: isSelected