@purpurds/promotion-card 5.24.1 → 5.24.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@purpurds/promotion-card",
-  "version": "5.24.1",
+  "version": "5.24.3",
   "license": "AGPL-3.0-only",
   "main": "./dist/promotion-card.cjs.js",
   "types": "./dist/promotion-card.d.ts",
@@ -16,13 +16,13 @@
   "source": "src/promotion-card.tsx",
   "dependencies": {
     "classnames": "~2.5.0",
-    "@purpurds/badge": "5.24.1",
-    "@purpurds/card": "5.24.1",
-    "@purpurds/button": "5.24.1",
-    "@purpurds/cta-link": "5.24.1",
-    "@purpurds/tokens": "5.24.1",
-    "@purpurds/icon": "5.24.1",
-    "@purpurds/heading": "5.24.1"
+    "@purpurds/button": "5.24.3",
+    "@purpurds/card": "5.24.3",
+    "@purpurds/heading": "5.24.3",
+    "@purpurds/badge": "5.24.3",
+    "@purpurds/cta-link": "5.24.3",
+    "@purpurds/tokens": "5.24.3",
+    "@purpurds/icon": "5.24.3"
   },
   "devDependencies": {
     "@rushstack/eslint-patch": "~1.10.0",
@@ -46,10 +46,10 @@
     "typescript": "^5.6.3",
     "vite": "5.4.8",
     "vitest": "^2.1.2",
-    "@purpurds/component-rig": "1.0.0",
-    "@purpurds/paragraph": "5.24.1",
-    "@purpurds/text-spacing": "5.24.1",
-    "@purpurds/grid": "5.24.1"
+    "@purpurds/paragraph": "5.24.3",
+    "@purpurds/text-spacing": "5.24.3",
+    "@purpurds/grid": "5.24.3",
+    "@purpurds/component-rig": "1.0.0"
   },
   "scripts": {
     "build:dev": "vite",

package/src/promotion-card.module.scss

@@ -1,4 +1,4 @@
-@import "@purpurds/tokens/breakpoint/variables";
+@use "@purpurds/tokens/breakpoint/variables" as *;
 
 .purpur-promotion-card {
   $root: &;

package/src/promotion-card.tsx

@@ -8,7 +8,7 @@ import React, {
 import { Badge } from "@purpurds/badge";
 import { type ButtonProps, Button } from "@purpurds/button";
 import { Card } from "@purpurds/card";
-import { type CtaLinkProps, CtaLink } from "@purpurds/cta-link";
+import { CtaAnchorProps, CtaLink } from "@purpurds/cta-link";
 import { Heading, HeadingTagType, TitleVariantType } from "@purpurds/heading";
 import c from "classnames/bind";
 
@@ -41,9 +41,7 @@ const colors: StyleRecord = {
 type DecorativeImage = { decorativeImage?: ReactNode; hasGradient?: boolean };
 type ProductImage = { productImage?: ReactNode; hasGradient?: never };
 
-type ButtonPropsWithoutChildren = Omit<ButtonProps, "children">;
-type CtaLinkPropsWithoutChildren = Omit<CtaLinkProps, "children">;
-type Action = { label: string } & (ButtonPropsWithoutChildren | CtaLinkPropsWithoutChildren);
+type Action = { label: string } & Omit<ButtonProps | CtaAnchorProps, "children">;
 
 export type PromotionCardProps = {
   ["data-testid"]?: string;
@@ -156,29 +154,22 @@ const PromotionCardComponent = (
               <div className={cx(`${rootClassName}__child-content`)}>{children}</div>
               {actions && actions.length > 0 && (
                 <div className={cx(`${rootClassName}__actions`)}>
-                  {actions.map(({ label, variant, iconOnly = undefined, ...rest }, index) =>
-                    isCtaLinkProps(rest) ? (
-                      <CtaLink
-                        iconOnly={iconOnly}
-                        variant={variant ?? index === 0 ? "primary" : "secondary"}
-                        key={label}
-                        negative={variant === "primary"}
-                        {...rest}
-                      >
-                        {label}
-                      </CtaLink>
-                    ) : (
-                      <Button
-                        iconOnly={iconOnly}
-                        variant={variant ?? index === 0 ? "primary" : "secondary"}
-                        key={label}
-                        negative={variant === "primary"}
-                        {...rest}
-                      >
-                        {label}
-                      </Button>
-                    )
-                  )}
+                  {actions.map(({ label, variant: variantOverride, ...rest }, index) => {
+                    const actionVariant = variantOverride ?? index === 0 ? "primary" : "secondary";
+                    const props = {
+                      variant: actionVariant,
+                      negative: variant === "primary",
+                      ...rest,
+                      children: label,
+                    };
+                    if (isValidAnchor(props)) {
+                      return <CtaLink key={label} {...props} />;
+                    } else if (isValidButton(props)) {
+                      return <Button key={label} {...props} />;
+                    } else {
+                      return null;
+                    }
+                  })}
                 </div>
               )}
             </div>
@@ -209,11 +200,12 @@ const PromotionCardComponent = (
   );
 };
 
-const isCtaLinkProps = (
-  action: Omit<CtaLinkPropsWithoutChildren | ButtonPropsWithoutChildren, "variant">
-): action is Omit<CtaLinkPropsWithoutChildren, "variant"> => {
+const isValidAnchor = (action: object): action is CtaAnchorProps => {
   return "href" in action;
 };
+const isValidButton = (action: object): action is ButtonProps => {
+  return "onClick" in action;
+};
 
 export const PromotionCard = forwardRef(PromotionCardComponent);
 PromotionCard.displayName = "PromotionCard";