@vkzstudio/muza-ui 1.6.0 → 1.8.0

package/dist/components/PartnerCard/PartnerCard.js

@@ -1,36 +1,56 @@
-import { jsx as e, jsxs as r, Fragment as R } from "react/jsx-runtime";
-import * as w from "react";
-import { Slot as pe } from "@radix-ui/react-slot";
-import { cva as Z } from "class-variance-authority";
-import { useMuzaTranslationContext as he } from "../../translations/TranslationContext.js";
+import { jsx as e, jsxs as r, Fragment as S } from "react/jsx-runtime";
+import * as z from "react";
+import { Slot as we } from "@radix-ui/react-slot";
+import { cva as le } from "class-variance-authority";
+import { useMuzaTranslationContext as Ne } from "../../translations/TranslationContext.js";
 import { cn as n } from "../../utils/cn.js";
-import { disabledLinkProps as X } from "../../utils/disabledLinkProps.js";
-import { Button as ue } from "../Button/Button.js";
-import { CategoryIcon as ge } from "../CategoryIcon/CategoryIcon.js";
-import { DotDivider as fe } from "../DotDivider/DotDivider.js";
+import { disabledLinkProps as te } from "../../utils/disabledLinkProps.js";
+import { Button as ke } from "../Button/Button.js";
+import { CategoryIcon as Ce } from "../CategoryIcon/CategoryIcon.js";
+import { DotDivider as se } from "../DotDivider/DotDivider.js";
 import { Flex as m } from "../Flex/Flex.js";
-import { HeartButton as ve } from "../HeartButton/HeartButton.js";
-import { MapBold as be } from "@solar-icons/react-perf";
-import { Rating as we } from "../Rating/Rating.js";
-import { Skeleton as d } from "../Skeleton/Skeleton.js";
-import { Tag as T } from "../Tag/Tag.js";
-import { Typography as f } from "../Typography/Typography.js";
-const xe = Z(
+import { HeartButton as ye } from "../HeartButton/HeartButton.js";
+import { MapBold as ze } from "@solar-icons/react-perf";
+import { Rating as Te } from "../Rating/Rating.js";
+import { Skeleton as c } from "../Skeleton/Skeleton.js";
+import { Tag as I } from "../Tag/Tag.js";
+import { Typography as x } from "../Typography/Typography.js";
+import { cardCompactFillClass as ie, cardCompactContainerClass as Le, CardCompactShell as Re, CardCompactSkeleton as Se } from "../internal/CardCompactShell.js";
+import { CardImageSlot as K, hasImageContent as Pe } from "../internal/CardImageSlot.js";
+const Ve = le(
   "group relative inline-flex border border-solid transition-colors focus-visible:outline-none data-[disabled=true]:pointer-events-none",
   {
     variants: {
       variant: {
+        compact: Le,
         search: "w-full flex-row gap-comp-partner-card-search-gap border-transparent",
         heroLarge: "h-full w-full flex-col justify-end gap-comp-partner-card-hero-large-gap overflow-hidden rounded-comp-partner-card-hero-large-radius border-transparent p-comp-partner-card-hero-large-p focus-visible:border-stroke-brand-focused",
         heroSmall: "h-full w-full flex-col justify-end gap-comp-partner-card-hero-sm-gap overflow-hidden rounded-comp-partner-card-hero-sm-radius border-transparent p-comp-partner-card-hero-sm-p focus-visible:border-stroke-brand-focused",
         listView: "w-full flex-row gap-comp-partner-card-list-view-gap border-transparent"
+      },
+      isTinted: {
+        true: "",
+        false: ""
       }
     },
-    defaultVariants: { variant: "search" }
+    compoundVariants: [
+      {
+        variant: "compact",
+        isTinted: !1,
+        class: ie.default
+      },
+      {
+        variant: "compact",
+        isTinted: !0,
+        class: ie.tinted
+      }
+    ],
+    defaultVariants: { variant: "search", isTinted: !1 }
   }
-), Ne = Z("", {
+), Ie = le("", {
   variants: {
     variant: {
+      compact: "text-text-dark-primary-def group-has-[a:focus-visible]:text-text-brand-focused group-has-[a:hover]:text-text-brand-hover group-data-[disabled=true]:text-text-dark-disabled",
       search: "text-text-dark-primary-def group-has-[a:focus-visible]:text-text-brand-focused group-has-[a:hover]:text-text-brand-hover group-data-[disabled=true]:text-text-dark-disabled",
       heroLarge: "text-text-invert-fixed group-data-[disabled=true]:text-text-dark-disabled",
       heroSmall: "text-text-invert-fixed group-data-[disabled=true]:text-text-dark-disabled",
@@ -38,10 +58,10 @@ const xe = Z(
     }
   },
   defaultVariants: { variant: "search" }
-}), D = ({ rating: t, ratingCount: a, disabled: i }) => /* @__PURE__ */ r(m, { align: "center", gap: "xs", children: [
-  /* @__PURE__ */ e(we, { value: t, allowHalf: !0, disabled: i }),
+}), P = ({ rating: s, ratingCount: a, disabled: d }) => /* @__PURE__ */ r(m, { align: "center", gap: "xs", children: [
+  /* @__PURE__ */ e(Te, { value: s, allowHalf: !0, disabled: d }),
   a != null && /* @__PURE__ */ r(
-    f,
+    x,
     {
       component: "span",
       variant: "body",
@@ -49,7 +69,7 @@ const xe = Z(
       weight: "regular",
       fixY: !0,
       className: n(
-        i ? "text-text-dark-disabled" : "text-text-dark-primary-def"
+        d ? "text-text-dark-disabled" : "text-text-dark-primary-def"
       ),
       children: [
         "(",
@@ -59,51 +79,51 @@ const xe = Z(
     }
   )
 ] });
-D.displayName = "PartnerCard.RatingRow";
-const S = ({
-  categoryIcon: t,
+P.displayName = "PartnerCard.RatingRow";
+const V = ({
+  categoryIcon: s,
   categoryColor: a,
-  tags: i,
-  maxNumberOfVisibleTags: l,
+  tags: d,
+  maxNumberOfVisibleTags: i,
   wrap: h = !0,
-  className: c
+  className: u
 }) => {
-  const o = i.slice(0, l), u = i.length - o.length;
+  const g = d.slice(0, i), l = d.length - g.length;
   return /* @__PURE__ */ r(
     m,
     {
       align: "center",
       gap: "2xs",
       wrap: h ? "wrap" : "nowrap",
-      className: n("min-w-0 overflow-hidden", c),
+      className: n("min-w-0 overflow-hidden", u),
       children: [
-        t && a && /* @__PURE__ */ e(ge, { color: a, icon: t }),
-        o.map((x, P) => /* @__PURE__ */ e(
-          T,
+        s && a && /* @__PURE__ */ e(Ce, { color: a, icon: s }),
+        g.map((o, v) => /* @__PURE__ */ e(
+          I,
           {
             variant: "outlined",
             size: "small",
             className: "min-w-[50px] shrink overflow-hidden",
-            children: x
+            children: o
           },
-          P
+          v
         )),
-        u > 0 && /* @__PURE__ */ r(T, { variant: "outlined", size: "small", className: "shrink-0", children: [
+        l > 0 && /* @__PURE__ */ r(I, { variant: "outlined", size: "small", className: "shrink-0", children: [
           "+",
-          u
+          l
         ] }, "more")
       ]
     }
   );
 };
-S.displayName = "PartnerCard.TagsRow";
-const ee = ({
-  category: t,
+V.displayName = "PartnerCard.TagsRow";
+const oe = ({
+  category: s,
   tags: a,
-  maxNumberOfVisibleTags: i
+  maxNumberOfVisibleTags: d
 }) => {
-  const l = t ? [t, ...a] : a, h = l.slice(0, i), c = l.length - h.length;
-  return h.length === 0 ? null : /* @__PURE__ */ r(
+  const i = { variant: "invert" }, h = s ? [s, ...a] : a, u = h.slice(0, d), g = h.length - u.length;
+  return u.length === 0 ? null : /* @__PURE__ */ r(
     m,
     {
       align: "center",
@@ -111,57 +131,66 @@ const ee = ({
       wrap: "wrap",
       className: "relative z-10 self-start",
       children: [
-        h.map((o, u) => /* @__PURE__ */ e(T, { variant: "invert", size: "default", children: o }, u)),
-        c > 0 && /* @__PURE__ */ r(T, { variant: "invert", size: "default", children: [
+        u.map((l, o) => /* @__PURE__ */ e(I, { ...i, size: "default", children: l }, o)),
+        g > 0 && /* @__PURE__ */ r(I, { ...i, size: "default", children: [
           "+",
-          c
+          g
         ] }, "more")
       ]
     }
   );
 };
-ee.displayName = "PartnerCard.HeroTagsRow";
-const ae = ({
-  variant: t = "search",
+oe.displayName = "PartnerCard.HeroTagsRow";
+const ne = ({
+  variant: s = "search",
   color: a = "default",
+  isTinted: d = !1,
   className: i,
-  ...l
-}) => t === "heroLarge" || t === "heroSmall" ? /* @__PURE__ */ e(
+  ...h
+}) => s === "compact" ? /* @__PURE__ */ e(
+  Se,
+  {
+    color: a,
+    isTinted: d,
+    className: i,
+    ...h
+  }
+) : s === "heroLarge" || s === "heroSmall" ? /* @__PURE__ */ e(
   "div",
   {
     className: n(
       "relative h-full w-full overflow-hidden",
-      t === "heroLarge" ? "rounded-comp-partner-card-hero-large-radius" : "rounded-comp-partner-card-hero-sm-radius",
+      s === "heroLarge" ? "rounded-comp-partner-card-hero-large-radius" : "rounded-comp-partner-card-hero-sm-radius",
       i
     ),
-    ...l,
+    ...h,
     children: /* @__PURE__ */ e(
-      d,
+      c,
       {
         color: a,
         className: "absolute inset-0 size-full rounded-none"
       }
     )
   }
-) : t === "listView" ? /* @__PURE__ */ r(
+) : s === "listView" ? /* @__PURE__ */ r(
   "div",
   {
     className: n(
       "inline-flex w-full flex-row gap-comp-partner-card-list-view-gap",
       i
     ),
-    ...l,
+    ...h,
     children: [
       /* @__PURE__ */ r("div", { className: "relative h-comp-partner-card-list-view-h-img w-comp-partner-card-list-view-w-img shrink-0 overflow-hidden rounded-comp-partner-card-list-view-radius-img", children: [
         /* @__PURE__ */ e(
-          d,
+          c,
           {
             color: a,
             className: "absolute inset-0 size-full rounded-none"
           }
         ),
         /* @__PURE__ */ e("div", { className: "absolute top-comp-partner-card-list-view-p-img left-comp-partner-card-list-view-p-img", children: /* @__PURE__ */ e(
-          d,
+          c,
           {
             color: a,
             className: "size-comp-button-h-xs rounded-full"
@@ -169,10 +198,10 @@ const ae = ({
         ) })
       ] }),
       /* @__PURE__ */ r(m, { direction: "column", flex: 1, className: "min-w-0 gap-sm", children: [
-        /* @__PURE__ */ e(d, { color: a, className: "h-5 w-full max-w-60" }),
-        /* @__PURE__ */ e(d, { color: a, className: "h-4 w-40" }),
+        /* @__PURE__ */ e(c, { color: a, className: "h-5 w-full max-w-60" }),
+        /* @__PURE__ */ e(c, { color: a, className: "h-4 w-40" }),
         /* @__PURE__ */ e(
-          d,
+          c,
           {
             color: a,
             className: "h-6 w-32 rounded-comp-tag-radius"
@@ -188,18 +217,18 @@ const ae = ({
       "inline-flex w-full flex-row gap-comp-partner-card-search-gap",
       i
     ),
-    ...l,
+    ...h,
     children: [
       /* @__PURE__ */ r("div", { className: "relative h-comp-partner-card-search-h-img w-comp-partner-card-search-w-img shrink-0 overflow-hidden rounded-comp-partner-card-search-radius-img", children: [
         /* @__PURE__ */ e(
-          d,
+          c,
           {
             color: a,
             className: "absolute inset-0 size-full rounded-none"
           }
         ),
         /* @__PURE__ */ e("div", { className: "absolute top-comp-partner-card-search-p-img left-comp-partner-card-search-p-img", children: /* @__PURE__ */ e(
-          d,
+          c,
           {
             color: a,
             className: "size-comp-button-h-xs rounded-full"
@@ -213,12 +242,12 @@ const ae = ({
           flex: 1,
           className: "min-w-0 gap-comp-partner-card-search-gap-text",
           children: [
-            /* @__PURE__ */ e(d, { color: a, className: "h-5 w-full" }),
-            /* @__PURE__ */ e(d, { color: a, className: "h-4 w-32" }),
-            /* @__PURE__ */ e(d, { color: a, className: "h-4 w-40" }),
-            /* @__PURE__ */ e(d, { color: a, className: "h-4 w-48" }),
+            /* @__PURE__ */ e(c, { color: a, className: "h-5 w-full" }),
+            /* @__PURE__ */ e(c, { color: a, className: "h-4 w-32" }),
+            /* @__PURE__ */ e(c, { color: a, className: "h-4 w-40" }),
+            /* @__PURE__ */ e(c, { color: a, className: "h-4 w-48" }),
             /* @__PURE__ */ e(
-              d,
+              c,
               {
                 color: a,
                 className: "mt-xs h-8 w-24 self-start rounded-full"
@@ -230,198 +259,227 @@ const ae = ({
     ]
   }
 );
-ae.displayName = "PartnerCard.Skeleton";
-const V = ({
-  image: t,
-  alt: a,
-  wrapperClassName: i,
-  children: l
-}) => /* @__PURE__ */ r("div", { className: i, children: [
-  /* @__PURE__ */ e(
-    "div",
-    {
-      className: n(
-        "absolute inset-0 overflow-hidden",
-        "[&>img]:size-full [&>img]:object-cover",
-        "transition-transform duration-300 ease-out group-hover:scale-110",
-        "group-data-[disabled=true]:opacity-50",
-        "group-data-[disabled=true]:grayscale",
-        "group-data-[disabled=true]:group-hover:scale-100"
-      ),
-      children: typeof t == "string" ? /* @__PURE__ */ e("img", { src: t, alt: a }) : t
-    }
-  ),
-  l
-] });
-V.displayName = "PartnerCard.ImageSlot";
-const re = w.forwardRef(
-  (t, a) => {
+ne.displayName = "PartnerCard.Skeleton";
+const de = z.forwardRef(
+  (s, a) => {
     const {
-      name: i,
-      image: l,
+      name: d,
+      image: i,
       imageAlt: h,
-      address: c,
+      placeholderIcon: u,
+      placeholderColor: g,
+      address: l,
       distance: o,
-      rating: u,
-      ratingCount: x,
-      category: P,
-      categoryIcon: N,
-      categoryColor: k,
-      tags: v = [],
+      rating: v,
+      ratingCount: A,
+      category: Q,
+      categoryIcon: b,
+      categoryColor: w,
+      tags: N = [],
       maxNumberOfVisibleTags: j = 3,
-      logo: y,
-      logoAlt: te,
-      favorite: se,
-      defaultFavorite: O,
-      onFavoriteChange: C,
-      favoriteAriaLabel: ie,
-      showFavorite: I = !0,
-      onMapClick: A,
-      mapLabel: le,
+      logo: k,
+      logoAlt: ce,
+      favorite: me,
+      defaultFavorite: U,
+      onFavoriteChange: T,
+      favoriteAriaLabel: pe,
+      showFavorite: B = !0,
+      onMapClick: F,
+      mapLabel: he,
       variant: p = "search",
-      disabled: s = !1,
-      asChild: q = !1,
-      href: _,
-      className: ne,
-      children: b,
-      ...B
-    } = t, { translations: oe } = he(), de = le ?? oe.partnerCard.mapButton, E = p === "heroLarge" || p === "heroSmall", F = p === "listView", H = h ?? (E ? "" : i), ce = te ?? `${i} logo`, me = Ne({ variant: p }), z = u != null, $ = (p === "search" || F) && (!!(N && k) || v.length > 0), Y = n(xe({ variant: p }), ne), G = 'outline-none after:absolute after:inset-0 after:rounded-[inherit] after:content-[""] focus-visible:outline-none', M = /* @__PURE__ */ e(
-      f,
+      isTinted: ue = !1,
+      disabled: t = !1,
+      asChild: X = !1,
+      href: Z,
+      className: ge,
+      children: C,
+      ...E
+    } = s, { translations: fe } = Ne(), ve = he ?? fe.partnerCard.mapButton, H = p === "heroLarge" || p === "heroSmall", Y = p === "listView", xe = p === "compact", L = h ?? (H ? "" : d), ee = ce ?? `${d} logo`, M = Pe(i), W = {
+      placeholderIcon: u ?? b,
+      placeholderColor: g ?? w,
+      componentName: "PartnerCard"
+    }, be = Ie({ variant: p }), y = v != null, ae = (p === "search" || Y) && (!!(b && w) || N.length > 0), D = n(
+      Ve({ variant: p, isTinted: ue }),
+      ge
+    ), re = 'outline-none after:absolute after:inset-0 after:rounded-[inherit] after:content-[""] focus-visible:outline-none', O = /* @__PURE__ */ e(
+      x,
       {
         component: "h3",
         variant: "title",
         size: p === "heroLarge" ? "lg" : "base",
-        weight: E ? "regular" : "medium",
-        className: n(p === "heroLarge" ? "line-clamp-2 max-w-comp-partner-card-hero-large-text-max-w" : p === "search" || F ? "line-clamp-1" : "line-clamp-2", me),
-        children: i
+        weight: H ? "regular" : "medium",
+        className: n(p === "heroLarge" ? "line-clamp-2 max-w-comp-partner-card-hero-large-text-max-w" : p === "search" || Y ? "line-clamp-1" : "line-clamp-2", be),
+        children: d
       }
-    ), J = q && w.isValidElement(b) ? w.cloneElement(
-      b,
+    ), q = X && z.isValidElement(C) ? z.cloneElement(
+      C,
       {
-        className: n(G, b.props.className),
-        ...s ? X : null
+        className: n(re, C.props.className),
+        ...t ? te : null
       },
-      M
-    ) : /* @__PURE__ */ e("a", { href: s ? void 0 : _, className: G, children: M }), K = I && /* @__PURE__ */ e(
-      ve,
+      O
+    ) : /* @__PURE__ */ e("a", { href: t ? void 0 : Z, className: re, children: O }), _ = B && /* @__PURE__ */ e(
+      ye,
+      {
+        active: me,
+        defaultActive: U,
+        onClick: T !== void 0 || U !== void 0 ? (R, J) => T == null ? void 0 : T(J) : void 0,
+        "aria-label": pe,
+        disabled: t,
+        className: n(
+          "relative z-10",
+          // Without a photo behind it the default invert (white) heart would
+          // be invisible on the light placeholder tint, so switch to the
+          // primary-ghost colour ramp.
+          !M && [
+            "text-comp-button-primary-ghost-text-def hover:text-comp-button-primary-ghost-text-hover focus-visible:text-comp-button-primary-ghost-text-focused",
+            "disabled:text-comp-button-primary-ghost-text-disabled data-[disabled=true]:text-comp-button-primary-ghost-text-disabled"
+          ]
+        )
+      }
+    ), $ = l && /* @__PURE__ */ e(
+      x,
+      {
+        component: "span",
+        variant: "body",
+        size: "sm",
+        weight: "regular",
+        fixY: !0,
+        className: n(
+          "line-clamp-1 min-w-0",
+          t ? "text-text-dark-disabled" : "text-text-dark-secondary group-has-[a:focus-visible]:text-text-brand-focused"
+        ),
+        children: l
+      }
+    ), G = o && /* @__PURE__ */ e(
+      x,
       {
-        active: se,
-        defaultActive: O,
-        onClick: C !== void 0 || O !== void 0 ? (L, W) => C == null ? void 0 : C(W) : void 0,
-        "aria-label": ie,
-        disabled: s,
-        className: "relative z-10"
+        component: "span",
+        variant: "body",
+        size: "sm",
+        weight: "medium",
+        fixY: !0,
+        className: n(
+          "shrink-0",
+          t ? "text-text-dark-disabled" : "text-text-dark-primary-def group-has-[a:focus-visible]:text-text-brand-focused"
+        ),
+        children: o
       }
     );
-    let g = null;
-    if (F) {
-      const L = z && /* @__PURE__ */ e(
-        D,
-        {
-          rating: u,
-          ratingCount: x,
-          disabled: s
-        }
-      ), W = $ && /* @__PURE__ */ e(
-        S,
+    let f = null;
+    if (xe)
+      f = /* @__PURE__ */ r(
+        Re,
         {
-          categoryIcon: N,
-          categoryColor: k,
-          tags: v,
-          maxNumberOfVisibleTags: j,
-          wrap: !1
+          image: i,
+          imageAlt: L,
+          ...W,
+          category: Q,
+          heartButton: _,
+          logo: k,
+          logoAlt: ee,
+          disabled: t,
+          children: [
+            q,
+            y && /* @__PURE__ */ e(
+              P,
+              {
+                rating: v,
+                ratingCount: A,
+                disabled: t
+              }
+            ),
+            (o || l) && /* @__PURE__ */ r(m, { align: "center", gap: "sm", className: "mt-auto min-w-0", children: [
+              G,
+              o && l && /* @__PURE__ */ e(se, {}),
+              $
+            ] })
+          ]
         }
-      ), Q = c && /* @__PURE__ */ e(
-        f,
+      );
+    else if (Y) {
+      const R = y && /* @__PURE__ */ e(
+        P,
         {
-          component: "span",
-          variant: "body",
-          size: "sm",
-          weight: "regular",
-          fixY: !0,
-          className: n(
-            "line-clamp-1 min-w-0",
-            s ? "text-text-dark-disabled" : "text-text-dark-secondary group-has-[a:focus-visible]:text-text-brand-focused"
-          ),
-          children: c
+          rating: v,
+          ratingCount: A,
+          disabled: t
         }
-      ), U = o && /* @__PURE__ */ e(
-        f,
+      ), J = ae && /* @__PURE__ */ e(
+        V,
         {
-          component: "span",
-          variant: "body",
-          size: "sm",
-          weight: "medium",
-          fixY: !0,
-          className: n(
-            "shrink-0",
-            s ? "text-text-dark-disabled" : "text-text-dark-primary-def group-has-[a:focus-visible]:text-text-brand-focused"
-          ),
-          children: o
+          categoryIcon: b,
+          categoryColor: w,
+          tags: N,
+          maxNumberOfVisibleTags: j,
+          wrap: !1
         }
       );
-      g = /* @__PURE__ */ r(R, { children: [
+      f = /* @__PURE__ */ r(S, { children: [
         /* @__PURE__ */ r(
-          V,
+          K,
           {
-            image: l,
-            alt: H,
+            image: i,
+            alt: L,
+            ...W,
+            placeholderIconClassName: "[&>svg]:size-comp-partner-card-list-view-icon-size",
             wrapperClassName: "relative aspect-square h-comp-partner-card-list-view-h-img w-comp-partner-card-list-view-w-img shrink-0 overflow-hidden rounded-comp-partner-card-list-view-radius-img",
             children: [
-              /* @__PURE__ */ e(
+              M && /* @__PURE__ */ e(
                 "div",
                 {
                   "aria-hidden": "true",
                   className: "absolute inset-0 bg-gradient-to-b from-black/50 to-black/0 to-50%"
                 }
               ),
-              I && /* @__PURE__ */ e("div", { className: "absolute top-comp-partner-card-list-view-p-img left-comp-partner-card-list-view-p-img", children: K })
+              B && /* @__PURE__ */ e("div", { className: "absolute top-comp-partner-card-list-view-p-img left-comp-partner-card-list-view-p-img", children: _ })
             ]
           }
         ),
         /* @__PURE__ */ r(m, { direction: "column", flex: 1, className: "min-w-0 gap-sm", children: [
           /* @__PURE__ */ r(m, { direction: "column", className: "min-w-0 gap-3xs md:gap-2xs", children: [
-            J,
-            z && /* @__PURE__ */ e("div", { className: "md:hidden", children: L }),
-            (o || c) && /* @__PURE__ */ r(
+            q,
+            y && /* @__PURE__ */ e("div", { className: "md:hidden", children: R }),
+            (o || l) && /* @__PURE__ */ r(
               m,
               {
                 align: "center",
                 gap: "sm",
                 className: "hidden min-w-0 md:flex",
                 children: [
-                  U,
-                  o && c && /* @__PURE__ */ e(fe, {}),
-                  Q
+                  G,
+                  o && l && /* @__PURE__ */ e(se, {}),
+                  $
                 ]
               }
             )
           ] }),
-          z && /* @__PURE__ */ e("div", { className: "hidden md:block", children: L }),
-          W,
-          (c || o) && /* @__PURE__ */ r(m, { direction: "column", className: "min-w-0 gap-2xs md:hidden", children: [
-            Q,
-            U
+          y && /* @__PURE__ */ e("div", { className: "hidden md:block", children: R }),
+          J,
+          (l || o) && /* @__PURE__ */ r(m, { direction: "column", className: "min-w-0 gap-2xs md:hidden", children: [
+            $,
+            G
           ] })
         ] })
       ] });
-    } else p === "search" ? g = /* @__PURE__ */ r(R, { children: [
+    } else p === "search" ? f = /* @__PURE__ */ r(S, { children: [
       /* @__PURE__ */ r(
-        V,
+        K,
         {
-          image: l,
-          alt: H,
+          image: i,
+          alt: L,
+          ...W,
           wrapperClassName: "relative shrink-0 overflow-hidden rounded-comp-partner-card-search-radius-img h-comp-partner-card-search-h-img w-comp-partner-card-search-w-img",
           children: [
-            /* @__PURE__ */ e(
+            M && /* @__PURE__ */ e(
               "div",
               {
                 "aria-hidden": "true",
                 className: "absolute inset-0 bg-gradient-to-b from-black/50 to-black/0 to-50%"
               }
             ),
-            y && /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-surface-base-overlay", children: /* @__PURE__ */ e("div", { className: "size-comp-partner-card-search-logo-size overflow-hidden rounded-full border-(length:--spacing-comp-partner-card-search-logo-stroke) border-solid border-stroke-base-secondary group-data-[disabled=true]:grayscale [&>img]:size-full [&>img]:object-cover", children: typeof y == "string" ? /* @__PURE__ */ e("img", { src: y, alt: ce }) : y }) }),
-            I && /* @__PURE__ */ e("div", { className: "absolute top-comp-partner-card-search-p-img left-comp-partner-card-search-p-img", children: K })
+            k && /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-surface-base-overlay", children: /* @__PURE__ */ e("div", { className: "size-comp-partner-card-search-logo-size overflow-hidden rounded-full border-(length:--spacing-comp-partner-card-search-logo-stroke) border-solid border-stroke-base-secondary group-data-[disabled=true]:grayscale [&>img]:size-full [&>img]:object-cover", children: typeof k == "string" ? /* @__PURE__ */ e("img", { src: k, alt: ee }) : k }) }),
+            B && /* @__PURE__ */ e("div", { className: "absolute top-comp-partner-card-search-p-img left-comp-partner-card-search-p-img", children: _ })
           ]
         }
       ),
@@ -433,42 +491,42 @@ const re = w.forwardRef(
           className: "min-w-0 gap-comp-partner-card-search-gap-text",
           children: [
             /* @__PURE__ */ r(m, { direction: "column", gap: "3xs", className: "min-w-0", children: [
-              J,
-              z && /* @__PURE__ */ e(
-                D,
+              q,
+              y && /* @__PURE__ */ e(
+                P,
                 {
-                  rating: u,
-                  ratingCount: x,
-                  disabled: s
+                  rating: v,
+                  ratingCount: A,
+                  disabled: t
                 }
               )
             ] }),
-            $ && /* @__PURE__ */ r(R, { children: [
+            ae && /* @__PURE__ */ r(S, { children: [
               /* @__PURE__ */ e(
-                S,
+                V,
                 {
-                  categoryIcon: N,
-                  categoryColor: k,
-                  tags: v,
+                  categoryIcon: b,
+                  categoryColor: w,
+                  tags: N,
                   maxNumberOfVisibleTags: 1,
                   wrap: !1,
                   className: "md:hidden"
                 }
               ),
               /* @__PURE__ */ e(
-                S,
+                V,
                 {
-                  categoryIcon: N,
-                  categoryColor: k,
-                  tags: v,
+                  categoryIcon: b,
+                  categoryColor: w,
+                  tags: N,
                   maxNumberOfVisibleTags: j,
                   wrap: !0,
                   className: "hidden md:flex"
                 }
               )
             ] }),
-            c && /* @__PURE__ */ e(
-              f,
+            l && /* @__PURE__ */ e(
+              x,
               {
                 component: "span",
                 variant: "body",
@@ -477,27 +535,27 @@ const re = w.forwardRef(
                 fixY: !0,
                 className: n(
                   "line-clamp-1",
-                  s ? "text-text-dark-disabled" : "text-text-dark-secondary group-has-[a:focus-visible]:text-text-brand-focused"
+                  t ? "text-text-dark-disabled" : "text-text-dark-secondary group-has-[a:focus-visible]:text-text-brand-focused"
                 ),
-                children: c
+                children: l
               }
             ),
-            (A || o) && /* @__PURE__ */ r(m, { align: "center", gap: "lg", className: "mt-auto", children: [
-              A && /* @__PURE__ */ e(
-                ue,
+            (F || o) && /* @__PURE__ */ r(m, { align: "center", gap: "lg", className: "mt-auto", children: [
+              F && /* @__PURE__ */ e(
+                ke,
                 {
                   variant: "secondary",
                   ghost: !0,
                   size: "xs",
-                  icon: /* @__PURE__ */ e(be, {}),
-                  onClick: A,
-                  disabled: s,
+                  icon: /* @__PURE__ */ e(ze, {}),
+                  onClick: F,
+                  disabled: t,
                   className: "relative z-10",
-                  children: de
+                  children: ve
                 }
               ),
               o && /* @__PURE__ */ e(
-                f,
+                x,
                 {
                   component: "span",
                   variant: "body",
@@ -505,7 +563,7 @@ const re = w.forwardRef(
                   weight: "regular",
                   fixY: !0,
                   className: n(
-                    s ? "text-text-dark-disabled" : "text-text-dark-primary-def"
+                    t ? "text-text-dark-disabled" : "text-text-dark-primary-def"
                   ),
                   children: o
                 }
@@ -514,12 +572,13 @@ const re = w.forwardRef(
           ]
         }
       )
-    ] }) : g = /* @__PURE__ */ r(R, { children: [
+    ] }) : f = /* @__PURE__ */ r(S, { children: [
       /* @__PURE__ */ e(
-        V,
+        K,
         {
-          image: l,
-          alt: H,
+          image: i,
+          alt: L,
+          componentName: "PartnerCard",
           wrapperClassName: n(
             "absolute inset-0 overflow-hidden",
             p === "heroLarge" ? "rounded-comp-partner-card-hero-large-radius" : "rounded-comp-partner-card-hero-sm-radius"
@@ -534,58 +593,58 @@ const re = w.forwardRef(
         }
       ),
       /* @__PURE__ */ e(
-        ee,
+        oe,
         {
-          category: P,
-          tags: v,
+          category: Q,
+          tags: N,
           maxNumberOfVisibleTags: j
         }
       ),
-      /* @__PURE__ */ e("div", { className: "relative z-10", children: M })
+      /* @__PURE__ */ e("div", { className: "relative z-10", children: O })
     ] });
-    return E ? q && w.isValidElement(b) ? /* @__PURE__ */ e(
-      pe,
+    return H ? X && z.isValidElement(C) ? /* @__PURE__ */ e(
+      we,
       {
         ref: a,
-        className: Y,
-        "data-disabled": s || void 0,
-        "aria-disabled": s || void 0,
-        ...B,
-        children: w.cloneElement(
-          b,
-          s ? X : void 0,
-          g
+        className: D,
+        "data-disabled": t || void 0,
+        "aria-disabled": t || void 0,
+        ...E,
+        children: z.cloneElement(
+          C,
+          t ? te : void 0,
+          f
         )
       }
     ) : /* @__PURE__ */ e(
       "a",
       {
         ref: a,
-        href: s ? void 0 : _,
-        className: Y,
-        "data-disabled": s || void 0,
-        "aria-disabled": s || void 0,
-        ...B,
-        children: g
+        href: t ? void 0 : Z,
+        className: D,
+        "data-disabled": t || void 0,
+        "aria-disabled": t || void 0,
+        ...E,
+        children: f
       }
     ) : /* @__PURE__ */ e(
       "div",
       {
         ref: a,
-        className: Y,
-        "data-disabled": s || void 0,
-        "aria-disabled": s || void 0,
-        ...B,
-        children: g
+        className: D,
+        "data-disabled": t || void 0,
+        "aria-disabled": t || void 0,
+        ...E,
+        children: f
       }
     );
   }
 );
-re.displayName = "PartnerCard";
-const ke = re;
-ke.Skeleton = ae;
+de.displayName = "PartnerCard";
+const Ae = de;
+Ae.Skeleton = ne;
 export {
-  ke as PartnerCard,
-  Ne as partnerCardTitleVariants,
-  xe as partnerCardVariants
+  Ae as PartnerCard,
+  Ie as partnerCardTitleVariants,
+  Ve as partnerCardVariants
 };