@windrun-huaiin/third-ui 5.11.3 → 5.11.5

package/dist/main/index.js

@@ -3077,13 +3077,16 @@ function GradientButton({
 }
 
 // src/main/gallery.tsx
+var import_react36 = require("react");
 var import_jsx_runtime36 = require("react/jsx-runtime");
 function Gallery({ sectionClassName }) {
   const t = (0, import_next_intl.useTranslations)("gallery");
   const galleryItems = t.raw("prompts");
-  const handleDownload = (index) => __async(null, null, function* () {
+  const defaultImgUrl = t.raw("defaultImgUrl");
+  const [imageErrors, setImageErrors] = (0, import_react36.useState)(/* @__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");
@@ -3097,6 +3100,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__ */ (0, import_jsx_runtime36.jsxs)("section", { id: "gallery", className: cn("container mx-auto px-4 py-20 scroll-mt-20", sectionClassName), children: [
     /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("h2", { className: "text-3xl md:text-4xl font-bold text-center mb-6", children: [
       t("titleL"),
@@ -3106,21 +3115,22 @@ function Gallery({ sectionClassName }) {
       t("titleR")
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("p", { className: "text-center max-w-2xl mx-auto mb-16", children: t("description") }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: galleryItems.map((_prompt, index) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "group relative overflow-hidden rounded-xl", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: galleryItems.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "group relative overflow-hidden rounded-xl", children: [
       /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
         import_image.default,
         {
-          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__ */ (0, import_jsx_runtime36.jsx)("div", { className: "absolute inset-0 flex items-end justify-end p-4 opacity-0 group-hover:opacity-100 transition duration-300", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
         "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__ */ (0, import_jsx_runtime36.jsx)(globalLucideIcons.Download, { className: "h-5 w-5 text-white" })
         }
@@ -3217,13 +3227,13 @@ function Tips({ sectionClassName }) {
 }
 
 // src/main/faq.tsx
-var import_react36 = require("react");
+var import_react37 = require("react");
 var import_next_intl5 = require("next-intl");
 var import_jsx_runtime40 = require("react/jsx-runtime");
 function FAQ({ sectionClassName }) {
   const t = (0, import_next_intl5.useTranslations)("faq");
   const items = t.raw("items");
-  const [openArr, setOpenArr] = (0, import_react36.useState)(() => items.map(() => false));
+  const [openArr, setOpenArr] = (0, import_react37.useState)(() => items.map(() => false));
   const handleToggle = (idx) => {
     setOpenArr((prev) => {
       const next = [...prev];
@@ -3353,11 +3363,11 @@ function Footer() {
 }
 
 // src/main/go-to-top.tsx
-var import_react37 = require("react");
+var import_react38 = require("react");
 var import_jsx_runtime44 = require("react/jsx-runtime");
 function GoToTop() {
-  const [isVisible, setIsVisible] = (0, import_react37.useState)(false);
-  (0, import_react37.useEffect)(() => {
+  const [isVisible, setIsVisible] = (0, import_react38.useState)(false);
+  (0, import_react38.useEffect)(() => {
     const toggleVisibility = () => {
       if (window.scrollY > 300) {
         setIsVisible(true);
@@ -3482,12 +3492,12 @@ function Loading() {
 // src/main/nprogress-bar.tsx
 var import_nprogress = __toESM(require("nprogress"));
 var import_navigation = require("next/navigation");
-var import_react38 = require("react");
+var import_react39 = require("react");
 import_nprogress.default.configure({ showSpinner: false });
 function NProgressBar() {
   const pathname = (0, import_navigation.usePathname)();
-  const previousPath = (0, import_react38.useRef)(pathname);
-  (0, import_react38.useEffect)(() => {
+  const previousPath = (0, import_react39.useRef)(pathname);
+  (0, import_react39.useEffect)(() => {
     if (previousPath.current !== pathname) {
       import_nprogress.default.start();
       setTimeout(() => {
@@ -3500,7 +3510,7 @@ function NProgressBar() {
 }
 
 // src/main/price-plan.tsx
-var import_react39 = require("react");
+var import_react40 = require("react");
 var import_next_intl9 = require("next-intl");
 var import_navigation2 = require("next/navigation");
 var import_jsx_runtime46 = require("react/jsx-runtime");
@@ -3513,8 +3523,8 @@ function PricePlan({ currency = "$", pricePlanConfig, sectionClassName }) {
   const billingOptions = pricePlanConfig.billingOptions;
   const prices = pricePlanConfig.prices;
   const minPlanFeaturesCount = pricePlanConfig.minPlanFeaturesCount;
-  const [billingKey, setBillingKey] = (0, import_react39.useState)(billingSwitch.defaultKey);
-  const [tooltip, setTooltip] = (0, import_react39.useState)({ show: false, content: "", x: 0, y: 0 });
+  const [billingKey, setBillingKey] = (0, import_react40.useState)(billingSwitch.defaultKey);
+  const [tooltip, setTooltip] = (0, import_react40.useState)({ 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(
@@ -3723,7 +3733,7 @@ function PricePlan({ currency = "$", pricePlanConfig, sectionClassName }) {
 }
 
 // src/main/ads-alert-dialog.tsx
-var import_react41 = require("react");
+var import_react42 = require("react");
 var import_image2 = __toESM(require("next/image"));
 
 // ../base-ui/src/ui/alert-dialog.tsx
@@ -4631,9 +4641,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
-var import_react40 = require("react");
+var import_react41 = require("react");
 function useCallbackRef2(initialValue, callback) {
-  var ref = (0, import_react40.useState)(function() {
+  var ref = (0, import_react41.useState)(function() {
     return {
       // value
       value: initialValue,
@@ -5991,7 +6001,7 @@ function AdsAlertDialog({
   confirmText,
   onConfirm
 }) {
-  const [imgError, setImgError] = (0, import_react41.useState)(false);
+  const [imgError, setImgError] = (0, import_react42.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(AlertDialog2, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
     AlertDialogContent2,
     {
@@ -6074,14 +6084,14 @@ function AdsAlertDialog({
 }
 
 // src/main/x-button.tsx
-var import_react42 = require("react");
+var import_react43 = require("react");
 var import_jsx_runtime56 = require("react/jsx-runtime");
 function XButton(props) {
   var _a, _b;
-  const [isLoading, setIsLoading] = (0, import_react42.useState)(false);
-  const [menuOpen, setMenuOpen] = (0, import_react42.useState)(false);
-  const menuRef = (0, import_react42.useRef)(null);
-  (0, import_react42.useEffect)(() => {
+  const [isLoading, setIsLoading] = (0, import_react43.useState)(false);
+  const [menuOpen, setMenuOpen] = (0, import_react43.useState)(false);
+  const menuRef = (0, import_react43.useRef)(null);
+  (0, import_react43.useEffect)(() => {
     if (props.type === "split") {
       const handleClickOutside = (event) => {
         if (menuRef.current && !menuRef.current.contains(event.target)) {
@@ -6204,7 +6214,7 @@ function XButton(props) {
 }
 
 // src/main/ai-prompt-textarea.tsx
-var import_react43 = require("react");
+var import_react44 = require("react");
 var import_jsx_runtime57 = require("react/jsx-runtime");
 function AIPromptTextarea({
   value,
@@ -6225,7 +6235,7 @@ function AIPromptTextarea({
   description,
   embed = false
 }) {
-  const textareaRef = (0, import_react43.useRef)(null);
+  const textareaRef = (0, import_react44.useRef)(null);
   const wordArray = value.trim().split(/\s+/).filter(Boolean);
   const wordCount = wordArray.length;
   const adjustTextareaHeight = () => {
@@ -6253,7 +6263,7 @@ function AIPromptTextarea({
       }
     }
   };
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     const timer = setTimeout(() => {
       adjustTextareaHeight();
     }, 0);
@@ -6309,7 +6319,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` }