@opensite/ui 0.4.1 → 0.4.3

package/dist/project-background-reveal.d.ts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.js';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
 import './blocks-k17uluAz.js';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
@@ -58,7 +59,7 @@ interface ProjectBackgroundRevealProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */

package/dist/project-background-reveal.js

@@ -859,6 +859,7 @@ var Section = React__default.forwardRef(
     patternClassName,
     ...props
   }, ref) => {
+    const effectivePatternOpacity = patternOpacity !== void 0 ? patternOpacity : pattern ? 1 : 0;
     return /* @__PURE__ */ jsxs(
       "section",
       {
@@ -878,7 +879,7 @@ var Section = React__default.forwardRef(
             PatternBackground,
             {
               pattern,
-              opacity: patternOpacity,
+              opacity: effectivePatternOpacity,
               className: patternClassName
             }
           ),
@@ -972,9 +973,36 @@ function ProjectBackgroundReveal({
       className: cn(className),
       children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxs("div", { className: headerClassName, children: [
-          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mb-1 text-muted-foreground uppercase md:text-lg", subheadingClassName), children: subheading }) : /* @__PURE__ */ jsx("div", { className: subheadingClassName, children: subheading })),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-3xl font-bold uppercase md:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-7 max-w-2xl text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: cn(
+                "mb-1 text-muted-foreground uppercase md:text-lg",
+                subheadingClassName
+              ),
+              children: subheading
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: subheadingClassName, children: subheading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                "text-3xl font-bold uppercase md:text-7xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: cn(
+                "mt-7 max-w-2xl text-muted-foreground",
+                descriptionClassName
+              ),
+              children: description
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
           /* @__PURE__ */ jsxs(
             Pressable,
             {
@@ -989,7 +1017,13 @@ function ProjectBackgroundReveal({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("div", { className: cn("mt-24 flex flex-col gap-5 md:mt-36", listClassName), children: renderProjects() })
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn("mt-24 flex flex-col gap-5 md:mt-36", listClassName),
+            children: renderProjects()
+          }
+        )
       ] })
     }
   );

package/dist/project-card-overlay.cjs

@@ -463,6 +463,7 @@ var Section = React__namespace.default.forwardRef(
     patternClassName,
     ...props
   }, ref) => {
+    const effectivePatternOpacity = patternOpacity !== void 0 ? patternOpacity : pattern ? 1 : 0;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "section",
       {
@@ -482,7 +483,7 @@ var Section = React__namespace.default.forwardRef(
             PatternBackground,
             {
               pattern,
-              opacity: patternOpacity,
+              opacity: effectivePatternOpacity,
               className: patternClassName
             }
           ),
@@ -519,14 +520,21 @@ var itemVariants = {
     }
   }
 };
-var ProjectCard = ({ project, optixFlowConfig, className }) => {
+var ProjectCard = ({
+  project,
+  optixFlowConfig,
+  className
+}) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     framerMotion.motion.div,
     {
       variants: itemVariants,
       whileHover: { scale: 1.02 },
       whileTap: { scale: 0.98 },
-      className: cn("group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl", className),
+      className: cn(
+        "group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl",
+        className
+      ),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative aspect-square overflow-hidden", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           img.Img,
@@ -603,11 +611,29 @@ function ProjectCardOverlay({
             transition: { duration: 0.8, ease: "easeOut" },
             className: cn("mb-20 text-center", headerClassName),
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-6", children: subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("inline-flex items-center gap-2 text-sm font-medium tracking-wide text-muted-foreground", subheadingClassName), children: [
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-foreground" }),
-                subheading
-              ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subheadingClassName, children: subheading })) }),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-6xl leading-none font-black tracking-tight md:text-8xl lg:text-9xl", headingClassName), children: heading.split(" ").map((word, index) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block", children: word }, index)) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading }))
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-6", children: subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsxs(
+                "span",
+                {
+                  className: cn(
+                    "inline-flex items-center gap-2 text-sm font-medium tracking-wide text-muted-foreground",
+                    subheadingClassName
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-foreground" }),
+                    subheading
+                  ]
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subheadingClassName, children: subheading })) }),
+              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "h1",
+                {
+                  className: cn(
+                    "text-6xl leading-none font-black tracking-tight md:text-8xl lg:text-9xl",
+                    headingClassName
+                  ),
+                  children: heading.split(" ").map((word, index) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block", children: word }, index))
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading }))
             ]
           }
         ),
@@ -617,7 +643,10 @@ function ProjectCardOverlay({
             variants: containerVariants,
             initial: "hidden",
             animate: "visible",
-            className: cn("mx-auto grid max-w-7xl grid-cols-1 gap-4 md:grid-cols-2", gridClassName),
+            className: cn(
+              "mx-auto grid max-w-7xl grid-cols-1 gap-4 md:grid-cols-2",
+              gridClassName
+            ),
             children: renderProjects()
           }
         )

package/dist/project-card-overlay.d.cts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.cjs';
+import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
 import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.cjs';
@@ -46,7 +47,7 @@ interface ProjectCardOverlayProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */

package/dist/project-card-overlay.d.ts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.js';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
 import './blocks-k17uluAz.js';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
@@ -46,7 +47,7 @@ interface ProjectCardOverlayProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */

package/dist/project-card-overlay.js

@@ -442,6 +442,7 @@ var Section = React__default.forwardRef(
     patternClassName,
     ...props
   }, ref) => {
+    const effectivePatternOpacity = patternOpacity !== void 0 ? patternOpacity : pattern ? 1 : 0;
     return /* @__PURE__ */ jsxs(
       "section",
       {
@@ -461,7 +462,7 @@ var Section = React__default.forwardRef(
             PatternBackground,
             {
               pattern,
-              opacity: patternOpacity,
+              opacity: effectivePatternOpacity,
               className: patternClassName
             }
           ),
@@ -498,14 +499,21 @@ var itemVariants = {
     }
   }
 };
-var ProjectCard = ({ project, optixFlowConfig, className }) => {
+var ProjectCard = ({
+  project,
+  optixFlowConfig,
+  className
+}) => {
   return /* @__PURE__ */ jsx(
     motion.div,
     {
       variants: itemVariants,
       whileHover: { scale: 1.02 },
       whileTap: { scale: 0.98 },
-      className: cn("group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl", className),
+      className: cn(
+        "group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl",
+        className
+      ),
       children: /* @__PURE__ */ jsxs("div", { className: "relative aspect-square overflow-hidden", children: [
         /* @__PURE__ */ jsx(
           Img,
@@ -582,11 +590,29 @@ function ProjectCardOverlay({
             transition: { duration: 0.8, ease: "easeOut" },
             className: cn("mb-20 text-center", headerClassName),
             children: [
-              /* @__PURE__ */ jsx("div", { className: "mb-6", children: subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxs("span", { className: cn("inline-flex items-center gap-2 text-sm font-medium tracking-wide text-muted-foreground", subheadingClassName), children: [
-                /* @__PURE__ */ jsx("div", { className: "h-2 w-2 rounded-full bg-foreground" }),
-                subheading
-              ] }) : /* @__PURE__ */ jsx("div", { className: subheadingClassName, children: subheading })) }),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-6xl leading-none font-black tracking-tight md:text-8xl lg:text-9xl", headingClassName), children: heading.split(" ").map((word, index) => /* @__PURE__ */ jsx("span", { className: "block", children: word }, index)) }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading }))
+              /* @__PURE__ */ jsx("div", { className: "mb-6", children: subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: cn(
+                    "inline-flex items-center gap-2 text-sm font-medium tracking-wide text-muted-foreground",
+                    subheadingClassName
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx("div", { className: "h-2 w-2 rounded-full bg-foreground" }),
+                    subheading
+                  ]
+                }
+              ) : /* @__PURE__ */ jsx("div", { className: subheadingClassName, children: subheading })) }),
+              heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+                "h1",
+                {
+                  className: cn(
+                    "text-6xl leading-none font-black tracking-tight md:text-8xl lg:text-9xl",
+                    headingClassName
+                  ),
+                  children: heading.split(" ").map((word, index) => /* @__PURE__ */ jsx("span", { className: "block", children: word }, index))
+                }
+              ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading }))
             ]
           }
         ),
@@ -596,7 +622,10 @@ function ProjectCardOverlay({
             variants: containerVariants,
             initial: "hidden",
             animate: "visible",
-            className: cn("mx-auto grid max-w-7xl grid-cols-1 gap-4 md:grid-cols-2", gridClassName),
+            className: cn(
+              "mx-auto grid max-w-7xl grid-cols-1 gap-4 md:grid-cols-2",
+              gridClassName
+            ),
             children: renderProjects()
           }
         )

package/dist/project-carousel-cinematic.cjs

@@ -885,6 +885,7 @@ var Section = React6__namespace.default.forwardRef(
     patternClassName,
     ...props
   }, ref) => {
+    const effectivePatternOpacity = patternOpacity !== void 0 ? patternOpacity : pattern ? 1 : 0;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "section",
       {
@@ -904,7 +905,7 @@ var Section = React6__namespace.default.forwardRef(
             PatternBackground,
             {
               pattern,
-              opacity: patternOpacity,
+              opacity: effectivePatternOpacity,
               className: patternClassName
             }
           ),
@@ -1112,8 +1113,26 @@ function ProjectCarouselCinematic({
       className: cn(className),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("w-full", containerClassName), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-16 px-8", headerClassName), children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-3xl font-medium tracking-tight lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
-          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg text-muted-foreground", subheadingClassName), children: subheading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subheadingClassName, children: subheading }))
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "h1",
+            {
+              className: cn(
+                "text-3xl font-medium tracking-tight lg:text-6xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              className: cn(
+                "mt-4 text-lg text-muted-foreground",
+                subheadingClassName
+              ),
+              children: subheading
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subheadingClassName, children: subheading }))
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-full", children: [
           /* @__PURE__ */ jsxRuntime.jsx(

package/dist/project-carousel-cinematic.d.cts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.cjs';
+import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
 import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.cjs';
@@ -48,7 +49,7 @@ interface ProjectCarouselCinematicProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */

package/dist/project-carousel-cinematic.d.ts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.js';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
 import './blocks-k17uluAz.js';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
@@ -48,7 +49,7 @@ interface ProjectCarouselCinematicProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */

package/dist/project-carousel-cinematic.js

@@ -861,6 +861,7 @@ var Section = React6__default.forwardRef(
     patternClassName,
     ...props
   }, ref) => {
+    const effectivePatternOpacity = patternOpacity !== void 0 ? patternOpacity : pattern ? 1 : 0;
     return /* @__PURE__ */ jsxs(
       "section",
       {
@@ -880,7 +881,7 @@ var Section = React6__default.forwardRef(
             PatternBackground,
             {
               pattern,
-              opacity: patternOpacity,
+              opacity: effectivePatternOpacity,
               className: patternClassName
             }
           ),
@@ -1088,8 +1089,26 @@ function ProjectCarouselCinematic({
       className: cn(className),
       children: /* @__PURE__ */ jsxs("div", { className: cn("w-full", containerClassName), children: [
         /* @__PURE__ */ jsxs("div", { className: cn("mb-16 px-8", headerClassName), children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-3xl font-medium tracking-tight lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
-          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg text-muted-foreground", subheadingClassName), children: subheading }) : /* @__PURE__ */ jsx("div", { className: subheadingClassName, children: subheading }))
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                "text-3xl font-medium tracking-tight lg:text-6xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
+          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: cn(
+                "mt-4 text-lg text-muted-foreground",
+                subheadingClassName
+              ),
+              children: subheading
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: subheadingClassName, children: subheading }))
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "relative w-full", children: [
           /* @__PURE__ */ jsx(

package/dist/project-carousel-detail-cards.cjs

@@ -918,6 +918,7 @@ var Section = React6__namespace.default.forwardRef(
     patternClassName,
     ...props
   }, ref) => {
+    const effectivePatternOpacity = patternOpacity !== void 0 ? patternOpacity : pattern ? 1 : 0;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "section",
       {
@@ -937,7 +938,7 @@ var Section = React6__namespace.default.forwardRef(
             PatternBackground,
             {
               pattern,
-              opacity: patternOpacity,
+              opacity: effectivePatternOpacity,
               className: patternClassName
             }
           ),
@@ -1119,39 +1120,48 @@ function ProjectCarouselDetailCards({
   const renderProjects = () => {
     if (projectsSlot) return projectsSlot;
     if (!projects || projects.length === 0) return null;
-    return projects.map((project) => /* @__PURE__ */ jsxRuntime.jsx(CarouselItem, { className: "basis-auto pl-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("w-[600px] space-y-5 rounded-2xl border border-border bg-card p-6 shadow-sm", cardClassName), children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-4/3 overflow-hidden rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
-        img.Img,
-        {
-          src: project.image,
-          alt: project.title,
-          className: "h-full w-full object-cover",
-          optixFlowConfig
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-semibold tracking-tight", children: project.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: project.category })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-2 text-sm text-muted-foreground", children: project.description }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-4 text-sm text-muted-foreground", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/calendar", size: 14 }),
-            project.year
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/map-pin", size: 14 }),
-            project.location
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/tag", size: 14 }),
-            project.category
+    return projects.map((project) => /* @__PURE__ */ jsxRuntime.jsx(CarouselItem, { className: "basis-auto pl-8", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "w-[600px] space-y-5 rounded-2xl border border-border bg-card p-6 shadow-sm",
+          cardClassName
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-4/3 overflow-hidden rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
+            img.Img,
+            {
+              src: project.image,
+              alt: project.title,
+              className: "h-full w-full object-cover",
+              optixFlowConfig
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-semibold tracking-tight", children: project.title }),
+              /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: project.category })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-2 text-sm text-muted-foreground", children: project.description }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-4 text-sm text-muted-foreground", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/calendar", size: 14 }),
+                project.year
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/map-pin", size: 14 }),
+                project.location
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/tag", size: 14 }),
+                project.category
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(Pressable, { variant: "outline", className: "w-full", children: "View Project" })
           ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(Pressable, { variant: "outline", className: "w-full", children: "View Project" })
-      ] })
-    ] }) }, project.id));
+        ]
+      }
+    ) }, project.id));
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -1163,8 +1173,26 @@ function ProjectCarouselDetailCards({
       className: cn(className),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("w-full", containerClassName), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-16 px-8", headerClassName), children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-3xl font-medium tracking-tight lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
-          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg text-muted-foreground", subheadingClassName), children: subheading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subheadingClassName, children: subheading }))
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "h1",
+            {
+              className: cn(
+                "text-3xl font-medium tracking-tight lg:text-6xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+          subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              className: cn(
+                "mt-4 text-lg text-muted-foreground",
+                subheadingClassName
+              ),
+              children: subheading
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subheadingClassName, children: subheading }))
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-full", children: [
           /* @__PURE__ */ jsxRuntime.jsx(

package/dist/project-carousel-detail-cards.d.cts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.cjs';
+import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
 import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.cjs';
@@ -48,7 +49,7 @@ interface ProjectCarouselDetailCardsProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */

package/dist/project-carousel-detail-cards.d.ts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
 import { SectionBackground, SectionSpacing } from './types.js';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
 import './blocks-k17uluAz.js';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
@@ -48,7 +49,7 @@ interface ProjectCarouselDetailCardsProps {
     /**
      * Background pattern
      */
-    pattern?: string;
+    pattern?: PatternName | undefined;
     /**
      * Pattern opacity (0-1)
      */