@windrun-huaiin/third-ui 5.11.5 → 5.12.0

package/dist/main/index.mjs

@@ -2711,9 +2711,268 @@ function getGlobalIcon(iconKey, createElement8) {
   return Icon2;
 }
 
+// ../lib/src/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
 // src/main/gallery.tsx
 import { useTranslations } from "next-intl";
 import Image from "next/image";
+import { useState } from "react";
+import { jsx as jsx33, jsxs as jsxs10 } from "react/jsx-runtime";
+function Gallery({ sectionClassName, button }) {
+  const t = useTranslations("gallery");
+  const galleryItems = t.raw("prompts");
+  const defaultImgUrl = t.raw("defaultImgUrl");
+  const [imageErrors, setImageErrors] = useState(/* @__PURE__ */ new Set());
+  const handleDownload = (item, index) => __async(null, null, function* () {
+    var _a;
+    try {
+      const response = yield fetch(item.url, {
+        method: "GET",
+        // CORS mode declaration
+        mode: "cors"
+      });
+      if (!response.ok) {
+        throw new Error(`HTTP error! status: ${response.status}`);
+      }
+      const blob = yield response.blob();
+      const url = window.URL.createObjectURL(blob);
+      const contentType = response.headers.get("content-type");
+      let extension = ".webp";
+      if (contentType) {
+        switch (contentType) {
+          case "image/jpeg":
+          case "image/jpg":
+            extension = ".jpg";
+            break;
+          case "image/png":
+            extension = ".png";
+            break;
+          case "image/gif":
+            extension = ".gif";
+            break;
+          case "image/webp":
+            extension = ".webp";
+            break;
+          case "image/svg+xml":
+            extension = ".svg";
+            break;
+          default:
+            const urlExtension = (_a = item.url.split(".").pop()) == null ? void 0 : _a.toLowerCase();
+            if (urlExtension && ["jpg", "jpeg", "png", "gif", "webp", "svg"].includes(urlExtension)) {
+              extension = `.${urlExtension}`;
+            }
+        }
+      }
+      const downloadPrefix = t("downloadPrefix");
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `${downloadPrefix}-${index + 1}${extension}`;
+      a.style.display = "none";
+      document.body.appendChild(a);
+      a.click();
+      setTimeout(() => {
+        window.URL.revokeObjectURL(url);
+        document.body.removeChild(a);
+      }, 100);
+    } catch (error) {
+      console.error("Download failed:", error);
+    }
+  });
+  const handleImageError = (index) => {
+    setImageErrors((prev) => new Set(prev).add(index));
+  };
+  const getImageSrc = (item, index) => {
+    return imageErrors.has(index) ? defaultImgUrl : item.url;
+  };
+  return /* @__PURE__ */ jsxs10("section", { id: "gallery", className: cn("container mx-auto px-4 py-20 scroll-mt-20", sectionClassName), children: [
+    /* @__PURE__ */ jsxs10("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-6", children: [
+      t("titleL"),
+      " ",
+      /* @__PURE__ */ jsx33("span", { className: "text-purple-500", children: t("eyesOn") }),
+      " ",
+      t("titleR")
+    ] }),
+    /* @__PURE__ */ jsx33("p", { className: "text-center max-w-2xl mx-auto mb-16", children: t("description") }),
+    /* @__PURE__ */ jsx33("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: galleryItems.map((item, index) => /* @__PURE__ */ jsxs10("div", { className: "group relative overflow-hidden rounded-xl", children: [
+      /* @__PURE__ */ jsx33(
+        Image,
+        {
+          src: getImageSrc(item, index),
+          alt: item.altMsg,
+          width: 600,
+          height: 600,
+          className: "w-full h-80 object-cover transition duration-300 group-hover:scale-105",
+          onError: () => handleImageError(index)
+        }
+      ),
+      /* @__PURE__ */ jsx33("div", { className: "absolute inset-0 flex items-end justify-end p-4 opacity-0 group-hover:opacity-100 transition duration-300", children: /* @__PURE__ */ jsx33(
+        "button",
+        {
+          onClick: () => handleDownload(item, index),
+          className: "bg-black/50 hover:bg-black/70 p-2 rounded-full text-white/80 hover:text-white transition-all duration-300",
+          children: /* @__PURE__ */ jsx33(globalLucideIcons.Download, { className: "h-5 w-5 text-white" })
+        }
+      ) })
+    ] }, index)) }),
+    button && /* @__PURE__ */ jsx33("div", { className: "text-center mt-12", children: button })
+  ] });
+}
+
+// src/main/usage.tsx
+import { useTranslations as useTranslations2 } from "next-intl";
+import { jsx as jsx34, jsxs as jsxs11 } from "react/jsx-runtime";
+function Usage({ sectionClassName }) {
+  const t = useTranslations2("usage");
+  const steps = t.raw("steps");
+  return /* @__PURE__ */ jsxs11("section", { id: "usage", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
+    /* @__PURE__ */ jsxs11("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-4", children: [
+      t("title"),
+      " ",
+      /* @__PURE__ */ jsx34("span", { className: "text-purple-500", children: t("eyesOn") })
+    ] }),
+    /* @__PURE__ */ jsx34("p", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-base md:text-lg mx-auto whitespace-nowrap", children: t("description") }),
+    /* @__PURE__ */ jsx34("div", { className: "bg-gray-50 dark:bg-gray-800/60 border border-gray-200 dark:border-gray-700 rounded-2xl p-8 md:p-12 shadow-sm dark:shadow-none", children: /* @__PURE__ */ jsx34("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 gap-y-12", children: steps.map((step, idx) => {
+      const Icon2 = getGlobalIcon(step.iconKey);
+      return /* @__PURE__ */ jsxs11("div", { className: "flex items-start", children: [
+        /* @__PURE__ */ jsx34("div", { className: "flex-shrink-0 mr-4", children: /* @__PURE__ */ jsx34(Icon2, { className: "w-8 h-8 text-purple-500" }) }),
+        /* @__PURE__ */ jsxs11("div", { children: [
+          /* @__PURE__ */ jsx34("h3", { className: "text-xl font-semibold mb-3 text-gray-900 dark:text-gray-100 flex items-center", children: `${idx + 1}. ${step.title}` }),
+          /* @__PURE__ */ jsx34("p", { className: "text-gray-700 dark:text-gray-300", children: step.description })
+        ] })
+      ] }, idx);
+    }) }) })
+  ] });
+}
+
+// src/main/features.tsx
+import { useTranslations as useTranslations3 } from "next-intl";
+import { jsx as jsx35, jsxs as jsxs12 } from "react/jsx-runtime";
+function Features({ sectionClassName }) {
+  const t = useTranslations3("features");
+  const featureItems = t.raw("items");
+  return /* @__PURE__ */ jsxs12("section", { id: "features", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-18", sectionClassName), children: [
+    /* @__PURE__ */ jsxs12("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-4", children: [
+      t("title"),
+      " ",
+      /* @__PURE__ */ jsx35("span", { className: "text-purple-500", children: t("eyesOn") })
+    ] }),
+    /* @__PURE__ */ jsx35("p", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-base md:text-lg mx-auto whitespace-nowrap", children: t("description") }),
+    /* @__PURE__ */ jsx35("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 gap-y-12", children: featureItems.map((feature, index) => {
+      const Icon2 = getGlobalIcon(feature.iconKey);
+      return /* @__PURE__ */ jsxs12(
+        "div",
+        {
+          className: "bg-white dark:bg-gray-800/60 p-8 rounded-xl border border-gray-200 dark:border-gray-700 hover:border-purple-300 dark:hover:border-purple-500/50 transition shadow-sm dark:shadow-none",
+          children: [
+            /* @__PURE__ */ jsx35("div", { className: "text-4xl mb-4 flex items-center justify-start", children: /* @__PURE__ */ jsx35(Icon2, { className: "w-8 h-8" }) }),
+            /* @__PURE__ */ jsx35("h3", { className: "text-xl font-semibold mb-3 text-gray-900 dark:text-gray-100", children: feature.title }),
+            /* @__PURE__ */ jsx35("p", { className: "text-gray-700 dark:text-gray-300", children: feature.description })
+          ]
+        },
+        index
+      );
+    }) })
+  ] });
+}
+
+// src/main/tips.tsx
+import { useTranslations as useTranslations4 } from "next-intl";
+import { jsx as jsx36, jsxs as jsxs13 } from "react/jsx-runtime";
+function Tips({ sectionClassName }) {
+  const t = useTranslations4("tips");
+  const sections = t.raw("sections");
+  const midPoint = Math.ceil(sections.length / 2);
+  const leftColumn = sections.slice(0, midPoint);
+  const rightColumn = sections.slice(midPoint);
+  return /* @__PURE__ */ jsxs13("section", { id: "tips", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
+    /* @__PURE__ */ jsxs13("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-16", children: [
+      t("title"),
+      " ",
+      /* @__PURE__ */ jsx36("span", { className: "text-purple-500", children: t("eyesOn") })
+    ] }),
+    /* @__PURE__ */ jsx36("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-12 bg-gray-50 dark:bg-gray-800/60 border border-gray-200 dark:border-gray-700 rounded-2xl p-8 md:p-12 shadow-sm dark:shadow-none", children: [leftColumn, rightColumn].map((column, colIndex) => /* @__PURE__ */ jsx36("div", { className: "space-y-8", children: column.map((tip, tipIndex) => /* @__PURE__ */ jsxs13("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx36("h3", { className: "text-2xl font-semibold", children: tip.title }),
+      /* @__PURE__ */ jsx36("p", { className: "", children: tip.description })
+    ] }, tipIndex)) }, colIndex)) })
+  ] });
+}
+
+// src/main/faq.tsx
+import { useState as useState2 } from "react";
+import { useTranslations as useTranslations5 } from "next-intl";
+import { jsx as jsx37, jsxs as jsxs14 } from "react/jsx-runtime";
+function FAQ({ sectionClassName }) {
+  const t = useTranslations5("faq");
+  const items = t.raw("items");
+  const [openArr, setOpenArr] = useState2(() => items.map(() => false));
+  const handleToggle = (idx) => {
+    setOpenArr((prev) => {
+      const next = [...prev];
+      next[idx] = !next[idx];
+      return next;
+    });
+  };
+  return /* @__PURE__ */ jsxs14("section", { id: "faq", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
+    /* @__PURE__ */ jsx37("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-4", children: t("title") }),
+    /* @__PURE__ */ jsx37("p", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-base md:text-lg mx-auto", children: t("description") }),
+    /* @__PURE__ */ jsx37("div", { className: "space-y-6", children: items.map((item, idx) => {
+      const isOpen = openArr[idx];
+      const Icon2 = isOpen ? globalLucideIcons.ChevronDown : globalLucideIcons.ChevronRight;
+      return /* @__PURE__ */ jsxs14(
+        "div",
+        {
+          className: "bg-white dark:bg-gray-800/60 p-6 rounded-xl border border-gray-200 dark:border-gray-700 hover:border-purple-300 dark:hover:border-purple-500/50 transition shadow-sm dark:shadow-none",
+          children: [
+            /* @__PURE__ */ jsxs14(
+              "button",
+              {
+                className: "w-full flex items-center justify-between text-left focus:outline-none",
+                onClick: () => handleToggle(idx),
+                "aria-expanded": isOpen,
+                children: [
+                  /* @__PURE__ */ jsx37("span", { className: "text-lg font-semibold text-gray-900 dark:text-gray-100", children: item.question }),
+                  /* @__PURE__ */ jsx37(Icon2, { className: "w-6 h-6 text-gray-400 ml-2 transition-transform duration-200" })
+                ]
+              }
+            ),
+            isOpen && /* @__PURE__ */ jsx37("div", { className: "mt-4 text-gray-700 dark:text-gray-300 text-base", children: item.answer })
+          ]
+        },
+        idx
+      );
+    }) })
+  ] });
+}
+
+// src/main/seo-content.tsx
+import { useTranslations as useTranslations6 } from "next-intl";
+import { jsx as jsx38, jsxs as jsxs15 } from "react/jsx-runtime";
+function SeoContent({ sectionClassName }) {
+  const t = useTranslations6("seoContent");
+  return /* @__PURE__ */ jsxs15("section", { id: "seo", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
+    /* @__PURE__ */ jsxs15("h1", { className: "text-3xl md:text-4xl font-bold text-center mb-8", children: [
+      t("title"),
+      " ",
+      /* @__PURE__ */ jsx38("span", { className: "text-purple-500", children: t("eyesOn") })
+    ] }),
+    /* @__PURE__ */ jsx38("h3", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-lg", children: t("description") }),
+    /* @__PURE__ */ jsxs15("div", { className: "bg-gray-50 dark:bg-gray-800/60 border border-gray-200 dark:border-gray-700 rounded-2xl p-8 md:p-12 shadow-sm dark:shadow-none", children: [
+      /* @__PURE__ */ jsxs15("div", { className: "space-y-10", children: [
+        /* @__PURE__ */ jsx38("p", { className: "text-gray-600 dark:text-gray-400 text-lg", children: t("intro") }),
+        t.raw("sections").map((section, index) => /* @__PURE__ */ jsxs15("div", { children: [
+          /* @__PURE__ */ jsx38("h2", { className: "text-xl font-semibold mb-3 text-gray-900 dark:text-gray-100 flex items-center", children: section.title }),
+          /* @__PURE__ */ jsx38("p", { className: "text-gray-700 dark:text-gray-300", children: section.content })
+        ] }, index))
+      ] }),
+      /* @__PURE__ */ jsx38("p", { className: "mt-10 text-gray-600 dark:text-gray-400 text-lg", children: t("conclusion") })
+    ] })
+  ] });
+}
 
 // ../base-ui/src/ui/button.tsx
 import * as React35 from "react";
@@ -2759,7 +3018,7 @@ function useComposedRefs(...refs) {
 }
 
 // ../../node_modules/.pnpm/@radix-ui+react-slot@1.2.3_@types+react@19.1.2_react@19.1.0/node_modules/@radix-ui/react-slot/dist/index.mjs
-import { Fragment as Fragment2, jsx as jsx33 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx39 } from "react/jsx-runtime";
 // @__NO_SIDE_EFFECTS__
 function createSlot(ownerName) {
   const SlotClone = /* @__PURE__ */ createSlotClone(ownerName);
@@ -2777,9 +3036,9 @@ function createSlot(ownerName) {
           return child;
         }
       });
-      return /* @__PURE__ */ jsx33(SlotClone, __spreadProps(__spreadValues({}, slotProps), { ref: forwardedRef, children: React34.isValidElement(newElement) ? React34.cloneElement(newElement, void 0, newChildren) : null }));
+      return /* @__PURE__ */ jsx39(SlotClone, __spreadProps(__spreadValues({}, slotProps), { ref: forwardedRef, children: React34.isValidElement(newElement) ? React34.cloneElement(newElement, void 0, newChildren) : null }));
     }
-    return /* @__PURE__ */ jsx33(SlotClone, __spreadProps(__spreadValues({}, slotProps), { ref: forwardedRef, children }));
+    return /* @__PURE__ */ jsx39(SlotClone, __spreadProps(__spreadValues({}, slotProps), { ref: forwardedRef, children }));
   });
   Slot22.displayName = `${ownerName}.Slot`;
   return Slot22;
@@ -2806,7 +3065,7 @@ var SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
 // @__NO_SIDE_EFFECTS__
 function createSlottable(ownerName) {
   const Slottable2 = ({ children }) => {
-    return /* @__PURE__ */ jsx33(Fragment2, { children });
+    return /* @__PURE__ */ jsx39(Fragment2, { children });
   };
   Slottable2.displayName = `${ownerName}.Slottable`;
   Slottable2.__radixId = SLOTTABLE_IDENTIFIER;
@@ -2856,16 +3115,7 @@ function getElementRef(element) {
 
 // ../base-ui/src/ui/button.tsx
 import { cva } from "class-variance-authority";
-
-// ../lib/src/utils.ts
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// ../base-ui/src/ui/button.tsx
-import { jsx as jsx34, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs16 } from "react/jsx-runtime";
 var buttonVariants = cva(
   "inline-flex items-center gap-2 whitespace-nowrap rounded-md text-sm ring-offset-background transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
@@ -2896,7 +3146,7 @@ var Button = React35.forwardRef(
     var _b = _a, { className, variant, size, asChild = false, loading = false, children } = _b, props = __objRest(_b, ["className", "variant", "size", "asChild", "loading", "children"]);
     const Comp = asChild ? Slot : "button";
     if (asChild) {
-      return /* @__PURE__ */ jsx34(
+      return /* @__PURE__ */ jsx40(
         Comp,
         __spreadProps(__spreadValues({
           className: cn(buttonVariants({ variant, size, className })),
@@ -2907,7 +3157,7 @@ var Button = React35.forwardRef(
         })
       );
     }
-    return /* @__PURE__ */ jsxs10(
+    return /* @__PURE__ */ jsxs16(
       Comp,
       __spreadProps(__spreadValues({
         className: cn(buttonVariants({ variant, size, className })),
@@ -2916,7 +3166,7 @@ var Button = React35.forwardRef(
       }, props), {
         children: [
           children,
-          loading && /* @__PURE__ */ jsx34(globalLucideIcons.Loader2, { className: "ml-2 h-4 w-4 animate-spin" })
+          loading && /* @__PURE__ */ jsx40(globalLucideIcons.Loader2, { className: "ml-2 h-4 w-4 animate-spin" })
         ]
       })
     );
@@ -2926,8 +3176,8 @@ Button.displayName = "Button";
 
 // src/fuma/mdx/gradient-button.tsx
 import Link2 from "next/link";
-import React36, { useState } from "react";
-import { Fragment as Fragment3, jsx as jsx35, jsxs as jsxs11 } from "react/jsx-runtime";
+import React36, { useState as useState3 } from "react";
+import { Fragment as Fragment3, jsx as jsx41, jsxs as jsxs17 } from "react/jsx-runtime";
 function GradientButton({
   title,
   icon,
@@ -2940,7 +3190,7 @@ function GradientButton({
   loadingText,
   preventDoubleClick = true
 }) {
-  const [isLoading, setIsLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState3(false);
   const actualLoadingText = loadingText || (title == null ? void 0 : title.toString().trim()) || "Loading...";
   const getAlignmentClass = () => {
     switch (align) {
@@ -2975,15 +3225,15 @@ function GradientButton({
   });
   const isDisabled = disabled || isLoading;
   const displayTitle = isLoading ? actualLoadingText : title;
-  const displayIcon = isLoading ? /* @__PURE__ */ jsx35(globalLucideIcons.Loader2, { className: "h-4 w-4 text-white animate-spin" }) : icon ? React36.cloneElement(icon, {
+  const displayIcon = isLoading ? /* @__PURE__ */ jsx41(globalLucideIcons.Loader2, { className: "h-4 w-4 text-white animate-spin" }) : icon ? React36.cloneElement(icon, {
     className: "h-4 w-4 text-white"
-  }) : /* @__PURE__ */ jsx35(globalLucideIcons.ArrowRight, { className: "h-4 w-4 text-white" });
-  const buttonContent = onClick ? /* @__PURE__ */ jsxs11(Fragment3, { children: [
-    /* @__PURE__ */ jsx35("span", { children: displayIcon }),
-    /* @__PURE__ */ jsx35("span", { className: "ml-1", children: displayTitle })
-  ] }) : /* @__PURE__ */ jsxs11(Fragment3, { children: [
-    /* @__PURE__ */ jsx35("span", { children: displayTitle }),
-    /* @__PURE__ */ jsx35("span", { className: "ml-1", children: displayIcon })
+  }) : /* @__PURE__ */ jsx41(globalLucideIcons.ArrowRight, { className: "h-4 w-4 text-white" });
+  const buttonContent = onClick ? /* @__PURE__ */ jsxs17(Fragment3, { children: [
+    /* @__PURE__ */ jsx41("span", { children: displayIcon }),
+    /* @__PURE__ */ jsx41("span", { className: "ml-1", children: displayTitle })
+  ] }) : /* @__PURE__ */ jsxs17(Fragment3, { children: [
+    /* @__PURE__ */ jsx41("span", { children: displayTitle }),
+    /* @__PURE__ */ jsx41("span", { className: "ml-1", children: displayIcon })
   ] });
   const buttonClassName = `
     bg-gradient-to-r 
@@ -2997,9 +3247,9 @@ function GradientButton({
     ${isDisabled ? "opacity-50 cursor-not-allowed" : ""}
     ${className}
   `;
-  return /* @__PURE__ */ jsx35("div", { className: `flex flex-col sm:flex-row gap-3 ${getAlignmentClass()}`, children: onClick ? (
+  return /* @__PURE__ */ jsx41("div", { className: `flex flex-col sm:flex-row gap-3 ${getAlignmentClass()}`, children: onClick ? (
     // for click
-    /* @__PURE__ */ jsx35(
+    /* @__PURE__ */ jsx41(
       Button,
       {
         size: "lg",
@@ -3011,14 +3261,14 @@ function GradientButton({
     )
   ) : (
     // for Link
-    /* @__PURE__ */ jsx35(
+    /* @__PURE__ */ jsx41(
       Button,
       {
         asChild: true,
         size: "lg",
         className: buttonClassName,
         disabled: isDisabled,
-        children: /* @__PURE__ */ jsx35(
+        children: /* @__PURE__ */ jsx41(
           Link2,
           __spreadProps(__spreadValues({
             href: href || "#",
@@ -3033,228 +3283,6 @@ function GradientButton({
   ) });
 }
 
-// src/main/gallery.tsx
-import { useState as useState2 } from "react";
-import { jsx as jsx36, jsxs as jsxs12 } from "react/jsx-runtime";
-function Gallery({ sectionClassName }) {
-  const t = useTranslations("gallery");
-  const galleryItems = t.raw("prompts");
-  const defaultImgUrl = t.raw("defaultImgUrl");
-  const [imageErrors, setImageErrors] = useState2(/* @__PURE__ */ new Set());
-  const handleDownload = (item, index) => __async(null, null, function* () {
-    try {
-      const response = yield fetch(item.url);
-      const blob = yield response.blob();
-      const url = window.URL.createObjectURL(blob);
-      const a = document.createElement("a");
-      a.href = url;
-      a.download = `reve-image-${index + 1}.webp`;
-      document.body.appendChild(a);
-      a.click();
-      window.URL.revokeObjectURL(url);
-      document.body.removeChild(a);
-    } catch (error) {
-      console.error("Download failed:", error);
-    }
-  });
-  const handleImageError = (index) => {
-    setImageErrors((prev) => new Set(prev).add(index));
-  };
-  const getImageSrc = (item, index) => {
-    return imageErrors.has(index) ? defaultImgUrl : item.url;
-  };
-  return /* @__PURE__ */ jsxs12("section", { id: "gallery", className: cn("container mx-auto px-4 py-20 scroll-mt-20", sectionClassName), children: [
-    /* @__PURE__ */ jsxs12("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-6", children: [
-      t("titleL"),
-      " ",
-      /* @__PURE__ */ jsx36("span", { className: "text-purple-500", children: t("eyesOn") }),
-      " ",
-      t("titleR")
-    ] }),
-    /* @__PURE__ */ jsx36("p", { className: "text-center max-w-2xl mx-auto mb-16", children: t("description") }),
-    /* @__PURE__ */ jsx36("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: galleryItems.map((item, index) => /* @__PURE__ */ jsxs12("div", { className: "group relative overflow-hidden rounded-xl", children: [
-      /* @__PURE__ */ jsx36(
-        Image,
-        {
-          src: getImageSrc(item, index),
-          alt: item.altMsg,
-          width: 600,
-          height: 600,
-          className: "w-full h-80 object-cover transition duration-300 group-hover:scale-105",
-          onError: () => handleImageError(index)
-        }
-      ),
-      /* @__PURE__ */ jsx36("div", { className: "absolute inset-0 flex items-end justify-end p-4 opacity-0 group-hover:opacity-100 transition duration-300", children: /* @__PURE__ */ jsx36(
-        "button",
-        {
-          onClick: () => handleDownload(item, index),
-          className: "bg-black/50 hover:bg-black/70 p-2 rounded-full text-white/80 hover:text-white transition-all duration-300",
-          children: /* @__PURE__ */ jsx36(globalLucideIcons.Download, { className: "h-5 w-5 text-white" })
-        }
-      ) })
-    ] }, index)) }),
-    /* @__PURE__ */ jsx36("div", { className: "text-center mt-12", children: /* @__PURE__ */ jsx36(
-      GradientButton,
-      {
-        title: t("button"),
-        href: "https://preview.reve.art/",
-        align: "center"
-      }
-    ) })
-  ] });
-}
-
-// src/main/usage.tsx
-import { useTranslations as useTranslations2 } from "next-intl";
-import { jsx as jsx37, jsxs as jsxs13 } from "react/jsx-runtime";
-function Usage({ sectionClassName }) {
-  const t = useTranslations2("usage");
-  const steps = t.raw("steps");
-  return /* @__PURE__ */ jsxs13("section", { id: "usage", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
-    /* @__PURE__ */ jsxs13("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-4", children: [
-      t("title"),
-      " ",
-      /* @__PURE__ */ jsx37("span", { className: "text-purple-500", children: t("eyesOn") })
-    ] }),
-    /* @__PURE__ */ jsx37("p", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-base md:text-lg mx-auto whitespace-nowrap", children: t("description") }),
-    /* @__PURE__ */ jsx37("div", { className: "bg-gray-50 dark:bg-gray-800/60 border border-gray-200 dark:border-gray-700 rounded-2xl p-8 md:p-12 shadow-sm dark:shadow-none", children: /* @__PURE__ */ jsx37("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 gap-y-12", children: steps.map((step, idx) => {
-      const Icon2 = getGlobalIcon(step.iconKey);
-      return /* @__PURE__ */ jsxs13("div", { className: "flex items-start", children: [
-        /* @__PURE__ */ jsx37("div", { className: "flex-shrink-0 mr-4", children: /* @__PURE__ */ jsx37(Icon2, { className: "w-8 h-8 text-purple-500" }) }),
-        /* @__PURE__ */ jsxs13("div", { children: [
-          /* @__PURE__ */ jsx37("h3", { className: "text-xl font-semibold mb-3 text-gray-900 dark:text-gray-100 flex items-center", children: `${idx + 1}. ${step.title}` }),
-          /* @__PURE__ */ jsx37("p", { className: "text-gray-700 dark:text-gray-300", children: step.description })
-        ] })
-      ] }, idx);
-    }) }) })
-  ] });
-}
-
-// src/main/features.tsx
-import { useTranslations as useTranslations3 } from "next-intl";
-import { jsx as jsx38, jsxs as jsxs14 } from "react/jsx-runtime";
-function Features({ sectionClassName }) {
-  const t = useTranslations3("features");
-  const featureItems = t.raw("items");
-  return /* @__PURE__ */ jsxs14("section", { id: "features", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-18", sectionClassName), children: [
-    /* @__PURE__ */ jsxs14("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-4", children: [
-      t("title"),
-      " ",
-      /* @__PURE__ */ jsx38("span", { className: "text-purple-500", children: t("eyesOn") })
-    ] }),
-    /* @__PURE__ */ jsx38("p", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-base md:text-lg mx-auto whitespace-nowrap", children: t("description") }),
-    /* @__PURE__ */ jsx38("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 gap-y-12", children: featureItems.map((feature, index) => {
-      const Icon2 = getGlobalIcon(feature.iconKey);
-      return /* @__PURE__ */ jsxs14(
-        "div",
-        {
-          className: "bg-white dark:bg-gray-800/60 p-8 rounded-xl border border-gray-200 dark:border-gray-700 hover:border-purple-300 dark:hover:border-purple-500/50 transition shadow-sm dark:shadow-none",
-          children: [
-            /* @__PURE__ */ jsx38("div", { className: "text-4xl mb-4 flex items-center justify-start", children: /* @__PURE__ */ jsx38(Icon2, { className: "w-8 h-8" }) }),
-            /* @__PURE__ */ jsx38("h3", { className: "text-xl font-semibold mb-3 text-gray-900 dark:text-gray-100", children: feature.title }),
-            /* @__PURE__ */ jsx38("p", { className: "text-gray-700 dark:text-gray-300", children: feature.description })
-          ]
-        },
-        index
-      );
-    }) })
-  ] });
-}
-
-// src/main/tips.tsx
-import { useTranslations as useTranslations4 } from "next-intl";
-import { jsx as jsx39, jsxs as jsxs15 } from "react/jsx-runtime";
-function Tips({ sectionClassName }) {
-  const t = useTranslations4("tips");
-  const sections = t.raw("sections");
-  const midPoint = Math.ceil(sections.length / 2);
-  const leftColumn = sections.slice(0, midPoint);
-  const rightColumn = sections.slice(midPoint);
-  return /* @__PURE__ */ jsxs15("section", { id: "tips", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
-    /* @__PURE__ */ jsxs15("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-16", children: [
-      t("title"),
-      " ",
-      /* @__PURE__ */ jsx39("span", { className: "text-purple-500", children: t("eyesOn") })
-    ] }),
-    /* @__PURE__ */ jsx39("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-12 bg-gray-50 dark:bg-gray-800/60 border border-gray-200 dark:border-gray-700 rounded-2xl p-8 md:p-12 shadow-sm dark:shadow-none", children: [leftColumn, rightColumn].map((column, colIndex) => /* @__PURE__ */ jsx39("div", { className: "space-y-8", children: column.map((tip, tipIndex) => /* @__PURE__ */ jsxs15("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ jsx39("h3", { className: "text-2xl font-semibold", children: tip.title }),
-      /* @__PURE__ */ jsx39("p", { className: "", children: tip.description })
-    ] }, tipIndex)) }, colIndex)) })
-  ] });
-}
-
-// src/main/faq.tsx
-import { useState as useState3 } from "react";
-import { useTranslations as useTranslations5 } from "next-intl";
-import { jsx as jsx40, jsxs as jsxs16 } from "react/jsx-runtime";
-function FAQ({ sectionClassName }) {
-  const t = useTranslations5("faq");
-  const items = t.raw("items");
-  const [openArr, setOpenArr] = useState3(() => items.map(() => false));
-  const handleToggle = (idx) => {
-    setOpenArr((prev) => {
-      const next = [...prev];
-      next[idx] = !next[idx];
-      return next;
-    });
-  };
-  return /* @__PURE__ */ jsxs16("section", { id: "faq", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
-    /* @__PURE__ */ jsx40("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-4", children: t("title") }),
-    /* @__PURE__ */ jsx40("p", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-base md:text-lg mx-auto", children: t("description") }),
-    /* @__PURE__ */ jsx40("div", { className: "space-y-6", children: items.map((item, idx) => {
-      const isOpen = openArr[idx];
-      const Icon2 = isOpen ? globalLucideIcons.ChevronDown : globalLucideIcons.ChevronRight;
-      return /* @__PURE__ */ jsxs16(
-        "div",
-        {
-          className: "bg-white dark:bg-gray-800/60 p-6 rounded-xl border border-gray-200 dark:border-gray-700 hover:border-purple-300 dark:hover:border-purple-500/50 transition shadow-sm dark:shadow-none",
-          children: [
-            /* @__PURE__ */ jsxs16(
-              "button",
-              {
-                className: "w-full flex items-center justify-between text-left focus:outline-none",
-                onClick: () => handleToggle(idx),
-                "aria-expanded": isOpen,
-                children: [
-                  /* @__PURE__ */ jsx40("span", { className: "text-lg font-semibold text-gray-900 dark:text-gray-100", children: item.question }),
-                  /* @__PURE__ */ jsx40(Icon2, { className: "w-6 h-6 text-gray-400 ml-2 transition-transform duration-200" })
-                ]
-              }
-            ),
-            isOpen && /* @__PURE__ */ jsx40("div", { className: "mt-4 text-gray-700 dark:text-gray-300 text-base", children: item.answer })
-          ]
-        },
-        idx
-      );
-    }) })
-  ] });
-}
-
-// src/main/seo-content.tsx
-import { useTranslations as useTranslations6 } from "next-intl";
-import { jsx as jsx41, jsxs as jsxs17 } from "react/jsx-runtime";
-function SeoContent({ sectionClassName }) {
-  const t = useTranslations6("seoContent");
-  return /* @__PURE__ */ jsxs17("section", { id: "seo", className: cn("px-16 py-10 mx-16 md:mx-32 scroll-mt-20", sectionClassName), children: [
-    /* @__PURE__ */ jsxs17("h1", { className: "text-3xl md:text-4xl font-bold text-center mb-8", children: [
-      t("title"),
-      " ",
-      /* @__PURE__ */ jsx41("span", { className: "text-purple-500", children: t("eyesOn") })
-    ] }),
-    /* @__PURE__ */ jsx41("h3", { className: "text-center text-gray-600 dark:text-gray-400 mb-12 text-lg", children: t("description") }),
-    /* @__PURE__ */ jsxs17("div", { className: "bg-gray-50 dark:bg-gray-800/60 border border-gray-200 dark:border-gray-700 rounded-2xl p-8 md:p-12 shadow-sm dark:shadow-none", children: [
-      /* @__PURE__ */ jsxs17("div", { className: "space-y-10", children: [
-        /* @__PURE__ */ jsx41("p", { className: "text-gray-600 dark:text-gray-400 text-lg", children: t("intro") }),
-        t.raw("sections").map((section, index) => /* @__PURE__ */ jsxs17("div", { children: [
-          /* @__PURE__ */ jsx41("h2", { className: "text-xl font-semibold mb-3 text-gray-900 dark:text-gray-100 flex items-center", children: section.title }),
-          /* @__PURE__ */ jsx41("p", { className: "text-gray-700 dark:text-gray-300", children: section.content })
-        ] }, index))
-      ] }),
-      /* @__PURE__ */ jsx41("p", { className: "mt-10 text-gray-600 dark:text-gray-400 text-lg", children: t("conclusion") })
-    ] })
-  ] });
-}
-
 // src/main/cta.tsx
 import { useTranslations as useTranslations7 } from "next-intl";
 import { jsx as jsx42, jsxs as jsxs18 } from "react/jsx-runtime";