@opensite/ui 3.3.8 → 3.4.0

package/dist/hero-community-survey-cta.cjs

@@ -471,16 +471,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-community-survey-cta.js

@@ -2,7 +2,7 @@
 import React, { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 import { Img } from '@page-speed/img';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
@@ -465,16 +465,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-conversation-intelligence.cjs

@@ -437,16 +437,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-conversation-intelligence.js

@@ -4,7 +4,7 @@ import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-conversation-intelligence.tsx
 function cn(...inputs) {
@@ -431,16 +431,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-creative-studio-stacked.cjs

@@ -525,16 +525,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-creative-studio-stacked.js

@@ -10,7 +10,7 @@ import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { Icon } from '@page-speed/icon';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-creative-studio-stacked.tsx
 function cn(...inputs) {
@@ -502,16 +502,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-crm-streamlined.cjs

@@ -437,16 +437,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-crm-streamlined.js

@@ -4,7 +4,7 @@ import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
 import React from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // lib/utils.ts
 function cn(...inputs) {
@@ -431,16 +431,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-customer-support-layered.cjs

@@ -437,16 +437,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-customer-support-layered.js

@@ -4,7 +4,7 @@ import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-customer-support-layered.tsx
 function cn(...inputs) {
@@ -431,16 +431,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-design-carousel-portfolio.cjs

@@ -604,16 +604,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-design-carousel-portfolio.js

@@ -9,7 +9,7 @@ import { Icon } from '@page-speed/icon';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { Img } from '@page-speed/img';
 import useEmblaCarousel from 'embla-carousel-react';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-design-carousel-portfolio.tsx
 function cn(...inputs) {
@@ -578,16 +578,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-design-showcase-logos.cjs

@@ -437,16 +437,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-design-showcase-logos.js

@@ -4,7 +4,7 @@ import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-design-showcase-logos.tsx
 function cn(...inputs) {
@@ -431,16 +431,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-design-system-3d.cjs

@@ -467,16 +467,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-design-system-3d.js

@@ -6,7 +6,7 @@ import { twMerge } from 'tailwind-merge';
 import { Icon } from '@page-speed/icon';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { Img } from '@page-speed/img';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-design-system-3d.tsx
 function cn(...inputs) {
@@ -446,16 +446,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-developer-tools-code.cjs

@@ -500,16 +500,30 @@ function ActionComponent({ action }) {
     children,
     href,
     onClick,
+    asButton,
+    variant,
+    size,
     className: actionClassName,
     ...pressableProps
   } = action;
+  const shouldStyleAsButton = asButton ?? true;
+  const resolvedVariant = shouldStyleAsButton ? variant ?? "default" : void 0;
+  const resolvedSize = shouldStyleAsButton ? size ?? "default" : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     pressable.Pressable,
     {
       href,
       onClick,
-      asButton: action.asButton ?? true,
-      className: actionClassName,
+      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
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,