@opensite/ui 3.3.9 → 3.4.0

package/dist/hero-spiral-pattern-cards.cjs

@@ -488,6 +488,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-spiral-pattern-cards.js

@@ -482,6 +482,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-split-geometric-shapes.cjs

@@ -455,6 +455,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-split-geometric-shapes.js

@@ -449,6 +449,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-startup-launch-cta.cjs

@@ -488,6 +488,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-startup-launch-cta.js

@@ -482,6 +482,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-stats-social-proof.cjs

@@ -488,6 +488,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-stats-social-proof.js

@@ -482,6 +482,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-task-timer-animated.cjs

@@ -479,6 +479,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-task-timer-animated.js

@@ -454,6 +454,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-testimonial-image-grid.cjs

@@ -526,6 +526,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-testimonial-image-grid.js

@@ -500,6 +500,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-therapy-testimonial-grid.cjs

@@ -454,6 +454,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-therapy-testimonial-grid.js

@@ -448,6 +448,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-ui-library-showcase.cjs

@@ -479,6 +479,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-ui-library-showcase.js

@@ -454,6 +454,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-video-background-dark.cjs

@@ -549,6 +549,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-video-background-dark.js

@@ -543,6 +543,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-video-dialog-gradient.cjs

@@ -542,6 +542,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-video-dialog-gradient.js

@@ -519,6 +519,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-video-overlay-stars.cjs

@@ -484,6 +484,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-video-overlay-stars.js

@@ -463,6 +463,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-welcome-asymmetric-images.cjs

@@ -454,6 +454,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/hero-welcome-asymmetric-images.js

@@ -448,6 +448,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/index.cjs

@@ -2041,6 +2041,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/index.js

@@ -2019,6 +2019,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/process-sticky-steps.cjs

@@ -483,6 +483,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName
@@ -557,11 +560,11 @@ function ProcessStickySteps({
   const renderSteps = React.useMemo(() => {
     if (stepsSlot) return stepsSlot;
     if (!steps?.length) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("relative w-full min-w-0", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("relative col-span-4 w-full lg:pl-28", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxRuntime.jsxs(
       "li",
       {
         className: cn(
-          "relative grid grid-cols-1 gap-6 border-t py-8 md:grid-cols-[auto_minmax(0,1fr)] md:gap-10 lg:py-10",
+          "relative flex flex-col justify-between gap-10 border-t py-8 md:flex-row lg:py-10",
           stepItemClassName,
           step.className
         ),
@@ -585,7 +588,7 @@ function ProcessStickySteps({
               children: step.step ?? `0${index + 1}`
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 pr-10", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: step.href, className: "mb-4 block", children: /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) }) : /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: step.href, className: "mb-4 block", children: step.title })),
             step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { children: step.description }) : step.description)
           ] })
@@ -608,28 +611,19 @@ function ProcessStickySteps({
         "div",
         {
           className: cn(
-            "grid grid-cols-1 gap-10 lg:grid-cols-[minmax(0,0.85fr)_minmax(0,1.35fr)] lg:gap-16 xl:gap-24",
+            "grid grid-cols-1 gap-5 lg:grid-cols-6 lg:gap-24",
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "top-10 h-fit min-w-0 max-w-full space-y-7 py-8 lg:sticky", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative max-w-full text-5xl font-semibold tracking-tight lg:text-6xl xl:text-7xl", children: [
-                heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                  "h1",
-                  {
-                    className: cn(
-                      "max-w-[12ch] text-balance break-words",
-                      headingClassName
-                    ),
-                    children: heading
-                  }
-                ) : heading),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "top-10 col-span-2 h-fit w-fit gap-3 space-y-7 py-8 lg:sticky", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-fit text-5xl font-semibold tracking-tight lg:text-7xl", children: [
+                heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("w-fit", headingClassName), children: heading }) : heading),
                 /* @__PURE__ */ jsxRuntime.jsx(
                   DynamicIcon,
                   {
                     name: "lucide/asterisk",
                     size: 40,
-                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-14"
+                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-10"
                   }
                 )
               ] }),

package/dist/process-sticky-steps.js

@@ -462,6 +462,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName
@@ -536,11 +539,11 @@ function ProcessStickySteps({
   const renderSteps = useMemo(() => {
     if (stepsSlot) return stepsSlot;
     if (!steps?.length) return null;
-    return /* @__PURE__ */ jsx("ul", { className: cn("relative w-full min-w-0", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx("ul", { className: cn("relative col-span-4 w-full lg:pl-28", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxs(
       "li",
       {
         className: cn(
-          "relative grid grid-cols-1 gap-6 border-t py-8 md:grid-cols-[auto_minmax(0,1fr)] md:gap-10 lg:py-10",
+          "relative flex flex-col justify-between gap-10 border-t py-8 md:flex-row lg:py-10",
           stepItemClassName,
           step.className
         ),
@@ -564,7 +567,7 @@ function ProcessStickySteps({
               children: step.step ?? `0${index + 1}`
             }
           ),
-          /* @__PURE__ */ jsxs("div", { className: "min-w-0 pr-10", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx(Pressable, { href: step.href, className: "mb-4 block", children: /* @__PURE__ */ jsx("h3", { className: "text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) }) : /* @__PURE__ */ jsx(Pressable, { href: step.href, className: "mb-4 block", children: step.title })),
             step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { children: step.description }) : step.description)
           ] })
@@ -587,28 +590,19 @@ function ProcessStickySteps({
         "div",
         {
           className: cn(
-            "grid grid-cols-1 gap-10 lg:grid-cols-[minmax(0,0.85fr)_minmax(0,1.35fr)] lg:gap-16 xl:gap-24",
+            "grid grid-cols-1 gap-5 lg:grid-cols-6 lg:gap-24",
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ jsxs("div", { className: "top-10 h-fit min-w-0 max-w-full space-y-7 py-8 lg:sticky", children: [
-              /* @__PURE__ */ jsxs("div", { className: "relative max-w-full text-5xl font-semibold tracking-tight lg:text-6xl xl:text-7xl", children: [
-                heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
-                  "h1",
-                  {
-                    className: cn(
-                      "max-w-[12ch] text-balance break-words",
-                      headingClassName
-                    ),
-                    children: heading
-                  }
-                ) : heading),
+            /* @__PURE__ */ jsxs("div", { className: "top-10 col-span-2 h-fit w-fit gap-3 space-y-7 py-8 lg:sticky", children: [
+              /* @__PURE__ */ jsxs("div", { className: "relative w-fit text-5xl font-semibold tracking-tight lg:text-7xl", children: [
+                heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("w-fit", headingClassName), children: heading }) : heading),
                 /* @__PURE__ */ jsx(
                   DynamicIcon,
                   {
                     name: "lucide/asterisk",
                     size: 40,
-                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-14"
+                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-10"
                   }
                 )
               ] }),

package/dist/registry.cjs

@@ -1775,6 +1775,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName
@@ -78323,11 +78326,11 @@ function ProcessStickySteps({
   const renderSteps = React30.useMemo(() => {
     if (stepsSlot) return stepsSlot;
     if (!steps?.length) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("relative w-full min-w-0", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("relative col-span-4 w-full lg:pl-28", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxRuntime.jsxs(
       "li",
       {
         className: cn(
-          "relative grid grid-cols-1 gap-6 border-t py-8 md:grid-cols-[auto_minmax(0,1fr)] md:gap-10 lg:py-10",
+          "relative flex flex-col justify-between gap-10 border-t py-8 md:flex-row lg:py-10",
           stepItemClassName,
           step.className
         ),
@@ -78351,7 +78354,7 @@ function ProcessStickySteps({
               children: step.step ?? `0${index + 1}`
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 pr-10", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: step.href, className: "mb-4 block", children: /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) }) : /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: step.href, className: "mb-4 block", children: step.title })),
             step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { children: step.description }) : step.description)
           ] })
@@ -78374,28 +78377,19 @@ function ProcessStickySteps({
         "div",
         {
           className: cn(
-            "grid grid-cols-1 gap-10 lg:grid-cols-[minmax(0,0.85fr)_minmax(0,1.35fr)] lg:gap-16 xl:gap-24",
+            "grid grid-cols-1 gap-5 lg:grid-cols-6 lg:gap-24",
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "top-10 h-fit min-w-0 max-w-full space-y-7 py-8 lg:sticky", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative max-w-full text-5xl font-semibold tracking-tight lg:text-6xl xl:text-7xl", children: [
-                heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                  "h1",
-                  {
-                    className: cn(
-                      "max-w-[12ch] text-balance break-words",
-                      headingClassName
-                    ),
-                    children: heading
-                  }
-                ) : heading),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "top-10 col-span-2 h-fit w-fit gap-3 space-y-7 py-8 lg:sticky", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-fit text-5xl font-semibold tracking-tight lg:text-7xl", children: [
+                heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("w-fit", headingClassName), children: heading }) : heading),
                 /* @__PURE__ */ jsxRuntime.jsx(
                   DynamicIcon,
                   {
                     name: "lucide/asterisk",
                     size: 40,
-                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-14"
+                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-10"
                   }
                 )
               ] }),

package/dist/registry.js

@@ -1735,6 +1735,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName
@@ -78283,11 +78286,11 @@ function ProcessStickySteps({
   const renderSteps = useMemo(() => {
     if (stepsSlot) return stepsSlot;
     if (!steps?.length) return null;
-    return /* @__PURE__ */ jsx("ul", { className: cn("relative w-full min-w-0", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx("ul", { className: cn("relative col-span-4 w-full lg:pl-28", stepsClassName), children: steps.map((step, index) => /* @__PURE__ */ jsxs(
       "li",
       {
         className: cn(
-          "relative grid grid-cols-1 gap-6 border-t py-8 md:grid-cols-[auto_minmax(0,1fr)] md:gap-10 lg:py-10",
+          "relative flex flex-col justify-between gap-10 border-t py-8 md:flex-row lg:py-10",
           stepItemClassName,
           step.className
         ),
@@ -78311,7 +78314,7 @@ function ProcessStickySteps({
               children: step.step ?? `0${index + 1}`
             }
           ),
-          /* @__PURE__ */ jsxs("div", { className: "min-w-0 pr-10", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx(Pressable, { href: step.href, className: "mb-4 block", children: /* @__PURE__ */ jsx("h3", { className: "text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) }) : /* @__PURE__ */ jsx(Pressable, { href: step.href, className: "mb-4 block", children: step.title })),
             step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { children: step.description }) : step.description)
           ] })
@@ -78334,28 +78337,19 @@ function ProcessStickySteps({
         "div",
         {
           className: cn(
-            "grid grid-cols-1 gap-10 lg:grid-cols-[minmax(0,0.85fr)_minmax(0,1.35fr)] lg:gap-16 xl:gap-24",
+            "grid grid-cols-1 gap-5 lg:grid-cols-6 lg:gap-24",
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ jsxs("div", { className: "top-10 h-fit min-w-0 max-w-full space-y-7 py-8 lg:sticky", children: [
-              /* @__PURE__ */ jsxs("div", { className: "relative max-w-full text-5xl font-semibold tracking-tight lg:text-6xl xl:text-7xl", children: [
-                heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
-                  "h1",
-                  {
-                    className: cn(
-                      "max-w-[12ch] text-balance break-words",
-                      headingClassName
-                    ),
-                    children: heading
-                  }
-                ) : heading),
+            /* @__PURE__ */ jsxs("div", { className: "top-10 col-span-2 h-fit w-fit gap-3 space-y-7 py-8 lg:sticky", children: [
+              /* @__PURE__ */ jsxs("div", { className: "relative w-fit text-5xl font-semibold tracking-tight lg:text-7xl", children: [
+                heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("w-fit", headingClassName), children: heading }) : heading),
                 /* @__PURE__ */ jsx(
                   DynamicIcon,
                   {
                     name: "lucide/asterisk",
                     size: 40,
-                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-14"
+                    className: "absolute -top-2 -right-2 md:size-10 lg:-right-10"
                   }
                 )
               ] }),

package/dist/stats-growth-timeline.cjs

@@ -517,6 +517,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/stats-growth-timeline.js

@@ -496,6 +496,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/testimonials-grid-add-review.cjs

@@ -570,6 +570,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/testimonials-grid-add-review.js

@@ -548,6 +548,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/testimonials-masonry-grid.cjs

@@ -518,6 +518,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName

package/dist/testimonials-masonry-grid.js

@@ -493,6 +493,9 @@ function ActionComponent({ action }) {
       asButton: shouldStyleAsButton,
       variant: resolvedVariant,
       size: resolvedSize,
+      "data-slot": shouldStyleAsButton ? "button" : void 0,
+      "data-variant": resolvedVariant,
+      "data-size": resolvedSize,
       className: cn(
         shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
         actionClassName