@opensite/ui 3.7.5 → 3.7.7

package/dist/navbar-image-preview.d.cts

@@ -31,16 +31,16 @@ interface SocialLink {
  */
 interface NavbarImagePreviewProps {
     /**
-       * Logo configuration
-       */
+     * Logo configuration
+     */
     logo?: LogoConfig;
     /**
-       * Navigation menu items
-       */
+     * Navigation menu items
+     */
     navigation?: MenuItem[];
     /**
-       * Authentication action configurations
-       */
+     * Authentication action configurations
+     */
     authActions?: ActionConfig[];
 }
 interface NavbarImagePreviewRuntimeProps {

package/dist/navbar-image-preview.d.ts

@@ -31,16 +31,16 @@ interface SocialLink {
  */
 interface NavbarImagePreviewProps {
     /**
-       * Logo configuration
-       */
+     * Logo configuration
+     */
     logo?: LogoConfig;
     /**
-       * Navigation menu items
-       */
+     * Navigation menu items
+     */
     navigation?: MenuItem[];
     /**
-       * Authentication action configurations
-       */
+     * Authentication action configurations
+     */
     authActions?: ActionConfig[];
 }
 interface NavbarImagePreviewRuntimeProps {

package/dist/navbar-image-preview.js

@@ -973,7 +973,8 @@ var DesktopMenuItem = ({
             src: link.image,
             alt: typeof link.label === "string" ? link.label : "",
             className: `absolute top-0 left-0 h-full w-full object-cover transition-opacity duration-300 ${linkIndex === 0 ? "opacity-100" : "opacity-0"}`,
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           },
           linkIndex
         )) }),
@@ -1059,7 +1060,14 @@ var MobileNavigationMenu = ({
           children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(DynamicIcon, { name: icon, size: 16, className: "shrink-0" }),
             label,
-            /* @__PURE__ */ jsx(DynamicIcon, { name: iconAfter, size: 16, className: "shrink-0" })
+            /* @__PURE__ */ jsx(
+              DynamicIcon,
+              {
+                name: iconAfter,
+                size: 16,
+                className: "shrink-0"
+              }
+            )
           ] })
         },
         index

package/dist/process-hover-cards.cjs

@@ -450,7 +450,8 @@ var ProcessCard = ({
                 src: step.image,
                 alt: titleText,
                 className: "h-full w-full object-cover",
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             )
           }
@@ -461,7 +462,8 @@ var ProcessCard = ({
             src: step.image,
             alt: titleText,
             className: "mb-4 md:mb-0 md:hidden h-full w-full object-cover aspect-square rounded-xl shadow-lg ring-2 ring-primary",
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between gap-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start md:items-center gap-4 md:gap-8", children: [

package/dist/process-hover-cards.js

@@ -429,7 +429,8 @@ var ProcessCard = ({
                 src: step.image,
                 alt: titleText,
                 className: "h-full w-full object-cover",
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             )
           }
@@ -440,7 +441,8 @@ var ProcessCard = ({
             src: step.image,
             alt: titleText,
             className: "mb-4 md:mb-0 md:hidden h-full w-full object-cover aspect-square rounded-xl shadow-lg ring-2 ring-primary",
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ),
         /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between gap-8", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start md:items-center gap-4 md:gap-8", children: [

package/dist/process-icon-timeline.cjs

@@ -458,8 +458,7 @@ function ProcessIconTimeline({
             "div",
             {
               className: cn(
-                "absolute left-0 flex size-12 items-center justify-center rounded-full text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
-                step.badgeColor || "bg-primary",
+                "absolute left-0 flex size-12 items-center justify-center rounded-full bg-primary text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
                 stepBadgeClassName
               ),
               children: step.iconSlot ?? (step.icon && /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: step.icon, size: 24 }))

package/dist/process-icon-timeline.d.cts

@@ -30,10 +30,6 @@ interface ProcessIconTimelineItem {
      * List of highlight tags
      */
     highlights?: React.ReactNode[];
-    /**
-     * Badge background color class (e.g., "bg-blue-500")
-     */
-    badgeColor?: string;
     /**
      * Additional CSS classes for the step item
      */

package/dist/process-icon-timeline.d.ts

@@ -30,10 +30,6 @@ interface ProcessIconTimelineItem {
      * List of highlight tags
      */
     highlights?: React.ReactNode[];
-    /**
-     * Badge background color class (e.g., "bg-blue-500")
-     */
-    badgeColor?: string;
     /**
      * Additional CSS classes for the step item
      */

package/dist/process-icon-timeline.js

@@ -437,8 +437,7 @@ function ProcessIconTimeline({
             "div",
             {
               className: cn(
-                "absolute left-0 flex size-12 items-center justify-center rounded-full text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
-                step.badgeColor || "bg-primary",
+                "absolute left-0 flex size-12 items-center justify-center rounded-full bg-primary text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
                 stepBadgeClassName
               ),
               children: step.iconSlot ?? (step.icon && /* @__PURE__ */ jsx(DynamicIcon, { name: step.icon, size: 24 }))

package/dist/process-scroll-image.cjs

@@ -440,12 +440,12 @@ var ProcessCard = ({
     {
       ref,
       className: cn(
-        "relative flex flex-col justify-between gap-12 border-b py-8 lg:py-16",
+        "relative flex flex-col justify-between gap-6 md:gap-8 border-b py-8 lg:py-16",
         itemClassName,
         step.className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-fit items-center justify-center px-4 py-1 text-5xl md:text-7xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-fit items-center justify-center text-5xl md:text-7xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
           step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: step.title })),
           step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { children: step.description }) : step.description)

package/dist/process-scroll-image.js

@@ -419,12 +419,12 @@ var ProcessCard = ({
     {
       ref,
       className: cn(
-        "relative flex flex-col justify-between gap-12 border-b py-8 lg:py-16",
+        "relative flex flex-col justify-between gap-6 md:gap-8 border-b py-8 lg:py-16",
         itemClassName,
         step.className
       ),
       children: [
-        /* @__PURE__ */ jsx("div", { className: "flex w-fit items-center justify-center px-4 py-1 text-5xl md:text-7xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
+        /* @__PURE__ */ jsx("div", { className: "flex w-fit items-center justify-center text-5xl md:text-7xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
         /* @__PURE__ */ jsxs("div", { children: [
           step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsx("div", { className: "mb-4", children: step.title })),
           step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { children: step.description }) : step.description)

package/dist/process-steps-grid.cjs

@@ -455,7 +455,8 @@ function ProcessStepsGrid({
           "div",
           {
             className: cn(
-              "group relative overflow-hidden rounded-lg p-8 transition-all hover:shadow-lg",
+              "group relative overflow-hidden rounded-lg p-8",
+              "transition-all hover:shadow-lg duration-500",
               "border border-border hover:border-primary",
               "bg-card text-card-foreground",
               stepCardClassName,
@@ -466,9 +467,9 @@ function ProcessStepsGrid({
                 "span",
                 {
                   className: cn(
-                    "absolute -right-4 -top-4 text-[120px] font-bold leading-none transition-colors",
-                    "opacity-20 group-hover:opacity-100",
-                    "group-hover:text-primary"
+                    "absolute -right-4 -top-4 text-[120px] font-bold leading-none",
+                    "transition-colors duration-500 opacity-20",
+                    "group-hover:text-primary group-hover:opacity-100"
                   ),
                   children: String(index + 1).padStart(2, "0")
                 }
@@ -478,7 +479,8 @@ function ProcessStepsGrid({
                   "div",
                   {
                     className: cn(
-                      "mb-6 flex size-14 items-center justify-center rounded-lg transition-colors",
+                      "mb-6 flex size-14 items-center justify-center rounded-lg",
+                      "transition-colors duration-500",
                       "bg-primary/10 group-hover:bg-primary group-hover:text-primary-foreground",
                       stepIconClassName
                     ),

package/dist/process-steps-grid.js

@@ -434,7 +434,8 @@ function ProcessStepsGrid({
           "div",
           {
             className: cn(
-              "group relative overflow-hidden rounded-lg p-8 transition-all hover:shadow-lg",
+              "group relative overflow-hidden rounded-lg p-8",
+              "transition-all hover:shadow-lg duration-500",
               "border border-border hover:border-primary",
               "bg-card text-card-foreground",
               stepCardClassName,
@@ -445,9 +446,9 @@ function ProcessStepsGrid({
                 "span",
                 {
                   className: cn(
-                    "absolute -right-4 -top-4 text-[120px] font-bold leading-none transition-colors",
-                    "opacity-20 group-hover:opacity-100",
-                    "group-hover:text-primary"
+                    "absolute -right-4 -top-4 text-[120px] font-bold leading-none",
+                    "transition-colors duration-500 opacity-20",
+                    "group-hover:text-primary group-hover:opacity-100"
                   ),
                   children: String(index + 1).padStart(2, "0")
                 }
@@ -457,7 +458,8 @@ function ProcessStepsGrid({
                   "div",
                   {
                     className: cn(
-                      "mb-6 flex size-14 items-center justify-center rounded-lg transition-colors",
+                      "mb-6 flex size-14 items-center justify-center rounded-lg",
+                      "transition-colors duration-500",
                       "bg-primary/10 group-hover:bg-primary group-hover:text-primary-foreground",
                       stepIconClassName
                     ),