@opensite/ui 3.3.8 → 3.3.9

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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      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,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

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

@@ -7,7 +7,7 @@ import { Icon } from '@page-speed/icon';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
-import { Pressable } from '@page-speed/pressable';
+import { Pressable, buttonVariants } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-developer-tools-code.tsx
 function cn(...inputs) {
@@ -479,16 +479,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-digital-agency-fullscreen.cjs

@@ -437,16 +437,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-digital-agency-fullscreen.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-digital-agency-fullscreen.tsx
 function cn(...inputs) {
@@ -431,16 +431,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-ecommerce-product-showcase.cjs

@@ -7,9 +7,9 @@ var tailwindMerge = require('tailwind-merge');
 var icon = require('@page-speed/icon');
 var jsxRuntime = require('react/jsx-runtime');
 var img = require('@page-speed/img');
+var pressable = require('@page-speed/pressable');
 var reactSlot = require('@radix-ui/react-slot');
 var classVarianceAuthority = require('class-variance-authority');
-var pressable = require('@page-speed/pressable');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -501,16 +501,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,

package/dist/hero-ecommerce-product-showcase.js

@@ -6,9 +6,9 @@ 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, buttonVariants } from '@page-speed/pressable';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
-import { Pressable } from '@page-speed/pressable';
 
 // components/blocks/hero/hero-ecommerce-product-showcase.tsx
 function cn(...inputs) {
@@ -480,16 +480,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         icon,

package/dist/hero-enterprise-security.cjs

@@ -500,16 +500,27 @@ 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,
+      className: cn(
+        shouldStyleAsButton && pressable.buttonVariants({ variant: resolvedVariant, size: resolvedSize }),
+        actionClassName
+      ),
       ...pressableProps,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         icon,