@opensite/ui 3.0.2 → 3.0.4

package/dist/components.cjs

@@ -10,6 +10,7 @@ var useOnClickOutside = require('@opensite/hooks/useOnClickOutside');
 var react = require('motion/react');
 var img = require('@page-speed/img');
 var reactSlot = require('@radix-ui/react-slot');
+var pressable = require('@page-speed/pressable');
 var classVarianceAuthority = require('class-variance-authority');
 var PopoverPrimitive = require('@radix-ui/react-popover');
 var icon = require('@page-speed/icon');
@@ -916,148 +917,6 @@ var ImageSlider = ({
     }
   );
 };
-var baseStyles = [
-  // Layout
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap shrink-0",
-  // Typography - using CSS variables with sensible defaults
-  "font-[var(--button-font-family,inherit)]",
-  "font-[var(--button-font-weight,500)]",
-  "tracking-[var(--button-letter-spacing,0)]",
-  "leading-[var(--button-line-height,1.25)]",
-  "[text-transform:var(--button-text-transform,none)]",
-  "text-sm",
-  // Border radius
-  "rounded-[var(--button-radius,var(--radius,0.375rem))]",
-  // Smooth transition - using [transition:...] to set full shorthand property (not just transition-property)
-  "[transition:var(--button-transition,all_250ms_cubic-bezier(0.4,0,0.2,1))]",
-  // Box shadow (master level) - using [box-shadow:...] for complex multi-value shadows
-  "[box-shadow:var(--button-shadow,none)]",
-  "hover:[box-shadow:var(--button-shadow-hover,var(--button-shadow,none))]",
-  // Disabled state
-  "disabled:pointer-events-none disabled:opacity-50",
-  // SVG handling
-  "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
-  // Focus styles
-  "outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-  // Invalid state
-  "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-].join(" ");
-var buttonVariants = classVarianceAuthority.cva(baseStyles, {
-  variants: {
-    variant: {
-      // Default (Primary) variant - full customization
-      default: [
-        "bg-[var(--button-default-bg,hsl(var(--primary)))]",
-        "text-[var(--button-default-fg,hsl(var(--primary-foreground)))]",
-        "border-[length:var(--button-default-border-width,0px)]",
-        "border-[color:var(--button-default-border,transparent)]",
-        "[box-shadow:var(--button-default-shadow,var(--button-shadow,none))]",
-        "hover:bg-[var(--button-default-hover-bg,hsl(var(--primary)/0.9))]",
-        "hover:text-[var(--button-default-hover-fg,var(--button-default-fg,hsl(var(--primary-foreground))))]",
-        "hover:border-[color:var(--button-default-hover-border,var(--button-default-border,transparent))]",
-        "hover:[box-shadow:var(--button-default-shadow-hover,var(--button-shadow-hover,var(--button-default-shadow,var(--button-shadow,none))))]"
-      ].join(" "),
-      // Destructive variant - full customization
-      destructive: [
-        "bg-[var(--button-destructive-bg,hsl(var(--destructive)))]",
-        "text-[var(--button-destructive-fg,white)]",
-        "border-[length:var(--button-destructive-border-width,0px)]",
-        "border-[color:var(--button-destructive-border,transparent)]",
-        "[box-shadow:var(--button-destructive-shadow,var(--button-shadow,none))]",
-        "hover:bg-[var(--button-destructive-hover-bg,hsl(var(--destructive)/0.9))]",
-        "hover:text-[var(--button-destructive-hover-fg,var(--button-destructive-fg,white))]",
-        "hover:border-[color:var(--button-destructive-hover-border,var(--button-destructive-border,transparent))]",
-        "hover:[box-shadow:var(--button-destructive-shadow-hover,var(--button-shadow-hover,var(--button-destructive-shadow,var(--button-shadow,none))))]",
-        "focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
-        "dark:bg-destructive/60"
-      ].join(" "),
-      // Outline variant - full customization with proper border handling
-      outline: [
-        "bg-[var(--button-outline-bg,hsl(var(--background)))]",
-        "text-[var(--button-outline-fg,inherit)]",
-        "border-[length:var(--button-outline-border-width,1px)]",
-        "border-[color:var(--button-outline-border,hsl(var(--border)))]",
-        "[box-shadow:var(--button-outline-shadow,var(--button-shadow,0_1px_2px_0_rgb(0_0_0/0.05)))]",
-        "hover:bg-[var(--button-outline-hover-bg,hsl(var(--accent)))]",
-        "hover:text-[var(--button-outline-hover-fg,hsl(var(--accent-foreground)))]",
-        "hover:border-[color:var(--button-outline-hover-border,var(--button-outline-border,hsl(var(--border))))]",
-        "hover:[box-shadow:var(--button-outline-shadow-hover,var(--button-shadow-hover,var(--button-outline-shadow,var(--button-shadow,none))))]",
-        "dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
-      ].join(" "),
-      // Secondary variant - full customization
-      secondary: [
-        "bg-[var(--button-secondary-bg,hsl(var(--secondary)))]",
-        "text-[var(--button-secondary-fg,hsl(var(--secondary-foreground)))]",
-        "border-[length:var(--button-secondary-border-width,0px)]",
-        "border-[color:var(--button-secondary-border,transparent)]",
-        "[box-shadow:var(--button-secondary-shadow,var(--button-shadow,none))]",
-        "hover:bg-[var(--button-secondary-hover-bg,hsl(var(--secondary)/0.8))]",
-        "hover:text-[var(--button-secondary-hover-fg,var(--button-secondary-fg,hsl(var(--secondary-foreground))))]",
-        "hover:border-[color:var(--button-secondary-hover-border,var(--button-secondary-border,transparent))]",
-        "hover:[box-shadow:var(--button-secondary-shadow-hover,var(--button-shadow-hover,var(--button-secondary-shadow,var(--button-shadow,none))))]"
-      ].join(" "),
-      // Ghost variant - full customization
-      ghost: [
-        "bg-[var(--button-ghost-bg,transparent)]",
-        "text-[var(--button-ghost-fg,inherit)]",
-        "border-[length:var(--button-ghost-border-width,0px)]",
-        "border-[color:var(--button-ghost-border,transparent)]",
-        "[box-shadow:var(--button-ghost-shadow,var(--button-shadow,none))]",
-        "hover:bg-[var(--button-ghost-hover-bg,hsl(var(--accent)))]",
-        "hover:text-[var(--button-ghost-hover-fg,hsl(var(--accent-foreground)))]",
-        "hover:border-[color:var(--button-ghost-hover-border,var(--button-ghost-border,transparent))]",
-        "hover:[box-shadow:var(--button-ghost-shadow-hover,var(--button-shadow-hover,var(--button-ghost-shadow,var(--button-shadow,none))))]",
-        "dark:hover:bg-accent/50"
-      ].join(" "),
-      // Link variant - full customization
-      link: [
-        "bg-[var(--button-link-bg,transparent)]",
-        "text-[var(--button-link-fg,hsl(var(--primary)))]",
-        "border-[length:var(--button-link-border-width,0px)]",
-        "border-[color:var(--button-link-border,transparent)]",
-        "[box-shadow:var(--button-link-shadow,none)]",
-        "hover:bg-[var(--button-link-hover-bg,transparent)]",
-        "hover:text-[var(--button-link-hover-fg,var(--button-link-fg,hsl(var(--primary))))]",
-        "hover:[box-shadow:var(--button-link-shadow-hover,none)]",
-        "underline-offset-4 hover:underline"
-      ].join(" ")
-    },
-    size: {
-      default: [
-        "h-[var(--button-height-md,2.25rem)]",
-        "px-[var(--button-padding-x-md,1rem)]",
-        "py-[var(--button-padding-y-md,0.5rem)]",
-        "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
-      ].join(" "),
-      sm: [
-        "h-[var(--button-height-sm,2rem)]",
-        "px-[var(--button-padding-x-sm,0.75rem)]",
-        "py-[var(--button-padding-y-sm,0.25rem)]",
-        "gap-1.5",
-        "has-[>svg]:px-[calc(var(--button-padding-x-sm,0.75rem)*0.83)]"
-      ].join(" "),
-      md: [
-        "h-[var(--button-height-md,2.25rem)]",
-        "px-[var(--button-padding-x-md,1rem)]",
-        "py-[var(--button-padding-y-md,0.5rem)]",
-        "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
-      ].join(" "),
-      lg: [
-        "h-[var(--button-height-lg,2.5rem)]",
-        "px-[var(--button-padding-x-lg,1.5rem)]",
-        "py-[var(--button-padding-y-lg,0.5rem)]",
-        "has-[>svg]:px-[calc(var(--button-padding-x-lg,1.5rem)*0.67)]"
-      ].join(" "),
-      icon: "size-[var(--button-height-md,2.25rem)]",
-      "icon-sm": "size-[var(--button-height-sm,2rem)]",
-      "icon-lg": "size-[var(--button-height-lg,2.5rem)]"
-    }
-  },
-  defaultVariants: {
-    variant: "default",
-    size: "default"
-  }
-});
 function Button({
   className,
   variant = "default",
@@ -1072,7 +931,7 @@ function Button({
       "data-slot": "button",
       "data-variant": variant,
       "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
+      className: cn(pressable.buttonVariants({ variant, size, className })),
       ...props
     }
   );
@@ -1230,282 +1089,6 @@ function StarRating({
     star
   )) });
 }
-function normalizePhoneNumber(input) {
-  const trimmed = input.trim();
-  if (trimmed.toLowerCase().startsWith("tel:")) {
-    return trimmed;
-  }
-  const match = trimmed.match(/^[\s\+\-\(\)]*(\d[\d\s\-\(\)\.]*\d)[\s\-]*(x|ext\.?|extension)?[\s\-]*(\d+)?$/i);
-  if (match) {
-    const mainNumber = match[1].replace(/[\s\-\(\)\.]/g, "");
-    const extension = match[3];
-    const normalized = mainNumber.length >= 10 && !trimmed.startsWith("+") ? `+${mainNumber}` : mainNumber;
-    const withExtension = extension ? `${normalized};ext=${extension}` : normalized;
-    return `tel:${withExtension}`;
-  }
-  const cleaned = trimmed.replace(/[\s\-\(\)\.]/g, "");
-  return `tel:${cleaned}`;
-}
-function normalizeEmail(input) {
-  const trimmed = input.trim();
-  if (trimmed.toLowerCase().startsWith("mailto:")) {
-    return trimmed;
-  }
-  return `mailto:${trimmed}`;
-}
-function isEmail(input) {
-  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-  return emailRegex.test(input.trim());
-}
-function isPhoneNumber(input) {
-  const trimmed = input.trim();
-  if (trimmed.toLowerCase().startsWith("tel:")) {
-    return true;
-  }
-  const phoneRegex = /^[\s\+\-\(\)]*\d[\d\s\-\(\)\.]*\d[\s\-]*(x|ext\.?|extension)?[\s\-]*\d*$/i;
-  return phoneRegex.test(trimmed);
-}
-function isInternalUrl(href) {
-  if (typeof window === "undefined") {
-    return href.startsWith("/") && !href.startsWith("//");
-  }
-  const trimmed = href.trim();
-  if (trimmed.startsWith("/") && !trimmed.startsWith("//")) {
-    return true;
-  }
-  try {
-    const url = new URL(trimmed, window.location.href);
-    const currentOrigin = window.location.origin;
-    const normalizeOrigin = (origin) => origin.replace(/^(https?:\/\/)(www\.)?/, "$1");
-    return normalizeOrigin(url.origin) === normalizeOrigin(currentOrigin);
-  } catch {
-    return false;
-  }
-}
-function toRelativePath(href) {
-  if (typeof window === "undefined") {
-    return href;
-  }
-  const trimmed = href.trim();
-  if (trimmed.startsWith("/") && !trimmed.startsWith("//")) {
-    return trimmed;
-  }
-  try {
-    const url = new URL(trimmed, window.location.href);
-    const currentOrigin = window.location.origin;
-    const normalizeOrigin = (origin) => origin.replace(/^(https?:\/\/)(www\.)?/, "$1");
-    if (normalizeOrigin(url.origin) === normalizeOrigin(currentOrigin)) {
-      return url.pathname + url.search + url.hash;
-    }
-  } catch {
-  }
-  return trimmed;
-}
-function useNavigation({
-  href,
-  onClick
-} = {}) {
-  const linkType = React4__namespace.useMemo(() => {
-    if (!href || href.trim() === "") {
-      return onClick ? "none" : "none";
-    }
-    const trimmed = href.trim();
-    if (trimmed.toLowerCase().startsWith("mailto:") || isEmail(trimmed)) {
-      return "mailto";
-    }
-    if (trimmed.toLowerCase().startsWith("tel:") || isPhoneNumber(trimmed)) {
-      return "tel";
-    }
-    if (isInternalUrl(trimmed)) {
-      return "internal";
-    }
-    try {
-      new URL(trimmed, typeof window !== "undefined" ? window.location.href : "http://localhost");
-      return "external";
-    } catch {
-      return "internal";
-    }
-  }, [href, onClick]);
-  const normalizedHref = React4__namespace.useMemo(() => {
-    if (!href || href.trim() === "") {
-      return void 0;
-    }
-    const trimmed = href.trim();
-    switch (linkType) {
-      case "tel":
-        return normalizePhoneNumber(trimmed);
-      case "mailto":
-        return normalizeEmail(trimmed);
-      case "internal":
-        return toRelativePath(trimmed);
-      case "external":
-        return trimmed;
-      default:
-        return trimmed;
-    }
-  }, [href, linkType]);
-  const target = React4__namespace.useMemo(() => {
-    switch (linkType) {
-      case "external":
-        return "_blank";
-      case "internal":
-        return "_self";
-      case "mailto":
-      case "tel":
-        return void 0;
-      default:
-        return void 0;
-    }
-  }, [linkType]);
-  const rel = React4__namespace.useMemo(() => {
-    if (linkType === "external") {
-      return "noopener noreferrer";
-    }
-    return void 0;
-  }, [linkType]);
-  const isExternal = linkType === "external";
-  const isInternal = linkType === "internal";
-  const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React4__namespace.useCallback(
-    (event) => {
-      if (onClick) {
-        try {
-          onClick(event);
-        } catch (error) {
-          console.error("Error in user onClick handler:", error);
-        }
-      }
-      if (event.defaultPrevented) {
-        return;
-      }
-      if (shouldUseRouter && normalizedHref && event.button === 0 && // left-click only
-      !event.metaKey && !event.altKey && !event.ctrlKey && !event.shiftKey) {
-        if (typeof window !== "undefined") {
-          const handler = window.__opensiteNavigationHandler;
-          if (typeof handler === "function") {
-            try {
-              const handled = handler(normalizedHref, event.nativeEvent || event);
-              if (handled !== false) {
-                event.preventDefault();
-              }
-            } catch (error) {
-              console.error("Error in navigation handler:", error);
-            }
-          }
-        }
-      }
-    },
-    [onClick, shouldUseRouter, normalizedHref]
-  );
-  return {
-    linkType,
-    normalizedHref,
-    target,
-    rel,
-    isExternal,
-    isInternal,
-    shouldUseRouter,
-    handleClick
-  };
-}
-var Pressable = React4__namespace.forwardRef(
-  ({
-    children,
-    className,
-    href,
-    onClick,
-    variant,
-    size,
-    asButton = false,
-    fallbackComponentType = "span",
-    componentType,
-    "aria-label": ariaLabel,
-    "aria-describedby": ariaDescribedby,
-    id,
-    ...props
-  }, ref) => {
-    const navigation = useNavigation({ href, onClick });
-    const {
-      normalizedHref,
-      target,
-      rel,
-      linkType,
-      isInternal,
-      handleClick
-    } = navigation;
-    const shouldRenderLink = normalizedHref && linkType !== "none";
-    const shouldRenderButton = !shouldRenderLink && onClick;
-    const effectiveComponentType = componentType || (shouldRenderLink ? "a" : shouldRenderButton ? "button" : fallbackComponentType);
-    const finalComponentType = isInternal && shouldRenderLink ? "a" : effectiveComponentType;
-    const shouldApplyButtonStyles = asButton || variant || size;
-    const combinedClassName = cn(
-      shouldApplyButtonStyles && buttonVariants({ variant, size }),
-      className
-    );
-    const dataProps = Object.fromEntries(
-      Object.entries(props).filter(([key]) => key.startsWith("data-"))
-    );
-    const buttonDataAttributes = shouldApplyButtonStyles ? {
-      "data-slot": "button",
-      "data-variant": variant ?? "default",
-      "data-size": size ?? "default"
-    } : {};
-    const commonProps = {
-      className: combinedClassName,
-      onClick: handleClick,
-      "aria-label": ariaLabel,
-      "aria-describedby": ariaDescribedby,
-      id,
-      ...dataProps,
-      ...buttonDataAttributes
-    };
-    if (finalComponentType === "a" && shouldRenderLink) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "a",
-        {
-          ref,
-          href: normalizedHref,
-          target,
-          rel,
-          ...commonProps,
-          ...props,
-          children
-        }
-      );
-    }
-    if (finalComponentType === "button") {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          ref,
-          type: props.type || "button",
-          ...commonProps,
-          ...props,
-          children
-        }
-      );
-    }
-    if (finalComponentType === "div") {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          ref,
-          ...commonProps,
-          children
-        }
-      );
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
-      {
-        ref,
-        ...commonProps,
-        children
-      }
-    );
-  }
-);
-Pressable.displayName = "Pressable";
 var BUTTON_SIZES = {
   sm: { buttonSize: "size-8", iconSize: 16 },
   md: { buttonSize: "size-10", iconSize: 20 },
@@ -1541,7 +1124,7 @@ function CarouselPagination({
   );
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex justify-end gap-2", className), children: [
     /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         onClick: onPrevious,
         disabled: !canScrollPrevious,
@@ -1552,7 +1135,7 @@ function CarouselPagination({
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         onClick: onNext,
         disabled: !canScrollNext,
@@ -1636,7 +1219,7 @@ var SocialLinkIcon = React4__namespace.forwardRef(
       return icon;
     }
     return /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         ref,
         href,
@@ -1862,7 +1445,7 @@ function AboutSplitHero({
     if (ctaSlot) return ctaSlot;
     if (!ctaAction) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         href: ctaAction.href,
         onClick: ctaAction.onClick,
@@ -2012,7 +1595,7 @@ function AboutMissionPrinciples({
     if (missionActionSlot) return missionActionSlot;
     if (!missionAction) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("pt-2", missionActionClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         href: missionAction.href,
         onClick: missionAction.onClick,
@@ -2075,7 +1658,7 @@ function AboutMissionPrinciples({
     if (visionActionSlot) return visionActionSlot;
     if (!visionAction) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         href: visionAction.href,
         onClick: visionAction.onClick,
@@ -2205,7 +1788,7 @@ function ActionComponent({ action }) {
     ...pressableProps
   } = action;
   return /* @__PURE__ */ jsxRuntime.jsx(
-    Pressable,
+    pressable.Pressable,
     {
       href,
       onClick,
@@ -2254,7 +1837,7 @@ function AboutExpandableValues({
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         href: action.href,
         onClick: action.onClick,
@@ -3071,7 +2654,7 @@ function BannerAnnouncementDismissible({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           asButton: true,
           className: actionClassName,
@@ -3116,7 +2699,7 @@ function BannerAnnouncementDismissible({
       (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actionsContent })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         onClick: handleDismiss,
         variant: "outline",
@@ -3314,7 +2897,7 @@ function BannerEventPromo({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           asButton: true,
           className: cn("flex items-center gap-x-1", actionClassName),
@@ -3410,7 +2993,7 @@ function BannerFloatingOffer({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           asButton: true,
           className: cn("flex items-center gap-x-1", actionClassName),
@@ -3468,7 +3051,7 @@ function BannerFloatingOffer({
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2", actionsClassName), children: [
           actionsContent,
           isDismissible && /* @__PURE__ */ jsxRuntime.jsxs(
-            Pressable,
+            pressable.Pressable,
             {
               onClick: handleDismiss,
               variant: "ghost",
@@ -3537,7 +3120,7 @@ function BannerGdprRights({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           className: actionClassName,
           ...pressableProps,
@@ -3578,7 +3161,7 @@ function BannerGdprRights({
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         onClick: handleDismiss,
         variant: "ghost",
@@ -3644,7 +3227,7 @@ function BannerPrivacyNotice({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           className: actionClassName,
           ...pressableProps,
@@ -3683,7 +3266,7 @@ function BannerPrivacyNotice({
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         onClick: handleDismiss,
         variant: "outline",
@@ -3726,7 +3309,7 @@ function BannerPromoCta({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           className: cn("inline-flex items-center gap-1 font-medium underline underline-offset-4 hover:no-underline", actionClassName),
           ...pressableProps,
@@ -3807,7 +3390,7 @@ function BannerSocialFollow({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           asButton: true,
           className: actionClassName,
@@ -3838,7 +3421,7 @@ function BannerSocialFollow({
     messageContent,
     (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: actionsClassName, children: actionsContent }),
     /* @__PURE__ */ jsxRuntime.jsxs(
-      Pressable,
+      pressable.Pressable,
       {
         onClick: handleDismiss,
         variant: "ghost",
@@ -3905,7 +3488,7 @@ function BannerSurveyIncentive({
         ...pressableProps
       } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           asButton: true,
           className: actionClassName,
@@ -3946,7 +3529,7 @@ function BannerSurveyIncentive({
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex gap-2", actionsClassName), children: [
       actionsContent,
       /* @__PURE__ */ jsxRuntime.jsxs(
-        Pressable,
+        pressable.Pressable,
         {
           onClick: handleDismiss,
           variant: "outline",
@@ -4023,7 +3606,7 @@ var FooterLogo = ({
   if (!logoContent) return null;
   if (logo.url) {
     return /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         href: logo.url,
         className: cn("inline-flex items-center", logoClassName),
@@ -4607,7 +4190,7 @@ function FooterLinksGrid({
           ] }),
           menuItems && menuItems.length > 0 && menuItems.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 font-bold", children: section.title }),
-            /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "text-sm font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
+            /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "text-sm font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
           ] }, sectionIdx))
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-24 flex flex-col justify-between gap-4 border-t pt-8 text-sm font-medium md:flex-row md:items-center", children: [
@@ -4623,7 +4206,7 @@ function FooterLinksGrid({
               }
             )
           ] }),
-          bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center", children: bottomLinks.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "underline", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
+          bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center", children: bottomLinks.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "underline", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
         ] })
       ] })
     }
@@ -4713,7 +4296,7 @@ function FooterSocialNewsletter({
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(contentClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-20", children: [
           logo && /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
+            pressable.Pressable,
             {
               href: logo.url || "/",
               className: cn("block mb-8 md:mb-12", logoWrapperClassName),
@@ -4762,7 +4345,7 @@ function FooterSocialNewsletter({
                 "li",
                 {
                   className: cn("text-sm font-medium", navLinkClassName),
-                  children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name })
+                  children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, children: link.name })
                 },
                 linkIdx
               )) })
@@ -4828,7 +4411,7 @@ function FooterSocialApps({
     if (!sections || sections.length === 0) return null;
     return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 md:mt-0", children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 font-bold", children: section.title }),
-      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium ", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name }) }, linkIdx)) })
+      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium ", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, children: link.name }) }, linkIdx)) })
     ] }, sectionIdx));
   }, [sections]);
   const socialLinksContent = React4.useMemo(() => {
@@ -4848,7 +4431,7 @@ function FooterSocialApps({
   }, [socialLinks, background]);
   const appLinksContent = React4.useMemo(() => {
     if (!appLinks || appLinks.length === 0) return null;
-    return appLinks.map((app, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: app.href, "aria-label": app.label, children: /* @__PURE__ */ jsxRuntime.jsx(
+    return appLinks.map((app, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: app.href, "aria-label": app.label, children: /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         className: cn(
@@ -4940,7 +4523,7 @@ function FooterSimpleCentered({
     return sitemap.map((section) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(sitemapSectionClassName), children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-sm font-semibold", sitemapTitleClassName), children: section.title }),
       /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("space-y-2", sitemapLinksClassName), children: section.links.map((link) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
+        pressable.Pressable,
         {
           href: link.href,
           className: cn(
@@ -4961,7 +4544,7 @@ function FooterSimpleCentered({
   const bottomLinksContent = React4.useMemo(() => {
     if (!bottomLinks || bottomLinks.length === 0) return null;
     return bottomLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(React4__namespace.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         href: link.href,
         className: cn(
@@ -5201,7 +4784,7 @@ function FooterBrandDescription({
                               "font-medium hover:opacity-100",
                               navLinkClassName
                             ),
-                            children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name })
+                            children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, children: link.name })
                           },
                           linkIdx
                         ))
@@ -5253,7 +4836,7 @@ function FooterBrandDescription({
                     "li",
                     {
                       className: cn("hover:opacity-100", legalLinkClassName),
-                      children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name })
+                      children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, children: link.name })
                     },
                     idx
                   ))
@@ -5293,7 +4876,7 @@ function FooterNewsletterGrid({
         "li",
         {
           className: "font-medium hover:opacity-100",
-          children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name })
+          children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, children: link.name })
         },
         linkIdx
       )) })
@@ -5358,7 +4941,7 @@ function FooterNewsletterGrid({
             (privacyText || privacyLinkText) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "mt-1 text-xs font-medium opacity-80", children: [
               privacyText,
               privacyLinkText && privacyLinkUrl && /* @__PURE__ */ jsxRuntime.jsx(
-                Pressable,
+                pressable.Pressable,
                 {
                   href: privacyLinkUrl,
                   className: "ml-1 hover:underline hover:opacity-100",
@@ -5465,7 +5048,7 @@ function FooterCtaBanner({
                   children: ctaDescription
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: ctaButtonUrl, asButton: true, variant: "default", children: ctaButtonText })
+              /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: ctaButtonUrl, asButton: true, variant: "default", children: ctaButtonText })
             ]
           }
         ),
@@ -5543,7 +5126,7 @@ function FooterCtaBanner({
                       navLinksClassName
                     ),
                     children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                      Pressable,
+                      pressable.Pressable,
                       {
                         href: link.href,
                         className: cn("hover:opacity-100", navLinkClassName),
@@ -5586,7 +5169,7 @@ function FooterCtaBanner({
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex gap-4", legalLinksClassName), children: legalLinks?.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                Pressable,
+                pressable.Pressable,
                 {
                   href: link.href,
                   className: cn("hover:opacity-100", legalLinkClassName),
@@ -5670,7 +5253,7 @@ function FooterContactCard({
             ),
             (email || phone || address) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4 opacity-80", contactClassName), children: [
               email && /* @__PURE__ */ jsxRuntime.jsx("p", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                Pressable,
+                pressable.Pressable,
                 {
                   href: `mailto:${email}`,
                   className: "hover:opacity-100",
@@ -5678,7 +5261,7 @@ function FooterContactCard({
                 }
               ) }),
               phone && /* @__PURE__ */ jsxRuntime.jsx("p", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                Pressable,
+                pressable.Pressable,
                 {
                   href: `tel:${phone}`,
                   className: "hover:opacity-100",
@@ -5721,7 +5304,7 @@ function FooterContactCard({
                   )
                 ] }),
                 navLinks && navLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("nav", { className: cn("mt-18 md:mt-8", navClassName), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-wrap gap-6", children: navLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                  Pressable,
+                  pressable.Pressable,
                   {
                     href: link.href,
                     className: cn(
@@ -5888,7 +5471,7 @@ function FooterBackgroundCard({
                       }
                     ),
                     ctaText && /* @__PURE__ */ jsxRuntime.jsx(
-                      Pressable,
+                      pressable.Pressable,
                       {
                         href: ctaUrl || "#",
                         className: cn(
@@ -5911,7 +5494,7 @@ function FooterBackgroundCard({
                       ),
                       contact && /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: "space-y-3", children: [
                         contact.phone ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn("text-sm", contactItemClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(
-                          Pressable,
+                          pressable.Pressable,
                           {
                             href: contact.phone,
                             className: "group flex items-center gap-2.5 opacity-80 transition-opacity hover:opacity-100",
@@ -5922,7 +5505,7 @@ function FooterBackgroundCard({
                           }
                         ) }) : null,
                         contact.email ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn("text-sm", contactItemClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(
-                          Pressable,
+                          pressable.Pressable,
                           {
                             href: contact.email,
                             className: "group flex items-center gap-2.5 opacity-80 transition-opacity hover:opacity-100",
@@ -5933,7 +5516,7 @@ function FooterBackgroundCard({
                           }
                         ) }) : null,
                         contactLocationLabel ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn("text-sm", contactItemClassName), children: contact.location ? /* @__PURE__ */ jsxRuntime.jsxs(
-                          Pressable,
+                          pressable.Pressable,
                           {
                             href: `https://maps.google.com/?q=${encodeURIComponent(
                               contact.location
@@ -5981,7 +5564,7 @@ function FooterBackgroundCard({
                           }
                         ),
                         /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-3", children: menu.links.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                          Pressable,
+                          pressable.Pressable,
                           {
                             href: link.url,
                             className: cn(
@@ -6028,7 +5611,7 @@ function FooterBackgroundCard({
                     }
                   ),
                   bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex gap-4", bottomLinksClassName), children: bottomLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(
-                    Pressable,
+                    pressable.Pressable,
                     {
                       href: link.url,
                       className: "text-sm opacity-80 transition-colors hover:opacity-100",
@@ -6164,7 +5747,7 @@ function FooterAnimatedSocial({
                   )
                 ] }),
                 ctaUrl && ctaText && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx(
-                  Pressable,
+                  pressable.Pressable,
                   {
                     href: ctaUrl,
                     className: cn(
@@ -6310,7 +5893,7 @@ function FooterNewsletterMinimal({
   const navLinksContent = React4__namespace.useMemo(() => {
     if (!navLinks || navLinks.length === 0) return null;
     return navLinks.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         href: item.href,
         className: cn("tracking-tight hover:opacity-70", navLinkClassName),
@@ -6337,7 +5920,7 @@ function FooterNewsletterMinimal({
   const footerLinksContent = React4__namespace.useMemo(() => {
     if (!footerLinks || footerLinks.length === 0) return null;
     return footerLinks.map((item) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
+      pressable.Pressable,
       {
         href: item.href,
         className: cn(
@@ -6434,7 +6017,7 @@ function FooterNewsletterMinimal({
                     ),
                     children: [
                       supportLabel && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-light opacity-75", children: supportLabel }),
-                      supportEmail && /* @__PURE__ */ jsxRuntime.jsx(Pressable, { className: "font-semibold", href: supportEmail, children: supportEmail })
+                      supportEmail && /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { className: "font-semibold", href: supportEmail, children: supportEmail })
                     ]
                   }
                 ) })
@@ -6616,7 +6199,7 @@ function FooterCtaSocial({
         /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("py-6 text-5xl font-bold md:text-6xl", headingClassName), children: heading }),
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("max-w-2xl text-base opacity-80 md:text-lg", descriptionClassName), children: description }),
         /* @__PURE__ */ jsxRuntime.jsxs(
-          Pressable,
+          pressable.Pressable,
           {
             href: buttonUrl,
             className: cn("group relative mt-4 inline-flex items-center gap-2 rounded-lg border px-8 py-4 text-base font-medium transition-all hover:opacity-80", buttonClassName),
@@ -6635,7 +6218,7 @@ function FooterCtaSocial({
         ),
         socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center gap-6 pt-8", socialLinksClassName), children: socialLinksContent }),
         email && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("pt-2 text-sm opacity-80 md:text-base", emailClassName), children: /* @__PURE__ */ jsxRuntime.jsx(
-          Pressable,
+          pressable.Pressable,
           {
             href: `mailto:${email}`,
             className: "transition-colors hover:opacity-100",
@@ -6705,7 +6288,7 @@ function FooterNavSocial({
     if (!sections || sections.length === 0) return null;
     return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(navSectionClassName), children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 font-semibold", navTitleClassName), children: section.title }),
-      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("space-y-3 text-sm opacity-80", navLinksClassName), children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn(navLinkClassName), children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, className: "hover:opacity-100", children: link.name }) }, linkIdx)) })
+      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("space-y-3 text-sm opacity-80", navLinksClassName), children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn(navLinkClassName), children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, className: "hover:opacity-100", children: link.name }) }, linkIdx)) })
     ] }, sectionIdx));
   }, [
     sections,
@@ -6731,7 +6314,7 @@ function FooterNavSocial({
   }, [socialLinks, socialLinkClassName]);
   const legalLinksContent = React4.useMemo(() => {
     if (!legalLinks || legalLinks.length === 0) return null;
-    return legalLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn(legalLinkClassName), children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, className: "hover:opacity-100", children: link.name }) }, idx));
+    return legalLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn(legalLinkClassName), children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: link.href, className: "hover:opacity-100", children: link.name }) }, idx));
   }, [legalLinks, legalLinkClassName]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -6895,6 +6478,10 @@ function FooterNavSocial({
   );
 }
 
+Object.defineProperty(exports, "Pressable", {
+  enumerable: true,
+  get: function () { return pressable.Pressable; }
+});
 exports.AboutCultureTabs = AboutCultureTabs;
 exports.AboutExpandableValues = AboutExpandableValues;
 exports.AboutMissionPrinciples = AboutMissionPrinciples;
@@ -6943,7 +6530,6 @@ exports.PaymentPlatformIcon = PaymentPlatformIcon;
 exports.Popover = Popover;
 exports.PopoverContent = PopoverContent;
 exports.PopoverTrigger = PopoverTrigger;
-exports.Pressable = Pressable;
 exports.Section = Section;
 exports.SocialLinkIcon = SocialLinkIcon;
 exports.StarRating = StarRating;