fix ecommerce preview and module compatibility

Reviewed-on: #17

src/api/aiGenerationClient.js

@@ -0,0 +1 @@
+export * from "./aiGenerationClient.ts";

src/api/apiErrorUtils.js

@@ -0,0 +1 @@
+export * from "./apiErrorUtils.ts";

src/api/generationRecordClient.js

@@ -0,0 +1 @@
+export * from "./generationRecordClient.ts";

src/api/serverConnection.js

@@ -0,0 +1 @@
+export * from "./serverConnection.ts";

src/api/taskSubscription.js

@@ -0,0 +1 @@
+export * from "./taskSubscription.ts";

src/api/webGenerationGateway.js

@@ -0,0 +1 @@
+export * from "./webGenerationGateway.ts";

src/components/toast/toastStore.js

@@ -0,0 +1 @@
+export * from "./toastStore.ts";

src/data/ossAssets.js

@@ -0,0 +1 @@
+export * from "./ossAssets.ts";

src/data/workflows.js

@@ -0,0 +1 @@
+export * from "./workflows.ts";

src/features/ecommerce/EcommercePage.js

@@ -0,0 +1,2 @@
+export { default } from "./EcommercePage.tsx";
+export * from "./EcommercePage.tsx";

src/features/ecommerce/EcommercePage.tsx

@@ -282,6 +282,12 @@ type CloneBasicSelectKey = "platform" | "market" | "language" | "ratio";
 type CloneModelSelectKey = "gender" | "age" | "ethnicity" | "body";
 type CloneReferenceMode = "upload" | "link";
 type CloneReplicateLevelKey = "style" | "high";
+type CloneTemplateAsset = {
+  id: string;
+  title: string;
+  prompt: string;
+  mediaUrl: string;
+};
 type TryOnModelSource = "ai" | "library";
 type TryOnStatus = "idle" | "modeling" | "ready" | "generating" | "done" | "failed";
 type DetailStatus = "idle" | "ready" | "generating" | "done" | "failed";
@@ -1005,6 +1011,112 @@ const productSetOutputOptions: Array<{ key: ProductSetOutputKey; label: string;
 const cloneOutputOptions: Array<{ key: ProductSetOutputKey; label: string; desc: string; icon: ReactNode }> = [
   ...productSetOutputOptions,
 ];
+const cloneTemplateCards: Record<Exclude<CloneOutputKey, "hot">, CloneTemplateAsset[]> = {
+  set: [
+    {
+      id: "set-main",
+      title: "商品套图主图",
+      prompt: "生成一组统一风格的商品套图，包含主图、卖点图、场景图和细节图，主体清晰，色调统一，符合电商平台展示规范。",
+      mediaUrl: ossAssets.ecommerce.productSet.main,
+    },
+    {
+      id: "set-scene",
+      title: "商品套图场景",
+      prompt: "生成生活化场景商品套图，突出商品在真实环境中的使用感、氛围感和转化卖点。",
+      mediaUrl: ossAssets.ecommerce.productSet.scene,
+    },
+    {
+      id: "set-detail",
+      title: "商品套图细节",
+      prompt: "生成突出材质、工艺和边缘细节的商品套图，画面干净，信息聚焦，适合电商详情展示。",
+      mediaUrl: ossAssets.ecommerce.productSet.detail,
+    },
+    {
+      id: "set-selling",
+      title: "商品套图卖点",
+      prompt: "生成强调核心卖点和对比优势的商品套图，信息层级清晰，适合列表页和转化场景。",
+      mediaUrl: ossAssets.ecommerce.productSet.selling,
+    },
+  ],
+  detail: [
+    {
+      id: "detail-hero",
+      title: "详情图头图",
+      prompt: "生成适用于 A+ 详情页的头图模块，突出品牌感、主卖点和视觉中心，版式清晰高级。",
+      mediaUrl: ossAssets.ecommerce.detail.longPage,
+    },
+    {
+      id: "detail-grid-a",
+      title: "详情图模块 A",
+      prompt: "生成模块化详情长图，重点展示产品卖点、功能说明和适用场景，适合滚动阅读。",
+      mediaUrl: ossAssets.ecommerce.detail.gridA,
+    },
+    {
+      id: "detail-grid-b",
+      title: "详情图模块 B",
+      prompt: "生成模块化详情长图，强化材质、规格和使用说明，视觉简洁，信息明确。",
+      mediaUrl: ossAssets.ecommerce.detail.gridB,
+    },
+    {
+      id: "detail-grid-c",
+      title: "详情图模块 C",
+      prompt: "生成模块化详情页内容，突出品牌叙事、细节拆解和购买理由，保持统一排版。",
+      mediaUrl: ossAssets.ecommerce.detail.gridC,
+    },
+  ],
+  model: [
+    {
+      id: "model-dress-a",
+      title: "模特图穿搭 A",
+      prompt: "生成真人模特穿搭展示图，突出服装版型、上身效果和整体气质，姿态自然。",
+      mediaUrl: ossAssets.ecommerce.tryOn.dressA,
+    },
+    {
+      id: "model-dress-b",
+      title: "模特图穿搭 B",
+      prompt: "生成适合商品展示的模特图，强调衣型、垂感和真实穿着效果，画面干净。",
+      mediaUrl: ossAssets.ecommerce.tryOn.dressB,
+    },
+    {
+      id: "model-woman",
+      title: "模特图女模",
+      prompt: "生成自然站姿的女模特展示图，适合服饰、配件和穿搭类商品展示。",
+      mediaUrl: ossAssets.ecommerce.tryOn.modelWoman,
+    },
+    {
+      id: "model-man",
+      title: "模特图男模",
+      prompt: "生成真实感更强的男模特展示图，突出上身效果、轮廓和场景氛围。",
+      mediaUrl: ossAssets.ecommerce.tryOn.modelMan,
+    },
+  ],
+  video: [
+    {
+      id: "video-hook",
+      title: "短视频开场",
+      prompt: "生成适合电商短视频的开场镜头，节奏明确，第一秒就突出产品和核心看点。",
+      mediaUrl: ossAssets.ecommerce.inspiration.tiktokPreference,
+    },
+    {
+      id: "video-scene",
+      title: "短视频场景",
+      prompt: "生成生活化使用场景的短视频分镜，画面连贯，围绕商品使用过程展开。",
+      mediaUrl: ossAssets.ecommerce.inspiration.officeStyleSet,
+    },
+    {
+      id: "video-review",
+      title: "短视频口播",
+      prompt: "生成适合口播讲解的电商短视频结构，包含产品亮点、卖点说明和收尾引导。",
+      mediaUrl: ossAssets.ecommerce.inspiration.asinListing,
+    },
+    {
+      id: "video-conversion",
+      title: "短视频转化",
+      prompt: "生成以转化为目标的短视频分镜，强化开头钩子、卖点展示和行动引导。",
+      mediaUrl: ossAssets.ecommerce.inspiration.competitorListing,
+    },
+  ],
+};
 const cloneSetCountOptions: Array<{
   key: CloneSetCountKey;
   title: string;
@@ -1457,6 +1569,7 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
   const [imageWorkbenchProgress, setImageWorkbenchProgress] = useState(0);
   const [isProductUploadDragging, setIsProductUploadDragging] = useState(false);
   const [cloneOutput, setCloneOutput] = useState<CloneOutputKey>(defaultCloneOutput);
+  const [isCloneTemplateStripVisible, setIsCloneTemplateStripVisible] = useState(false);
   const [videoHistoryVisible, setVideoHistoryVisible] = useState(false);
   const [isVideoWorkspaceVisible, setIsVideoWorkspaceVisible] = useState(false);
   const [videoPlanTrigger, setVideoPlanTrigger] = useState(0);
@@ -1959,6 +2072,7 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
   const selectedProductSetOutput =
     productSetOutputOptions.find((option) => option.key === productSetOutput) ?? productSetOutputOptions[0]!;
   const selectedCloneOutput = cloneOutputOptions.find((option) => option.key === cloneOutput) ?? cloneOutputOptions[1]!;
+  const activeCloneTemplateCards = cloneTemplateCards[cloneOutput === "hot" ? "set" : cloneOutput];
   const cloneRequirementPlaceholder =
     cloneOutput === "model"
       ? "建议包含以下信息：产品名称、核心卖点、期望场景、模特外貌描述（如小麦色皮肤、齐刘海、眼角有泪痣）、具体参数"
@@ -3327,12 +3441,22 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
 
   const handleCloneOutputChange = (nextOutput: CloneOutputKey) => {
     setCloneOutput(nextOutput);
+    setIsCloneTemplateStripVisible(true);
     if (nextOutput !== "video") setIsVideoWorkspaceVisible(false);
     setRatio((current) =>
       normalizeRatioForPlatform(platform, current, nextOutput),
     );
   };
 
+  const handleCloneModeTabClick = (nextOutput: CloneOutputKey) => {
+    if (nextOutput === cloneOutput) {
+      setIsCloneTemplateStripVisible((visible) => !visible);
+      return;
+    }
+    handleCloneOutputChange(nextOutput);
+    setComposerMenu(null);
+  };
+
   const handleCloneMarketChange = (nextMarket: string) => {
     const normalizedMarket = normalizeMarket(nextMarket);
     setMarket(normalizedMarket);
@@ -5171,6 +5295,60 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
     toast.success("提示词已填入指令栏");
   };
 
+  const applyComposerPrompt = (prompt: string) => {
+    const nextValue = prompt.slice(0, 500);
+    setActiveQuickTool(null);
+    setComposerMenu(null);
+    setRequirement(nextValue);
+    syncRequirementMentionQuery(nextValue, nextValue.length);
+    setInspirationPreview(null);
+    requestAnimationFrame(() => {
+      const textarea = requirementTextareaRef.current;
+      if (textarea) {
+        textarea.focus();
+        textarea.setSelectionRange(nextValue.length, nextValue.length);
+        textarea.scrollIntoView({ behavior: "smooth", block: "center" });
+      }
+    });
+  };
+
+  const addTemplateImageToComposer = async (card: CloneTemplateAsset) => {
+    if (productImages.length >= maxCloneProductImages) {
+      toast.info("模板图片已达上限");
+      return;
+    }
+
+    try {
+      const stamp = Date.now();
+      const uploaded = await aiGenerationClient.uploadAssetByUrl({
+        sourceUrl: card.mediaUrl,
+        name: `${card.id}-${stamp}`,
+        scope: ecommerceOssScopes.productSource,
+      });
+      const nextImage: CloneImageItem = {
+        id: `template-${card.id}-${stamp}`,
+        src: uploaded.url || card.mediaUrl,
+        name: card.title,
+        ossKey: uploaded.ossKey,
+      };
+      setProductImages((current) => [...current, nextImage].slice(0, maxCloneProductImages));
+      void readImageDimensions(nextImage.src)
+        .then(({ width, height }) => {
+          setProductImages((current) =>
+            current.map((item) => (item.id === nextImage.id ? { ...item, width, height } : item)),
+          );
+        })
+        .catch(() => undefined);
+    } catch {
+      toast.error("模板图片导入失败");
+    }
+  };
+
+  const handleCloneTemplateCardClick = (card: CloneTemplateAsset) => {
+    void addTemplateImageToComposer(card);
+    applyComposerPrompt(card.prompt);
+  };
+
   const inspirationPreviewOverlay =
     inspirationPreview && typeof document !== "undefined"
       ? createPortal(
@@ -5509,7 +5687,7 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
               key={option.key}
               type="button"
               className={cloneOutput === option.key ? "is-active" : ""}
-              onClick={() => handleCloneOutputChange(option.key)}
+              onClick={() => handleCloneModeTabClick(option.key)}
             >
               <span className={`ecom-command-mode-icon ecom-command-mode-icon--${option.key}`} aria-hidden="true">{option.icon}</span>
               <strong>{option.label}</strong>
@@ -5608,6 +5786,25 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
           </div>
           {renderComposerMenu()}
         </div>
+        {(status === "idle" || status === "ready") && !showMainVideoWorkspace && isCloneTemplateStripVisible ? (
+          <section className={`ecom-command-template-strip ecom-command-template-strip--${cloneOutput}`} aria-label="模板卡片">
+            {activeCloneTemplateCards.map((card) => (
+              <button
+                key={card.id}
+                type="button"
+                className="ecom-command-template-card"
+                aria-label={card.title}
+                onClick={(event) => {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  handleCloneTemplateCardClick(card);
+                }}
+              >
+                <span className="ecom-command-template-card__blank" aria-hidden="true" />
+              </button>
+            ))}
+          </section>
+        ) : null}
         {(status === "idle" || status === "ready") && !showMainVideoWorkspace ? (
           <section className="ecom-command-quick-board" aria-label="快捷功能">
             {[
@@ -7319,26 +7516,6 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
                     </div>
                   ) : null}
                 </section>
-                {newConversationImages.length ? (
-                  <section className="clone-ai-chat-message clone-ai-chat-message--user clone-ai-chat-message--followup">
-                    <span>新需求</span>
-                    <p>{newRequirementText}</p>
-                    <div className="clone-ai-chat-meta" aria-label="新需求参数">
-                      {currentRequirementMeta.map((item) => (
-                        <em key={item.label}>
-                          <span>{item.label}</span>
-                          <strong>{item.value}</strong>
-                        </em>
-                      ))}
-                    </div>
-                    <div className="clone-ai-chat-assets" aria-label="新增素材">
-                      {newConversationImages.slice(0, 4).map((image) => (
-                        <img key={image.id} src={image.src} alt={image.name || "新增商品素材"} />
-                      ))}
-                      {newConversationImages.length > 4 ? <em>+{newConversationImages.length - 4}</em> : null}
-                    </div>
-                  </section>
-                ) : null}
                 <section className={`clone-ai-chat-message clone-ai-chat-message--assistant is-${status}`}>
                   <span>电商图设计师</span>
                   <p>
@@ -7368,6 +7545,26 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
                     </div>
                   ) : null}
                 </section>
+                {newConversationImages.length ? (
+                  <section className="clone-ai-chat-message clone-ai-chat-message--user clone-ai-chat-message--followup">
+                    <span>新需求</span>
+                    <p>{newRequirementText}</p>
+                    <div className="clone-ai-chat-meta" aria-label="新需求参数">
+                      {currentRequirementMeta.map((item) => (
+                        <em key={item.label}>
+                          <span>{item.label}</span>
+                          <strong>{item.value}</strong>
+                        </em>
+                      ))}
+                    </div>
+                    <div className="clone-ai-chat-assets" aria-label="新增素材">
+                      {newConversationImages.slice(0, 4).map((image) => (
+                        <img key={image.id} src={image.src} alt={image.name || "新增商品素材"} />
+                      ))}
+                      {newConversationImages.length > 4 ? <em>+{newConversationImages.length - 4}</em> : null}
+                    </div>
+                  </section>
+                ) : null}
               </div>
             </aside>
             <button

src/features/ecommerce/ecommerceGenerationPersistence.js

@@ -0,0 +1 @@
+export * from "./ecommerceGenerationPersistence.ts";

src/features/ecommerce/ecommerceImageValidation.js

@@ -0,0 +1 @@
+export * from "./ecommerceImageValidation.ts";

src/features/ecommerce/ecommerceTemplates.js

@@ -0,0 +1 @@
+export * from "./ecommerceTemplates.ts";

src/features/workbench/workbenchDownload.js

@@ -0,0 +1 @@
+export * from "./workbenchDownload.ts";

src/hooks/useGenerationTasks.js

@@ -0,0 +1 @@
+export * from "./useGenerationTasks.ts";

src/hooks/useTypewriter.js

@@ -0,0 +1 @@
+export * from "./useTypewriter.ts";

src/services/backgroundTaskRunner.js

@@ -0,0 +1 @@
+export * from "./backgroundTaskRunner.ts";

src/stores/index.js

@@ -0,0 +1 @@
+export * from "./index.ts";

src/stores/useAppStore.js

@@ -0,0 +1 @@
+export * from "./useAppStore.ts";

src/stores/useGenerationStore.js

@@ -0,0 +1 @@
+export * from "./useGenerationStore.ts";

src/stores/useProjectStore.js

@@ -0,0 +1 @@
+export * from "./useProjectStore.ts";

src/stores/useSessionStore.js

@@ -0,0 +1 @@
+export * from "./useSessionStore.ts";

src/stores/useTaskStore.js

@@ -0,0 +1 @@
+export * from "./useTaskStore.ts";

src/styles/ecommerce-standalone.css

@@ -9040,6 +9040,56 @@
   z-index: 0 !important;
 }
 
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-strip {
+  display: grid !important;
+  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+  gap: 12px !important;
+  width: 100% !important;
+  margin: 14px 0 10px !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card {
+  position: relative !important;
+  display: block !important;
+  width: 100% !important;
+  aspect-ratio: 1.46 / 1 !important;
+  min-height: 92px !important;
+  padding: 0 !important;
+  border: 1px solid rgba(30, 189, 219, 0.18) !important;
+  border-radius: 16px !important;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(246, 251, 253, 0.98)),
+    #ffffff !important;
+  box-shadow:
+    0 16px 34px rgba(16, 115, 204, 0.08),
+    inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
+  overflow: hidden !important;
+  cursor: pointer !important;
+  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card:hover {
+  transform: translateY(-1px) !important;
+  border-color: rgba(30, 189, 219, 0.34) !important;
+  box-shadow:
+    0 20px 42px rgba(16, 115, 204, 0.11),
+    0 0 0 1px rgba(30, 189, 219, 0.12) inset !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card:focus-visible {
+  outline: none !important;
+  border-color: rgba(30, 189, 219, 0.48) !important;
+  box-shadow:
+    0 0 0 3px rgba(30, 189, 219, 0.15),
+    0 20px 42px rgba(16, 115, 204, 0.11) !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card__blank {
+  display: block !important;
+  width: 100% !important;
+  height: 100% !important;
+}
+
 .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview {
   background: #f8f9fa !important;
   transition: padding-top 520ms cubic-bezier(0.16, 1, 0.3, 1),
@@ -9258,6 +9308,10 @@
     min-height: 224px !important;
   }
 
+  .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-strip {
+    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+  }
+
   .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:not(:nth-child(6n + 1))::before {
     content: none !important;
   }
@@ -17200,3 +17254,124 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
     height: 38px !important;
 }
 }
+
+/* Record detail chat polish: wider drawer and clearer turn-taking. */
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail {
+  --clone-chat-width: clamp(408px, 30vw, 440px);
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-conversation-panel {
+  width: var(--clone-chat-width) !important;
+  min-width: var(--clone-chat-width) !important;
+  border-right-color: rgba(30, 189, 219, 0.18) !important;
+  box-shadow:
+    24px 0 58px rgba(16, 115, 204, 0.09),
+    inset -1px 0 0 rgba(255, 255, 255, 0.72) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail.is-conversation-collapsed .clone-ai-conversation-panel {
+  transform: translateX(calc(-1 * var(--clone-chat-width))) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-conversation-toggle {
+  left: var(--clone-chat-width) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-conversation-head {
+  padding: 18px 18px 15px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-conversation-body {
+  gap: 16px !important;
+  padding-right: 18px !important;
+  padding-left: 18px !important;
+  scroll-padding-bottom: 124px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message {
+  gap: 10px !important;
+  padding: 15px 16px !important;
+  border-radius: 20px !important;
+  box-shadow:
+    0 14px 34px rgba(16, 115, 204, 0.075),
+    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message--user {
+  margin-left: clamp(26px, 7%, 36px) !important;
+  border-color: rgba(30, 189, 219, 0.22) !important;
+  background:
+    linear-gradient(180deg, rgba(232, 249, 253, 0.96), rgba(255, 255, 255, 0.94)) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message--assistant {
+  margin-right: clamp(26px, 7%, 36px) !important;
+  border-color: rgba(16, 115, 204, 0.13) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message--followup {
+  margin-top: 2px !important;
+  border-color: rgba(30, 189, 219, 0.24) !important;
+  background:
+    linear-gradient(180deg, rgba(225, 248, 253, 0.92), rgba(255, 255, 255, 0.95)) !important;
+  box-shadow:
+    0 16px 38px rgba(30, 189, 219, 0.1),
+    inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message > span {
+  font-size: 12px !important;
+  font-weight: 820 !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message p {
+  font-size: 13px !important;
+  line-height: 1.64 !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-meta {
+  gap: 8px !important;
+  margin-top: 10px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-meta em {
+  min-height: 28px !important;
+  padding: 7px 11px !important;
+  border-color: rgba(30, 189, 219, 0.16) !important;
+  background: rgba(248, 253, 255, 0.98) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-assets {
+  gap: 9px !important;
+  margin-top: 2px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-assets img,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-assets em {
+  width: 46px !important;
+  height: 46px !important;
+  border-radius: 14px !important;
+}
+
+@media (max-width: 900px) {
+  html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail {
+    --clone-chat-width: min(92vw, 408px);
+  }
+
+  html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-conversation-body {
+    padding-right: 14px !important;
+    padding-left: 14px !important;
+  }
+}
+
+@media (max-width: 480px) {
+  html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail {
+    --clone-chat-width: min(94vw, 364px);
+  }
+
+  html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message--user,
+  html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-detail .clone-ai-chat-message--assistant {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+}

src/types.js

@@ -0,0 +1 @@
+export * from "./types.ts";

src/utils/enterpriseVideoPolicy.js

@@ -0,0 +1 @@
+export * from "./enterpriseVideoPolicy.ts";

src/utils/happyHorseRouting.js

@@ -0,0 +1 @@
+export * from "./happyHorseRouting.ts";

src/utils/pixverseRouting.js

@@ -0,0 +1 @@
+export * from "./pixverseRouting.ts";

src/utils/resolveVideoModel.js

@@ -0,0 +1 @@
+export * from "./resolveVideoModel.ts";

src/utils/taskLifecycle.js

@@ -0,0 +1 @@
+export * from "./taskLifecycle.ts";

src/utils/translateTaskError.js

@@ -0,0 +1 @@
+export * from "./translateTaskError.ts";

src/utils/viduRouting.js

@@ -0,0 +1 @@
+export * from "./viduRouting.ts";