@opensite/ui 1.5.4 → 1.5.5

package/dist/components.cjs

@@ -5414,7 +5414,7 @@ function FooterNewsletterMinimal({
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-20 flex flex-col justify-between gap-15 lg:flex-row", newsletterSectionClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full max-w-md flex-col gap-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1 text-sm font-light tracking-tight lg:text-base", children: [
+          formConfig?.token && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full max-w-md flex-col gap-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1 text-sm font-light tracking-tight lg:text-base", children: [
             newsletterLabel && /* @__PURE__ */ jsxRuntime.jsx("p", { children: newsletterLabel }),
             /* @__PURE__ */ jsxRuntime.jsxs(
               forms.Form,

package/dist/components.js

@@ -5391,7 +5391,7 @@ function FooterNewsletterMinimal({
           ] })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: cn("mt-20 flex flex-col justify-between gap-15 lg:flex-row", newsletterSectionClassName), children: [
-          /* @__PURE__ */ jsx("div", { className: "flex w-full max-w-md flex-col gap-10", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1 text-sm font-light tracking-tight lg:text-base", children: [
+          formConfig?.token && /* @__PURE__ */ jsx("div", { className: "flex w-full max-w-md flex-col gap-10", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1 text-sm font-light tracking-tight lg:text-base", children: [
             newsletterLabel && /* @__PURE__ */ jsx("p", { children: newsletterLabel }),
             /* @__PURE__ */ jsxs(
               Form,

package/dist/feature-integration-cards.cjs

@@ -4,8 +4,8 @@
 var React = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
-var jsxRuntime = require('react/jsx-runtime');
 var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
 var img = require('@page-speed/img');
 
 function _interopNamespace(e) {
@@ -32,163 +32,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
-function getTextColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-foreground/80";
-      case "subtle":
-        return "text-foreground/60";
-      case "accent":
-        return "text-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-muted-foreground";
-      case "subtle":
-        return "text-muted-foreground/70";
-      case "accent":
-        return "text-primary";
-    }
-  }
-}
-function getAccentColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-accent-foreground" : "text-primary";
-}
-function getBorderColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "border-foreground/20";
-      case "muted":
-        return "border-foreground/10";
-      case "accent":
-        return "border-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "border-border";
-      case "muted":
-        return "border-muted";
-      case "accent":
-        return "border-primary";
-    }
-  }
-}
-var svgCache = /* @__PURE__ */ new Map();
-function DynamicIcon({
-  name,
-  size = 28,
-  color,
-  className,
-  alt
-}) {
-  const [svgContent, setSvgContent] = React__namespace.useState(null);
-  const [isLoading, setIsLoading] = React__namespace.useState(true);
-  const [error, setError] = React__namespace.useState(null);
-  const { url, iconName } = React__namespace.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}&key=au382bi7fsh96w9h9xlrnat2jglx`;
-    return {
-      url: baseUrl,
-      iconName: iconName2
-    };
-  }, [name, size]);
-  React__namespace.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__ */ jsxRuntime.jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        "aria-hidden": "true"
-      }
-    );
-  }
-  if (error || !svgContent) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        role: "img",
-        "aria-label": alt || iconName
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.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 normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1001,66 +844,39 @@ function FeatureIntegrationCards({
   patternOpacity,
   patternClassName
 }) {
-  const renderIntegrationIcon = React.useCallback((integration) => {
-    if (integration.iconSlot) return integration.iconSlot;
-    if (!integration.icon) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      img.Img,
-      {
-        src: integration.icon,
-        alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
-        className: cn("h-auto w-7", integration.iconClassName),
-        loading: "lazy",
-        optixFlowConfig
-      }
-    );
-  }, [optixFlowConfig]);
-  const renderLinkLabel = React.useCallback((integration) => {
-    if (integration.linkLabelSlot) return integration.linkLabelSlot;
-    if (!integration.linkLabel) return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "span",
-      {
-        className: cn(
-          "flex items-center gap-1.5 rounded-full border px-3 py-2 text-sm font-medium transition-colors",
-          getBorderColor(background),
-          getAccentColor(background),
-          integration.linkLabelClassName
-        ),
-        children: [
-          integration.linkLabel,
-          /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 14 })
-        ]
-      }
-    );
-  }, [background]);
+  const renderIntegrationIcon = React.useCallback(
+    (integration) => {
+      if (integration.iconSlot) return integration.iconSlot;
+      if (!integration.icon) return null;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        img.Img,
+        {
+          src: integration.icon,
+          alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
+          className: cn(
+            "min-h-12 h-auto w-auto object-contain",
+            integration.iconClassName
+          ),
+          loading: "lazy",
+          optixFlowConfig
+        }
+      );
+    },
+    [optixFlowConfig]
+  );
   const integrationsContent = React.useMemo(() => {
     if (integrationsSlot) return integrationsSlot;
     if (!integrations || integrations.length === 0) return null;
     return integrations.map((integration, index) => {
       const iconContent = renderIntegrationIcon(integration);
-      const linkLabelContent = renderLinkLabel(integration);
       const cardContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-          iconContent && /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
-            {
-              className: cn(
-                "grid size-12 shrink-0 place-content-center rounded-lg border bg-background/50",
-                getBorderColor(background)
-              ),
-              children: iconContent
-            }
-          ),
-          linkLabelContent
-        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start gap-2 justify-between", children: iconContent && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex"), children: iconContent }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
           integration.title && (typeof integration.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "h3",
             {
               className: cn(
                 "font-semibold md:text-lg",
-                getTextColor(background),
                 integration.titleClassName
               ),
               children: integration.title
@@ -1070,7 +886,6 @@ function FeatureIntegrationCards({
             {
               className: cn(
                 "font-semibold md:text-lg",
-                getTextColor(background),
                 integration.titleClassName
               ),
               children: integration.title
@@ -1081,7 +896,6 @@ function FeatureIntegrationCards({
             {
               className: cn(
                 "text-sm leading-relaxed md:text-base",
-                getTextColor(background, "muted"),
                 integration.descriptionClassName
               ),
               children: integration.description
@@ -1091,7 +905,6 @@ function FeatureIntegrationCards({
             {
               className: cn(
                 "text-sm leading-relaxed md:text-base",
-                getTextColor(background, "muted"),
                 integration.descriptionClassName
               ),
               children: integration.description
@@ -1100,8 +913,7 @@ function FeatureIntegrationCards({
         ] })
       ] });
       const cardClasses = cn(
-        "flex flex-col gap-5 rounded-xl border p-6 transition-all duration-300",
-        getBorderColor(background),
+        "flex flex-col gap-5 rounded-xl border p-6 transition-all duration-300 bg-card card-text-foreground",
         "hover:shadow-lg",
         cardClassName,
         integration.className
@@ -1119,7 +931,7 @@ function FeatureIntegrationCards({
       }
       return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cardClasses, children: cardContent }, index);
     });
-  }, [integrationsSlot, integrations, cardClassName, renderIntegrationIcon, renderLinkLabel, background]);
+  }, [integrationsSlot, integrations, cardClassName, renderIntegrationIcon]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Section,
     {
@@ -1131,11 +943,47 @@ function FeatureIntegrationCards({
       className,
       containerClassName,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto mb-12 flex max-w-3xl flex-col items-center gap-4 text-center", headerClassName), children: [
-          title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-3xl font-semibold md:text-4xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-3xl font-semibold md:text-4xl", titleClassName), children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }))
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-6 sm:grid-cols-2 lg:grid-cols-4", gridClassName), children: integrationsContent })
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "mx-auto mb-12 flex max-w-3xl flex-col items-center gap-4 text-center",
+              headerClassName
+            ),
+            children: [
+              title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "h2",
+                {
+                  className: cn(
+                    "text-3xl font-semibold md:text-4xl",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "text-3xl font-semibold md:text-4xl",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              )),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(descriptionClassName), children: description }))
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "grid gap-6 sm:grid-cols-2 lg:grid-cols-4",
+              gridClassName
+            ),
+            children: integrationsContent
+          }
+        )
       ]
     }
   );