@opensite/ui 3.5.9 → 3.6.0

package/dist/navbar-animated-preview.cjs

@@ -1230,35 +1230,35 @@ var FeaturedImageLink = ({
   ) }) });
 };
 var FeaturedLink = ({ link, optixFlowConfig }) => {
+  const hasBgImg = !!link.background;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     pressable.Pressable,
     {
       href: getLinkUrl(link),
-      className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-24 pb-4",
+      className: `group relative flex w-full overflow-hidden rounded-xl px-4 pt-24 pb-4 ${hasBgImg ? "" : "bg-primary"}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-background shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
-            DynamicIcon,
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-card text-card-foreground shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: link.icon || link.iconName, size: 20 }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
             {
-              name: link.icon || link.iconName,
-              size: 20,
-              className: "m-auto stroke-white"
+              className: `flex flex-col ${hasBgImg ? "text-white text-shadow-lg" : "text-primary-foreground"}`,
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold", children: link.label }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: link.description })
+              ]
             }
-          ) }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col  text-white text-shadow-lg", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold", children: link.label }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: link.description })
-          ] })
+          )
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
+        link.background && link.background?.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
           img.Img,
           {
             src: link.background,
-            alt: typeof link.label === "string" ? link.label : "",
+            alt: link.label && typeof link.label === "string" ? link.label : "Featured link background image",
             className: "absolute top-0 left-0 size-full brightness-50 object-cover object-center opacity-90 transition-opacity duration-300 ease-in-out group-hover:opacity-100",
             optixFlowConfig
           }
-        )
+        ) : null
       ]
     }
   );
@@ -1274,17 +1274,17 @@ var NavLink = React.forwardRef(
         onMouseEnter,
         onMouseLeave,
         children: [
-          (link.icon || link.iconName) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-6 shrink-0 rounded-md border shadow", children: /* @__PURE__ */ jsxRuntime.jsx(
+          link.icon || link.iconName ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-6 shrink-0 rounded-md border shadow", children: /* @__PURE__ */ jsxRuntime.jsx(
             DynamicIcon,
             {
               name: link.icon || link.iconName,
               size: 14,
               className: "m-auto"
             }
-          ) }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-2", children: [
+          ) }) : null,
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-1", children: [
             link.label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm leading-normal", children: link.label }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs leading-normal text-muted-foreground", children: link.description })
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs leading-normal opacity-70", children: link.description })
           ] })
         ]
       }

package/dist/navbar-animated-preview.js

@@ -1205,35 +1205,35 @@ var FeaturedImageLink = ({
   ) }) });
 };
 var FeaturedLink = ({ link, optixFlowConfig }) => {
+  const hasBgImg = !!link.background;
   return /* @__PURE__ */ jsxs(
     Pressable,
     {
       href: getLinkUrl(link),
-      className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-24 pb-4",
+      className: `group relative flex w-full overflow-hidden rounded-xl px-4 pt-24 pb-4 ${hasBgImg ? "" : "bg-primary"}`,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
-          /* @__PURE__ */ jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-background shadow-lg", children: /* @__PURE__ */ jsx(
-            DynamicIcon,
+          /* @__PURE__ */ jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-card text-card-foreground shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: link.icon || link.iconName, size: 20 }) }),
+          /* @__PURE__ */ jsxs(
+            "div",
             {
-              name: link.icon || link.iconName,
-              size: 20,
-              className: "m-auto stroke-white"
+              className: `flex flex-col ${hasBgImg ? "text-white text-shadow-lg" : "text-primary-foreground"}`,
+              children: [
+                /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold", children: link.label }),
+                /* @__PURE__ */ jsx("div", { className: "font-medium", children: link.description })
+              ]
             }
-          ) }),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col  text-white text-shadow-lg", children: [
-            /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold", children: link.label }),
-            /* @__PURE__ */ jsx("div", { className: "font-medium", children: link.description })
-          ] })
+          )
         ] }),
-        /* @__PURE__ */ jsx(
+        link.background && link.background?.length > 0 ? /* @__PURE__ */ jsx(
           Img,
           {
             src: link.background,
-            alt: typeof link.label === "string" ? link.label : "",
+            alt: link.label && typeof link.label === "string" ? link.label : "Featured link background image",
             className: "absolute top-0 left-0 size-full brightness-50 object-cover object-center opacity-90 transition-opacity duration-300 ease-in-out group-hover:opacity-100",
             optixFlowConfig
           }
-        )
+        ) : null
       ]
     }
   );
@@ -1249,17 +1249,17 @@ var NavLink = forwardRef(
         onMouseEnter,
         onMouseLeave,
         children: [
-          (link.icon || link.iconName) && /* @__PURE__ */ jsx("div", { className: "flex size-6 shrink-0 rounded-md border shadow", children: /* @__PURE__ */ jsx(
+          link.icon || link.iconName ? /* @__PURE__ */ jsx("div", { className: "flex size-6 shrink-0 rounded-md border shadow", children: /* @__PURE__ */ jsx(
             DynamicIcon,
             {
               name: link.icon || link.iconName,
               size: 14,
               className: "m-auto"
             }
-          ) }),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-2", children: [
+          ) }) : null,
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-1", children: [
             link.label && /* @__PURE__ */ jsx("div", { className: "text-sm leading-normal", children: link.label }),
-            /* @__PURE__ */ jsx("div", { className: "text-xs leading-normal text-muted-foreground", children: link.description })
+            /* @__PURE__ */ jsx("div", { className: "text-xs leading-normal opacity-70", children: link.description })
           ] })
         ]
       }