@windrun-huaiin/third-ui 5.11.3 → 5.11.5

package/dist/main/index.mjs

@@ -3034,13 +3034,16 @@ 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 handleDownload = (index) => __async(null, null, function* () {
+  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(`/${index + 1}.webp`);
+      const response = yield fetch(item.url);
       const blob = yield response.blob();
       const url = window.URL.createObjectURL(blob);
       const a = document.createElement("a");
@@ -3054,6 +3057,12 @@ function Gallery({ sectionClassName }) {
       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"),
@@ -3063,21 +3072,22 @@ function Gallery({ sectionClassName }) {
       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((_prompt, index) => /* @__PURE__ */ jsxs12("div", { className: "group relative overflow-hidden rounded-xl", children: [
+    /* @__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: `/${index + 1}.webp`,
-          alt: "Reve Image AI-generated artwork",
+          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"
+          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(index),
+          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" })
         }
@@ -3174,13 +3184,13 @@ function Tips({ sectionClassName }) {
 }
 
 // src/main/faq.tsx
-import { useState as useState2 } from "react";
+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] = useState2(() => items.map(() => false));
+  const [openArr, setOpenArr] = useState3(() => items.map(() => false));
   const handleToggle = (idx) => {
     setOpenArr((prev) => {
       const next = [...prev];
@@ -3310,10 +3320,10 @@ function Footer() {
 }
 
 // src/main/go-to-top.tsx
-import { useState as useState3, useEffect } from "react";
+import { useState as useState4, useEffect } from "react";
 import { Fragment as Fragment4, jsx as jsx44 } from "react/jsx-runtime";
 function GoToTop() {
-  const [isVisible, setIsVisible] = useState3(false);
+  const [isVisible, setIsVisible] = useState4(false);
   useEffect(() => {
     const toggleVisibility = () => {
       if (window.scrollY > 300) {
@@ -3457,7 +3467,7 @@ function NProgressBar() {
 }
 
 // src/main/price-plan.tsx
-import { useState as useState4 } from "react";
+import { useState as useState5 } from "react";
 import { useTranslations as useTranslations9 } from "next-intl";
 import { useRouter } from "next/navigation";
 import { Fragment as Fragment5, jsx as jsx46, jsxs as jsxs21 } from "react/jsx-runtime";
@@ -3470,8 +3480,8 @@ function PricePlan({ currency = "$", pricePlanConfig, sectionClassName }) {
   const billingOptions = pricePlanConfig.billingOptions;
   const prices = pricePlanConfig.prices;
   const minPlanFeaturesCount = pricePlanConfig.minPlanFeaturesCount;
-  const [billingKey, setBillingKey] = useState4(billingSwitch.defaultKey);
-  const [tooltip, setTooltip] = useState4({ show: false, content: "", x: 0, y: 0 });
+  const [billingKey, setBillingKey] = useState5(billingSwitch.defaultKey);
+  const [tooltip, setTooltip] = useState5({ show: false, content: "", x: 0, y: 0 });
   const currentBilling = billingOptions.find((opt) => opt.key === billingKey) || billingOptions[0];
   const currentBillingDisplay = billingSwitch.options.find((opt) => opt.key === billingKey) || billingSwitch.options[0];
   const maxFeaturesCount = Math.max(
@@ -3680,7 +3690,7 @@ function PricePlan({ currency = "$", pricePlanConfig, sectionClassName }) {
 }
 
 // src/main/ads-alert-dialog.tsx
-import { useState as useState14 } from "react";
+import { useState as useState15 } from "react";
 import Image2 from "next/image";
 
 // ../base-ui/src/ui/alert-dialog.tsx
@@ -4588,9 +4598,9 @@ function assignRef(ref, value) {
 }
 
 // ../../node_modules/.pnpm/use-callback-ref@1.3.3_@types+react@19.1.2_react@19.1.0/node_modules/use-callback-ref/dist/es2015/useRef.js
-import { useState as useState11 } from "react";
+import { useState as useState12 } from "react";
 function useCallbackRef2(initialValue, callback) {
-  var ref = useState11(function() {
+  var ref = useState12(function() {
     return {
       // value
       value: initialValue,
@@ -5948,7 +5958,7 @@ function AdsAlertDialog({
   confirmText,
   onConfirm
 }) {
-  const [imgError, setImgError] = useState14(false);
+  const [imgError, setImgError] = useState15(false);
   return /* @__PURE__ */ jsx55(AlertDialog2, { open, onOpenChange, children: /* @__PURE__ */ jsxs25(
     AlertDialogContent2,
     {
@@ -6031,12 +6041,12 @@ function AdsAlertDialog({
 }
 
 // src/main/x-button.tsx
-import { useState as useState15, useRef as useRef12, useEffect as useEffect17 } from "react";
+import { useState as useState16, useRef as useRef12, useEffect as useEffect17 } from "react";
 import { Fragment as Fragment9, jsx as jsx56, jsxs as jsxs26 } from "react/jsx-runtime";
 function XButton(props) {
   var _a, _b;
-  const [isLoading, setIsLoading] = useState15(false);
-  const [menuOpen, setMenuOpen] = useState15(false);
+  const [isLoading, setIsLoading] = useState16(false);
+  const [menuOpen, setMenuOpen] = useState16(false);
   const menuRef = useRef12(null);
   useEffect17(() => {
     if (props.type === "split") {
@@ -6266,7 +6276,7 @@ function AIPromptTextarea({
       disabled,
       className: cn(
         "w-full p-4 bg-transparent transition-colors text-foreground placeholder-muted-foreground placeholder:text-base disabled:bg-muted disabled:cursor-not-allowed resize-none",
-        isEmbedded ? "border-0 hover:border-2 hover:border-purple-500 focus:border-2 focus:border-purple-500" : "border-2 border-border rounded-lg hover:border-purple-500 focus:border-purple-500",
+        isEmbedded ? "border-0 hover:border-2 hover:border-purple-500 focus:outline-none focus:border-2 focus:border-purple-500" : "border-2 border-border rounded-lg hover:border-purple-500 focus:outline-none focus:border-purple-500",
         className
       ),
       style: { minHeight: `${minHeight}px` }