"use client";
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import * as React from 'react';
import { cva } from 'class-variance-authority';
import { jsx, jsxs } from 'react/jsx-runtime';
import { Img } from '@page-speed/img';
import * as AccordionPrimitive from '@radix-ui/react-accordion';
import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
import * as SheetPrimitive from '@radix-ui/react-dialog';

// lib/utils.ts
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
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 = React.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 = React.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 = React.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 = React.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 = React.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 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 = 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"
  }
});
var Pressable = React.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__ */ jsx(
        "a",
        {
          ref,
          href: normalizedHref,
          target,
          rel,
          ...commonProps,
          ...props,
          children
        }
      );
    }
    if (finalComponentType === "button") {
      return /* @__PURE__ */ jsx(
        "button",
        {
          ref,
          type: props.type || "button",
          ...commonProps,
          ...props,
          children
        }
      );
    }
    if (finalComponentType === "div") {
      return /* @__PURE__ */ jsx(
        "div",
        {
          ref,
          ...commonProps,
          children
        }
      );
    }
    return /* @__PURE__ */ jsx(
      "span",
      {
        ref,
        ...commonProps,
        children
      }
    );
  }
);
Pressable.displayName = "Pressable";
var svgCache = /* @__PURE__ */ new Map();
function DynamicIcon({
  name,
  size = 28,
  color,
  className,
  alt
}) {
  const [svgContent, setSvgContent] = React.useState(null);
  const [isLoading, setIsLoading] = React.useState(true);
  const [error, setError] = React.useState(null);
  const { url, iconName } = React.useMemo(() => {
    const separator = name.includes("/") ? "/" : ":";
    const [prefix, iconName2] = name.split(separator);
    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
    return {
      url: baseUrl,
      iconName: iconName2
    };
  }, [name, size]);
  React.useEffect(() => {
    let isMounted = true;
    const fetchSvg = async () => {
      const cached = svgCache.get(url);
      if (cached) {
        if (isMounted) {
          setSvgContent(cached);
          setIsLoading(false);
        }
        return;
      }
      try {
        setIsLoading(true);
        setError(null);
        const response = await fetch(url);
        if (!response.ok) {
          throw new Error(`Failed to fetch icon: ${response.status}`);
        }
        let svg = await response.text();
        svg = processSvgForCurrentColor(svg);
        svgCache.set(url, svg);
        if (isMounted) {
          setSvgContent(svg);
          setIsLoading(false);
        }
      } catch (err) {
        if (isMounted) {
          setError(err instanceof Error ? err.message : "Failed to load icon");
          setIsLoading(false);
        }
      }
    };
    fetchSvg();
    return () => {
      isMounted = false;
    };
  }, [url]);
  if (isLoading) {
    return /* @__PURE__ */ jsx(
      "span",
      {
        className: cn("inline-block", className),
        style: { width: size, height: size },
        "aria-hidden": "true"
      }
    );
  }
  if (error || !svgContent) {
    return /* @__PURE__ */ jsx(
      "span",
      {
        className: cn("inline-block", className),
        style: { width: size, height: size },
        role: "img",
        "aria-label": alt || iconName
      }
    );
  }
  return /* @__PURE__ */ jsx(
    "span",
    {
      className: cn("inline-flex items-center justify-center", className),
      style: {
        width: size,
        height: size,
        color: color || "inherit"
      },
      role: "img",
      "aria-label": alt || iconName,
      dangerouslySetInnerHTML: { __html: svgContent }
    }
  );
}
function processSvgForCurrentColor(svg) {
  let processed = svg;
  processed = processed.replace(
    /stroke=["'](#000000|#000|black)["']/gi,
    'stroke="currentColor"'
  );
  processed = processed.replace(
    /fill=["'](#000000|#000|black)["']/gi,
    'fill="currentColor"'
  );
  return processed;
}
function Accordion({
  ...props
}) {
  return /* @__PURE__ */ jsx(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
}
function AccordionItem({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AccordionPrimitive.Item,
    {
      "data-slot": "accordion-item",
      className: cn("border-b last:border-b-0", className),
      ...props
    }
  );
}
function AccordionTrigger({
  className,
  children,
  ...props
}) {
  return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
    AccordionPrimitive.Trigger,
    {
      "data-slot": "accordion-trigger",
      className: cn(
        "focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
        className
      ),
      ...props,
      children: [
        children,
        /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-down", className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })
      ]
    }
  ) });
}
function AccordionContent({
  className,
  children,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AccordionPrimitive.Content,
    {
      "data-slot": "accordion-content",
      className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
      ...props,
      children: /* @__PURE__ */ jsx("div", { className: cn("pt-0 pb-4", className), children })
    }
  );
}
function NavigationMenu({
  className,
  children,
  viewport = true,
  ...props
}) {
  return /* @__PURE__ */ jsxs(
    NavigationMenuPrimitive.Root,
    {
      "data-slot": "navigation-menu",
      "data-viewport": viewport,
      className: cn(
        "group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
        className
      ),
      ...props,
      children: [
        children,
        viewport && /* @__PURE__ */ jsx(NavigationMenuViewport, {})
      ]
    }
  );
}
function NavigationMenuList({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    NavigationMenuPrimitive.List,
    {
      "data-slot": "navigation-menu-list",
      className: cn(
        "group flex flex-1 list-none items-center justify-center gap-1",
        className
      ),
      ...props
    }
  );
}
function NavigationMenuItem({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    NavigationMenuPrimitive.Item,
    {
      "data-slot": "navigation-menu-item",
      className: cn("relative", className),
      ...props
    }
  );
}
var navigationMenuTriggerStyle = cva(
  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1"
);
function NavigationMenuTrigger({
  className,
  children,
  ...props
}) {
  return /* @__PURE__ */ jsxs(
    NavigationMenuPrimitive.Trigger,
    {
      "data-slot": "navigation-menu-trigger",
      className: cn(navigationMenuTriggerStyle(), "group", className),
      ...props,
      children: [
        children,
        " ",
        /* @__PURE__ */ jsx(
          DynamicIcon,
          {
            name: "lucide/chevron-down",
            className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
            "aria-hidden": "true"
          }
        )
      ]
    }
  );
}
function NavigationMenuContent({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    NavigationMenuPrimitive.Content,
    {
      "data-slot": "navigation-menu-content",
      className: cn(
        "data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto",
        "group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none",
        className
      ),
      ...props
    }
  );
}
function NavigationMenuViewport({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: cn(
        "absolute top-full left-0 isolate z-50 flex justify-center"
      ),
      children: /* @__PURE__ */ jsx(
        NavigationMenuPrimitive.Viewport,
        {
          "data-slot": "navigation-menu-viewport",
          className: cn(
            "origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
            className
          ),
          ...props
        }
      )
    }
  );
}
function NavigationMenuLink({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    NavigationMenuPrimitive.Link,
    {
      "data-slot": "navigation-menu-link",
      className: cn(
        "data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4",
        className
      ),
      ...props
    }
  );
}
function Sheet({ ...props }) {
  return /* @__PURE__ */ jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
}
function SheetTrigger({
  ...props
}) {
  return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
}
function SheetPortal({
  ...props
}) {
  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
}
function SheetOverlay({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    SheetPrimitive.Overlay,
    {
      "data-slot": "sheet-overlay",
      className: cn(
        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
        className
      ),
      ...props
    }
  );
}
function SheetContent({
  className,
  children,
  side = "right",
  ...props
}) {
  return /* @__PURE__ */ jsxs(SheetPortal, { children: [
    /* @__PURE__ */ jsx(SheetOverlay, {}),
    /* @__PURE__ */ jsxs(
      SheetPrimitive.Content,
      {
        "data-slot": "sheet-content",
        className: cn(
          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
          side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
          side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
          side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
          side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
          className
        ),
        ...props,
        children: [
          children,
          /* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
            /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
            /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
          ] })
        ]
      }
    )
  ] });
}
function SheetHeader({ className, ...props }) {
  return /* @__PURE__ */ jsx(
    "div",
    {
      "data-slot": "sheet-header",
      className: cn("flex flex-col gap-1.5 p-4", className),
      ...props
    }
  );
}
function SheetTitle({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    SheetPrimitive.Title,
    {
      "data-slot": "sheet-title",
      className: cn("text-foreground font-semibold", className),
      ...props
    }
  );
}

// lib/mediaPlaceholders.ts
var logoPlaceholders = {
  logoMark: "https://cdn.ing/assets/i/r/285975/eud79qeya11q5w6ueyhklueardyx/monochrome-rounded-square-app-icon-circular-emblem.png"};
var defaultFeatures = [
  {
    title: "Dashboard",
    description: "Overview of your activity",
    href: "#"
  },
  {
    title: "Analytics",
    description: "Track your performance",
    href: "#"
  },
  {
    title: "Settings",
    description: "Configure your preferences",
    href: "#"
  },
  {
    title: "Integrations",
    description: "Connect with other tools",
    href: "#"
  },
  {
    title: "Storage",
    description: "Manage your files",
    href: "#"
  },
  {
    title: "Support",
    description: "Get help when needed",
    href: "#"
  }
];
var NavbarFeatureGrid = ({
  className,
  logo = {
    url: "/",
    src: logoPlaceholders.logoMark,
    alt: "Opensite AI",
    title: "Opensite AI"
  },
  features = defaultFeatures,
  optixFlowConfig
}) => {
  return /* @__PURE__ */ jsx("section", { className: cn("py-4", className), children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsxs("nav", { className: "flex items-center justify-between", children: [
    /* @__PURE__ */ jsxs(Pressable, { href: logo.url, className: "flex items-center gap-2", children: [
      /* @__PURE__ */ jsx(
        Img,
        {
          src: logo.src,
          className: "max-h-8",
          alt: logo.alt,
          optixFlowConfig
        }
      ),
      /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold tracking-tighter", children: logo.title })
    ] }),
    /* @__PURE__ */ jsx(NavigationMenu, { className: "hidden lg:block", children: /* @__PURE__ */ jsxs(NavigationMenuList, { children: [
      /* @__PURE__ */ jsxs(NavigationMenuItem, { children: [
        /* @__PURE__ */ jsx(NavigationMenuTrigger, { children: "Features" }),
        /* @__PURE__ */ jsx(NavigationMenuContent, { children: /* @__PURE__ */ jsx("div", { className: "grid w-[600px] grid-cols-2 p-3", children: features.map((feature, index) => /* @__PURE__ */ jsx(
          NavigationMenuLink,
          {
            href: feature.href,
            className: "rounded-md p-3 transition-colors hover:bg-muted/70",
            children: /* @__PURE__ */ jsxs("div", { children: [
              /* @__PURE__ */ jsx("p", { className: "mb-1 font-semibold text-foreground", children: feature.title }),
              /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: feature.description })
            ] })
          },
          index
        )) }) })
      ] }),
      /* @__PURE__ */ jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsx(
        NavigationMenuLink,
        {
          href: "#",
          className: navigationMenuTriggerStyle(),
          children: "Products"
        }
      ) }),
      /* @__PURE__ */ jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsx(
        NavigationMenuLink,
        {
          href: "#",
          className: navigationMenuTriggerStyle(),
          children: "Resources"
        }
      ) }),
      /* @__PURE__ */ jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsx(
        NavigationMenuLink,
        {
          href: "#",
          className: navigationMenuTriggerStyle(),
          children: "Contact"
        }
      ) })
    ] }) }),
    /* @__PURE__ */ jsxs("div", { className: "hidden items-center gap-4 lg:flex", children: [
      /* @__PURE__ */ jsx(Pressable, { href: "#", variant: "outline", asButton: true, children: "Sign in" }),
      /* @__PURE__ */ jsx(Pressable, { href: "#", asButton: true, children: "Start for free" })
    ] }),
    /* @__PURE__ */ jsxs(Sheet, { children: [
      /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, className: "lg:hidden", children: /* @__PURE__ */ jsx(Pressable, { variant: "outline", size: "icon", asButton: true, onClick: () => {
      }, children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/menu", size: 16 }) }) }),
      /* @__PURE__ */ jsxs(SheetContent, { side: "top", className: "max-h-screen overflow-auto", children: [
        /* @__PURE__ */ jsx(SheetHeader, { children: /* @__PURE__ */ jsx(SheetTitle, { children: /* @__PURE__ */ jsxs(Pressable, { href: logo.url, className: "flex items-center gap-2", children: [
          /* @__PURE__ */ jsx(
            Img,
            {
              src: logo.src,
              className: "max-h-8",
              alt: logo.alt,
              optixFlowConfig
            }
          ),
          /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold tracking-tighter", children: logo.title })
        ] }) }) }),
        /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-4", children: [
          /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: "mt-4 mb-2", children: /* @__PURE__ */ jsxs(AccordionItem, { value: "solutions", className: "border-none", children: [
            /* @__PURE__ */ jsx(AccordionTrigger, { className: "text-base hover:no-underline", children: "Features" }),
            /* @__PURE__ */ jsx(AccordionContent, { children: /* @__PURE__ */ jsx("div", { className: "grid md:grid-cols-2", children: features.map((feature, index) => /* @__PURE__ */ jsx(
              Pressable,
              {
                href: feature.href,
                className: "rounded-md p-3 transition-colors hover:bg-muted/70",
                children: /* @__PURE__ */ jsxs("div", { children: [
                  /* @__PURE__ */ jsx("p", { className: "mb-1 font-semibold text-foreground", children: feature.title }),
                  /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: feature.description })
                ] })
              },
              index
            )) }) })
          ] }) }),
          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
            /* @__PURE__ */ jsx(Pressable, { href: "#", className: "font-medium", children: "Templates" }),
            /* @__PURE__ */ jsx(Pressable, { href: "#", className: "font-medium", children: "Blog" }),
            /* @__PURE__ */ jsx(Pressable, { href: "#", className: "font-medium", children: "Pricing" })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "mt-6 flex flex-col gap-4", children: [
            /* @__PURE__ */ jsx(Pressable, { href: "#", variant: "outline", asButton: true, children: "Sign in" }),
            /* @__PURE__ */ jsx(Pressable, { href: "#", asButton: true, children: "Start for free" })
          ] })
        ] })
      ] })
    ] })
  ] }) }) });
};

export { NavbarFeatureGrid };
//# sourceMappingURL=navbar-feature-grid.js.map
//# sourceMappingURL=navbar-feature-grid.js.map