@anker-in/campaign-ui 0.2.11-beta.3 → 0.2.11-beta.31

package/dist/esm/stories/LiveChatWidget.stories.d.ts

@@ -0,0 +1,108 @@
+/**
+ * LiveChatWidget Storybook Stories
+ * 展示 LiveChat 组件的各种使用场景和配置
+ */
+import type { Meta, StoryObj } from '@storybook/react';
+import { LiveChatWidget } from '../components/LiveChatWidget';
+import '../styles/livechat.css';
+declare const meta: Meta<typeof LiveChatWidget>;
+export default meta;
+type Story = StoryObj<typeof LiveChatWidget>;
+/**
+ * 默认配置
+ *
+ * 最简单的使用方式，使用默认配置。
+ */
+export declare const Default: Story;
+/**
+ * 自定义位置
+ *
+ * 使用自定义位置对象来控制气泡按钮的位置。
+ */
+export declare const CustomPosition: Story;
+/**
+ * 自定义品牌样式
+ *
+ * 自定义 Logo 和欢迎消息。
+ */
+export declare const CustomBranding: Story;
+/**
+ * 带快捷回复
+ *
+ * 在欢迎消息后显示快捷回复按钮。
+ */
+export declare const WithQuickReplies: Story;
+/**
+ * 自定义欢迎消息
+ *
+ * 自定义首次打开聊天窗口时的欢迎消息。
+ */
+export declare const CustomWelcomeMessage: Story;
+/**
+ * 事件回调
+ *
+ * 监听组件事件进行自定义处理。
+ */
+export declare const WithEventCallbacks: Story;
+/**
+ * 自定义视频消息渲染器
+ *
+ * 扩展消息类型，添加视频消息支持。
+ */
+export declare const CustomVideoRenderer: Story;
+/**
+ * 自定义图片画廊渲染器
+ *
+ * 扩展消息类型，添加图片画廊支持。
+ */
+export declare const CustomImageGalleryRenderer: Story;
+/**
+ * 移动端预览
+ *
+ * 在移动端尺寸下查看效果（全屏显示）。
+ */
+export declare const MobileView: Story;
+/**
+ * 平板端预览
+ *
+ * 在平板端尺寸下查看效果。
+ */
+export declare const TabletView: Story;
+/**
+ * 默认位置展示
+ *
+ * 展示气泡按钮的默认位置（右下角）。
+ */
+export declare const DefaultPositionDemo: Story;
+/**
+ * 产品对比消息
+ *
+ * 展示产品对比类型的消息渲染效果，包括价格、会员价、变体数量、折扣等多个维度的对比。
+ *
+ * 产品对比组件会以网格布局展示多个产品的基本信息，并在下方显示各维度的对比数据。
+ */
+export declare const ProductComparisonMessage: Story;
+/**
+ * FAQ 列表消息
+ *
+ * 展示常见问题列表，支持折叠/展开。
+ *
+ * FAQ 组件会显示搜索结果的常见问题，每个问题可以点击展开查看答案。
+ */
+export declare const FAQListMessage: Story;
+/**
+ * 带 reCAPTCHA 配置
+ *
+ * 展示如何配置 Google reCAPTCHA v3 验证，保护 API 请求免受滥用。
+ *
+ * reCAPTCHA 会在后台自动验证用户行为，无需用户手动操作。
+ */
+export declare const WithRecaptcha: Story;
+/**
+ * 自定义产品卡片渲染
+ *
+ * 演示如何使用 productCardRender 自定义产品卡片的渲染样式。
+ *
+ * 当后端返回产品占位符 {{product:xxx}} 时，会使用自定义渲染函数来展示产品卡片。
+ */
+export declare const CustomProductCardRender: Story;

package/dist/esm/stories/LiveChatWidget.stories.js

@@ -0,0 +1,149 @@
+import{jsx as o,jsxs as a}from"react/jsx-runtime";import{LiveChatWidget as i}from"../components/LiveChatWidget";import"../styles/livechat.css";const d={title:"Campaign/LiveChatWidget",component:i,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:500},description:{component:`
+# LiveChat \u804A\u5929\u7EC4\u4EF6
+
+\u53EF\u590D\u7528\u7684\u6C14\u6CE1\u5F39\u7A97\u804A\u5929\u7EC4\u4EF6\uFF0C\u652F\u6301 SSE \u6D41\u5F0F\u6D88\u606F\u3001\u81EA\u5B9A\u4E49\u6E32\u67D3\u5668\u548C\u591A\u79CD\u6D88\u606F\u7C7B\u578B\u3002
+
+## \u529F\u80FD\u7279\u6027
+
+- \u{1F388} **\u6C14\u6CE1\u5F39\u7A97**: \u53EF\u81EA\u5B9A\u4E49\u4F4D\u7F6E\u7684\u60AC\u6D6E\u6C14\u6CE1\u6309\u94AE
+- \u{1F4AC} **\u6D41\u5F0F\u6D88\u606F**: \u57FA\u4E8E SSE \u7684\u5B9E\u65F6\u6D41\u5F0F\u54CD\u5E94
+- \u{1F4E6} **\u591A\u79CD\u6D88\u606F\u7C7B\u578B**: \u6587\u672C\u3001\u5546\u54C1\u5361\u7247\u3001\u5546\u54C1\u5217\u8868\u3001\u653F\u7B56\u3001\u5FEB\u6377\u56DE\u590D\u7B49
+- \u{1F3A8} **\u53EF\u5B9A\u5236**: \u652F\u6301\u81EA\u5B9A\u4E49\u54C1\u724C\u989C\u8272\u3001Logo\u3001\u6E32\u67D3\u5668
+- \u{1F4F1} **\u54CD\u5E94\u5F0F**: \u79FB\u52A8\u7AEF\u5168\u5C4F\uFF0C\u684C\u9762\u7AEF\u56FA\u5B9A\u5C3A\u5BF8
+- \u{1F4BE} **\u4F1A\u8BDD\u7BA1\u7406**: \u81EA\u52A8\u7BA1\u7406 userId \u548C sessionId
+- \u{1F512} **\u5B89\u5168\u9632\u62A4**: \u5185\u7F6E XSS \u9632\u62A4\u548C\u8F93\u5165\u9A8C\u8BC1
+
+## \u57FA\u7840\u7528\u6CD5
+
+\`\`\`tsx
+import { LiveChatWidget } from '@anker-in/campaign-ui'
+import '@anker-in/campaign-ui/livechat.css'
+
+function App() {
+  return (
+    <LiveChatWidget
+      apiBaseUrl="https://beta-api-livechat.anker.com"
+      site="www.eufy.com"
+      channel_code="web_homepage"
+      welcomeMessage="\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B"
+    />
+  )
+}
+\`\`\`
+
+## \u81EA\u5B9A\u4E49\u6E32\u67D3\u5668
+
+\`\`\`tsx
+const customRenderers = {
+  video: {
+    render: (content) => (
+      <video src={content.url} controls className="w-full rounded" />
+    )
+  }
+}
+
+<LiveChatWidget
+  apiBaseUrl="..."
+  site="..."
+  customRenderers={customRenderers}
+/>
+\`\`\`
+        `}}},tags:["autodocs"],argTypes:{apiBaseUrl:{control:"text",description:"API \u57FA\u7840 URL"},headers:{control:"object",description:"\u81EA\u5B9A\u4E49\u8BF7\u6C42\u5934\uFF0C\u5C06\u5728\u6240\u6709 API \u8BF7\u6C42\u4E2D\u6DFB\u52A0",table:{defaultValue:{summary:"undefined"}}},recaptchaSitekey:{control:"text",description:"Google reCAPTCHA v3 site key\uFF0C\u63D0\u4F9B\u6B64\u53C2\u6570\u5C06\u81EA\u52A8\u542F\u7528 reCAPTCHA v3 \u9A8C\u8BC1",table:{defaultValue:{summary:"undefined"}}},recaptchaAction:{control:"text",description:"reCAPTCHA action \u540D\u79F0\uFF0C\u7528\u4E8E\u533A\u5206\u4E0D\u540C\u7684\u9A8C\u8BC1\u573A\u666F",table:{defaultValue:{summary:'"activity"'}}},site:{control:"text",description:"Shopify \u5E97\u94FA URL"},channelCode:{control:"text",description:"\u6E20\u9053\u7F16\u7801\uFF0C\u7528\u4E8E\u6807\u8BC6\u6765\u6E90\u6E20\u9053",table:{defaultValue:{summary:"undefined"}}},welcomeMessage:{control:"text",description:"\u6B22\u8FCE\u6D88\u606F",table:{defaultValue:{summary:"\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u52A9\u4F60\u7684\u5417\uFF1F"}}},logoUrl:{control:"text",description:"Logo URL"},position:{control:"object",description:"\u6C14\u6CE1\u6309\u94AE\u4F4D\u7F6E\u5BF9\u8C61",table:{defaultValue:{summary:'{ bottom: "1.5rem", right: "1.5rem" }'}}}},args:{apiBaseUrl:"http://172.16.38.183:3003",site:"www.eufy.com",loginUserId:"test_test",welcomeMessage:"\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u52A9\u4F60\u7684\u5417\uFF1F"}};var y=d;const u={args:{loginUserId:"test_test",apiBaseUrl:"http://172.16.38.183:3003",cartId:"gid://shopify/Cart/hWN7wB3Pa12gh78d8hPOAUBI?key=0e73db1d3fb5ac21da19099c45033253",accessToken:"47b1aa2c0797043f9baba39388029d70",title:"eufy",commonText:{learnMore:"Learn More",total:"Total"},site:"beta.eufy.com",channelCode:"dtc",recaptchaAction:"chat"}},h={args:{position:{bottom:"1.5rem",left:"1.5rem"}}},C={args:{logoUrl:"https://images.unsplash.com/photo-1599305445671-ac291c95aaa9?w=100&h=100&fit=crop",welcomeMessage:"\u6B22\u8FCE\u6765\u5230 Soundcore\uFF01\u6211\u662F\u60A8\u7684\u4E13\u5C5E AI \u52A9\u624B \u{1F3A7}"}},f={args:{quickReplies:[{id:"1",label:"\u67E5\u8BE2\u4EF7\u683C",value:"\u6211\u60F3\u4E86\u89E3\u4EA7\u54C1\u4EF7\u683C",icon:"\u{1F4B0}"},{id:"2",label:"\u67E5\u8BE2\u7269\u6D41",value:"\u6211\u60F3\u67E5\u8BE2\u8BA2\u5355\u7269\u6D41",icon:"\u{1F4E6}"},{id:"3",label:"\u552E\u540E\u670D\u52A1",value:"\u6211\u9700\u8981\u552E\u540E\u5E2E\u52A9",icon:"\u{1F527}"},{id:"4",label:"\u4EA7\u54C1\u63A8\u8350",value:"\u8BF7\u63A8\u8350\u9002\u5408\u6211\u7684\u4EA7\u54C1",icon:"\u2B50"}]}},v={args:{welcomeMessage:`
+\u{1F44B} \u60A8\u597D\uFF01\u6B22\u8FCE\u6765\u5230 Soundcore \u5B98\u65B9\u5546\u57CE\u3002
+
+\u6211\u662F\u60A8\u7684 AI \u8D2D\u7269\u52A9\u624B\uFF0C\u53EF\u4EE5\u5E2E\u60A8\uFF1A
+- \u{1F50D} \u67E5\u627E\u4EA7\u54C1
+- \u{1F4B0} \u6BD4\u8F83\u4EF7\u683C
+- \u{1F4E6} \u8DDF\u8E2A\u8BA2\u5355
+- \u{1F4AC} \u89E3\u7B54\u7591\u95EE
+
+\u6709\u4EC0\u4E48\u6211\u53EF\u4EE5\u5E2E\u52A9\u60A8\u7684\u5417\uFF1F
+    `.trim()}},x={args:{title:"",showNewSessionButton:!0,position:{bottom:"24px",right:"30px"},chatBubbleIcon:"https://cdn.shopify.com/s/files/1/0504/7094/4954/files/Rectangle_400770314.png?v=1768894153",headers:void 0,site:"beta.eufy.com"},render:t=>o(i,{...t,onOpen:()=>{console.log("[Story] Chat opened")},onClose:()=>{console.log("[Story] Chat closed")},onMessageSend:e=>{console.log("[Story] Message sent:",e)},onError:e=>{console.error("[Story] Error occurred:",e)},onTextMessage:()=>{console.log("\u{1F4DD} [Story] AI started replying with text message")},onProductList:()=>{console.log("\u{1F4E6} [Story] AI replied with product list card")},onPromotionList:()=>{console.log("\u{1F389} [Story] AI replied with promotion list card")},onAddToCart:e=>{console.log("\u{1F6D2} [Story] Add to Cart clicked!"),console.log("\u{1F4E6} Product Info:",{id:e.shopifyId,title:e.title,price:e.price,imageUrl:e.imageUrl,productUrl:e.productUrl}),console.log("\u{1F4CB} Full Product Object:",e),alert(`\u2705 "${e.title}" \u5DF2\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\uFF01
+
+\u4EF7\u683C: ${e.price.currency} ${e.price.amount}`)},onCart:(e,r)=>{console.log("\u{1F6D2} [Story] Cart button clicked!"),console.log("\u{1F4CB} Cart ID:",e),console.log("\u{1F517} Checkout URL:",r),alert(`\u8D2D\u7269\u8F66\u6309\u94AE\u88AB\u70B9\u51FB\uFF01
+
+Cart ID: ${e}
+Checkout URL: ${r||"\u65E0"}`)}})},b={args:{customRenderers:{video:{render:t=>{const e=t;return a("div",{className:"w-full",children:[o("video",{src:e.url,controls:!0,className:"w-full rounded-lg",poster:e.poster,children:"\u60A8\u7684\u6D4F\u89C8\u5668\u4E0D\u652F\u6301\u89C6\u9891\u64AD\u653E"}),e.title&&o("p",{className:"mt-2 text-sm text-gray-600",children:e.title})]})}}}}},A={args:{customRenderers:{image_gallery:{render:t=>{const r=t.images||[];return o("div",{className:"grid grid-cols-2 gap-2",children:r.map((s,n)=>o("div",{className:"relative aspect-square",children:o("img",{src:s.url,alt:s.alt||`Image ${n+1}`,className:"size-full rounded-lg object-cover"})},n))})}}}}},S={parameters:{viewport:{defaultViewport:"mobile1"}},args:{}},w={parameters:{viewport:{defaultViewport:"tablet"}},args:{}},k={render:()=>a("div",{className:"relative h-screen w-full bg-gray-50",children:[o("div",{className:"absolute inset-0 flex items-center justify-center",children:o("p",{className:"text-gray-500",children:"\u9875\u9762\u5185\u5BB9\u533A\u57DF"})}),o("div",{className:"absolute bottom-4 right-4 text-xs text-gray-400",children:"\u9ED8\u8BA4\u4F4D\u7F6E (\u53F3\u4E0B\u89D2)"}),o(i,{apiBaseUrl:"https://beta-api-livechat.anker.com",site:"www.eufy.com"})]})},I={render:t=>o(i,{...t,onAddToCart:e=>{console.log("\u{1F6D2} [ProductComparison Story] Add to Cart clicked!"),console.log("\u{1F4E6} Product Info:",{id:e.shopifyId,title:e.title,price:e.price,imageUrl:e.imageUrl,productUrl:e.productUrl}),console.log("\u{1F4CB} Full Product Object:",e),alert(`\u2705 "${e.title}" \u5DF2\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\uFF01
+
+\u4EF7\u683C: ${e.price.currency} ${e.price.amount}`)}}),args:{welcomeMessage:"\u4EE5\u4E0B\u662F\u60A8\u5173\u6CE8\u7684\u4EA7\u54C1\u5BF9\u6BD4\u4FE1\u606F\uFF1A"},parameters:{docs:{description:{story:`
+\u4EA7\u54C1\u5BF9\u6BD4\u6D88\u606F\u652F\u6301\u4EE5\u4E0B\u7EF4\u5EA6\uFF1A
+
+- **\u4EF7\u683C\u5BF9\u6BD4**: \u663E\u793A\u4EA7\u54C1\u7684\u4EF7\u683C\u533A\u95F4\u548C\u4FC3\u9500\u6807\u7B7E
+- **\u4F1A\u5458\u4EF7\u5BF9\u6BD4**: \u663E\u793A\u4F1A\u5458\u4E13\u4EAB\u4EF7\u683C\uFF08\u5982\u679C\u53EF\u7528\uFF09
+- **\u53D8\u4F53\u6570\u91CF\u5BF9\u6BD4**: \u663E\u793A\u4EA7\u54C1\u7684\u53EF\u9009\u53D8\u4F53\u6570\u91CF
+- **\u6298\u6263\u5BF9\u6BD4**: \u663E\u793A\u4EA7\u54C1\u662F\u5426\u6709\u6298\u6263\u6D3B\u52A8
+
+\u7EC4\u4EF6\u4F1A\u81EA\u52A8\u5904\u7406\u4ECE\u540E\u7AEF\u8FD4\u56DE\u7684\u4EA7\u54C1\u5BF9\u6BD4\u6570\u636E\uFF0C\u5305\u62EC\uFF1A
+- \u4EA7\u54C1\u57FA\u672C\u4FE1\u606F\uFF08\u56FE\u7247\u3001\u6807\u9898\u3001\u4EF7\u683C\u7B49\uFF09
+- \u591A\u7EF4\u5EA6\u5BF9\u6BD4\u6570\u636E\uFF08\u4EF7\u683C\u3001\u4F1A\u5458\u4EF7\u3001\u53D8\u4F53\u3001\u6298\u6263\uFF09
+- \u54CD\u5E94\u5F0F\u5E03\u5C40\uFF08\u79FB\u52A8\u7AEF\u53EF\u6A2A\u5411\u6EDA\u52A8\uFF09
+
+**\u6D4B\u8BD5 Add to Cart \u529F\u80FD\uFF1A**
+- \u70B9\u51FB\u4EA7\u54C1\u5BF9\u6BD4\u5361\u7247\u4E2D\u7684 "Add to Cart" \u6309\u94AE
+- \u67E5\u770B\u63A7\u5236\u53F0\u8F93\u51FA\u7684\u4EA7\u54C1\u4FE1\u606F
+- \u4F1A\u5F39\u51FA\u786E\u8BA4\u63D0\u793A\u6846\u663E\u793A\u5DF2\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66
+        `}}}},R={args:{welcomeMessage:"\u4EE5\u4E0B\u662F\u4E0E\u60A8\u7684\u95EE\u9898\u76F8\u5173\u7684\u5E38\u89C1\u89E3\u7B54\uFF1A"},parameters:{docs:{description:{story:`
+FAQ \u5217\u8868\u6D88\u606F\u652F\u6301\uFF1A
+
+- **\u53EF\u6298\u53E0\u95EE\u9898**: \u70B9\u51FB\u95EE\u9898\u6807\u9898\u5C55\u5F00/\u6298\u53E0\u7B54\u6848
+- **Markdown \u7B54\u6848**: \u7B54\u6848\u652F\u6301 Markdown \u683C\u5F0F\uFF0C\u53EF\u663E\u793A\u5BCC\u6587\u672C
+- **\u76F8\u5173\u95EE\u9898**: \u5C55\u5F00\u7B54\u6848\u540E\u663E\u793A\u76F8\u5173\u95EE\u9898\uFF0C\u70B9\u51FB\u53EF\u89E6\u53D1\u65B0\u641C\u7D22
+- **\u5206\u7C7B\u6807\u8BB0**: \u6839\u636E\u95EE\u9898\u5206\u7C7B\u663E\u793A\uFF08\u914D\u9001\u3001\u9000\u8D27\u3001\u4EA7\u54C1\u3001\u652F\u4ED8\u3001\u901A\u7528\uFF09
+- **\u641C\u7D22\u7ED3\u679C\u7EDF\u8BA1**: \u663E\u793A\u627E\u5230\u7684\u95EE\u9898\u6570\u91CF
+
+\u4F7F\u7528\u573A\u666F\uFF1A
+- \u7528\u6237\u8BE2\u95EE\u5E38\u89C1\u95EE\u9898\u65F6\u8FD4\u56DE FAQ \u5217\u8868
+- \u4EA7\u54C1\u4E13\u5C5E\u95EE\u9898\u67E5\u8BE2
+- \u6309\u5206\u7C7B\u67E5\u8BE2 FAQ
+        `}}}},U={args:{recaptchaSitekey:"6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14",recaptchaAction:"livechat"},parameters:{docs:{description:{story:`
+### reCAPTCHA v3 \u914D\u7F6E
+
+\u542F\u7528 reCAPTCHA v3 \u53EF\u4EE5\u4FDD\u62A4\u4F60\u7684 API \u514D\u53D7\u673A\u5668\u4EBA\u548C\u6EE5\u7528\u884C\u4E3A\u7684\u653B\u51FB\u3002
+
+**\u914D\u7F6E\u6B65\u9AA4\uFF1A**
+
+1. \u5728 [Google reCAPTCHA](https://www.google.com/recaptcha/admin) \u521B\u5EFA v3 \u5BC6\u94A5
+2. \u5728\u9875\u9762\u4E2D\u52A0\u8F7D reCAPTCHA \u811A\u672C\uFF1A
+   \`\`\`html
+   <script src="https://www.google.com/recaptcha/api.js?render=YOUR_SITE_KEY"><\/script>
+   \`\`\`
+3. \u914D\u7F6E LiveChatWidget \u7EC4\u4EF6\uFF08\u63D0\u4F9B sitekey \u5373\u81EA\u52A8\u542F\u7528\uFF09\uFF1A
+   \`\`\`tsx
+   <LiveChatWidget
+     recaptchaSitekey="YOUR_SITE_KEY"
+     recaptchaAction="livechat"
+   />
+   \`\`\`
+
+**\u5DE5\u4F5C\u539F\u7406\uFF1A**
+
+- \u63D0\u4F9B recaptchaSitekey \u53C2\u6570\u5373\u81EA\u52A8\u542F\u7528 reCAPTCHA \u9A8C\u8BC1
+- \u6BCF\u6B21\u53D1\u9001\u6D88\u606F\u6216\u521B\u5EFA\u4F1A\u8BDD\u65F6\uFF0C\u4F1A\u81EA\u52A8\u83B7\u53D6 reCAPTCHA token
+- token \u4F1A\u901A\u8FC7 \`X-Recaptcha-Token\` header \u53D1\u9001\u5230\u540E\u7AEF
+- \u540E\u7AEF\u9700\u8981\u9A8C\u8BC1 token \u7684\u6709\u6548\u6027
+
+**\u6CE8\u610F\u4E8B\u9879\uFF1A**
+
+- reCAPTCHA v3 \u5728\u540E\u53F0\u8FD0\u884C\uFF0C\u4E0D\u4F1A\u6253\u65AD\u7528\u6237\u4F53\u9A8C
+- \u5EFA\u8BAE\u4E3A\u4E0D\u540C\u7684\u64CD\u4F5C\u4F7F\u7528\u4E0D\u540C\u7684 \`recaptchaAction\` \u4EE5\u4FBF\u5206\u6790
+- \u786E\u4FDD\u540E\u7AEF\u6B63\u786E\u9A8C\u8BC1 reCAPTCHA token
+- \u4E0D\u63D0\u4F9B recaptchaSitekey \u5219\u4E0D\u542F\u7528\u9A8C\u8BC1\uFF08\u4EC5\u7528\u4E8E\u5F00\u53D1\u73AF\u5883\uFF09
+        `}}}},M={args:{loginUserId:"test_test",apiBaseUrl:"http://172.16.38.183:3003",cartId:"gid://shopify/Cart/hWN7wB3Pa12gh78d8hPOAUBI?key=0e73db1d3fb5ac21da19099c45033253",accessToken:"47b1aa2c0797043f9baba39388029d70",title:"eufy",site:"beta.eufy.com",channelCode:"dtc",welcomeMessage:'\u4F60\u597D\uFF01\u6211\u53EF\u4EE5\u4E3A\u4F60\u63A8\u8350\u4EA7\u54C1\uFF0C\u8BD5\u8BD5\u53D1\u9001 "\u63A8\u8350\u4EA7\u54C1" \u6765\u67E5\u770B\u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6548\u679C\u3002',productCardRender:t=>{const e=t.featured_image||"",r=t.title||"",s=t.description||"",n=t.price_range?.min||t.variants?.[0]?.price||0,p=t.price_range?.currency||t.variants?.[0]?.currency||"USD",c=t.average_rating;return o("div",{style:{border:"2px solid #4CAF50",borderRadius:"16px",padding:"20px",margin:"12px 0",backgroundColor:"#f0f9ff",boxShadow:"0 4px 12px rgba(76, 175, 80, 0.15)",transition:"transform 0.2s"},onMouseEnter:l=>{l.currentTarget.style.transform="scale(1.02)"},onMouseLeave:l=>{l.currentTarget.style.transform="scale(1)"},children:a("div",{style:{display:"flex",gap:"16px",alignItems:"center"},children:[o("div",{style:{width:"70px",height:"auto",flexShrink:0,borderRadius:"12px",overflow:"hidden",border:"2px solid #e0e0e0"},children:o("img",{src:e,alt:r,style:{width:"100%",height:"100%",objectFit:"cover"}})}),a("div",{style:{flex:1},children:[o("h3",{style:{margin:"0 0 8px 0",fontSize:"18px",fontWeight:"bold",color:"#1a1a1a",lineHeight:"1.4"},children:r}),s&&o("p",{style:{margin:"0 0 12px 0",fontSize:"14px",color:"#666",lineHeight:"1.5",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden"},children:s}),a("div",{style:{display:"flex",alignItems:"center",gap:"12px"},children:[o("div",{style:{fontSize:"24px",fontWeight:"bold",color:"#4CAF50"},children:"'test price'"}),c!==void 0&&a("div",{style:{display:"flex",alignItems:"center",gap:"4px",fontSize:"14px",color:"#666"},children:[o("span",{style:{color:"#FFB800"},children:"\u2B50"}),o("span",{children:c.toFixed(1)})]}),o("button",{style:{marginLeft:"auto",padding:"8px 20px",backgroundColor:"#4CAF50",color:"white",borderRadius:"8px",textDecoration:"none",fontSize:"14px",fontWeight:"bold",transition:"background-color 0.2s"},onClick:()=>{console.log("View Details",t)},children:"View Details"})]})]})]})})},onAddToCart:t=>{console.log("Add to cart:",t),alert(`Added ${t.title} to cart!`)}},parameters:{docs:{description:{story:`
+### \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6E32\u67D3
+
+\u4F7F\u7528 \`productCardRender\` \u5C5E\u6027\u53EF\u4EE5\u5B8C\u5168\u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u7684\u5C55\u793A\u6837\u5F0F\u3002
+
+**\u529F\u80FD\u8BF4\u660E\uFF1A**
+
+- \u5F53\u540E\u7AEF\u8FD4\u56DE\u5E26\u6709\u4EA7\u54C1\u5360\u4F4D\u7B26 \`{{product:xxx}}\` \u7684\u6587\u672C\u6D41\u65F6\uFF0C\u4F1A\u4F7F\u7528\u81EA\u5B9A\u4E49\u6E32\u67D3\u51FD\u6570
+- \u81EA\u5B9A\u4E49\u51FD\u6570\u63A5\u6536\u5B8C\u6574\u7684\u4EA7\u54C1\u5BF9\u8C61\u4F5C\u4E3A\u53C2\u6570
+- \u8FD4\u56DE React \u8282\u70B9\uFF0C\u53EF\u4EE5\u662F\u4EFB\u4F55\u5408\u6CD5\u7684 JSX
+- \u5982\u679C\u4E0D\u63D0\u4F9B \`productCardRender\`\uFF0C\u5219\u4F7F\u7528\u9ED8\u8BA4\u7684\u4EA7\u54C1\u5361\u7247\u6837\u5F0F
+
+**\u6D4B\u8BD5\u6B65\u9AA4\uFF1A**
+
+1. \u6253\u5F00\u804A\u5929\u7A97\u53E3
+2. \u53D1\u9001 "\u63A8\u8350\u4EA7\u54C1" \u6216\u4EFB\u4F55\u4F1A\u89E6\u53D1\u4EA7\u54C1\u63A8\u8350\u7684\u6D88\u606F
+3. \u89C2\u5BDF\u8FD4\u56DE\u7684\u4EA7\u54C1\u5361\u7247\u4F7F\u7528\u7684\u662F\u81EA\u5B9A\u4E49\u6837\u5F0F\uFF08\u7EFF\u8272\u8FB9\u6846\u3001\u60AC\u505C\u653E\u5927\u6548\u679C\uFF09
+        `}}}};export{C as CustomBranding,A as CustomImageGalleryRenderer,h as CustomPosition,M as CustomProductCardRender,b as CustomVideoRenderer,v as CustomWelcomeMessage,u as Default,k as DefaultPositionDemo,R as FAQListMessage,S as MobileView,I as ProductComparisonMessage,w as TabletView,x as WithEventCallbacks,f as WithQuickReplies,U as WithRecaptcha,y as default};
+//# sourceMappingURL=LiveChatWidget.stories.js.map

package/dist/esm/stories/LiveChatWidget.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/stories/LiveChatWidget.stories.tsx"],
+  "sourcesContent": ["/**\n * LiveChatWidget Storybook Stories\n * \u5C55\u793A LiveChat \u7EC4\u4EF6\u7684\u5404\u79CD\u4F7F\u7528\u573A\u666F\u548C\u914D\u7F6E\n */\n\nimport type { Meta, StoryObj } from '@storybook/react'\nimport { LiveChatWidget } from '../components/LiveChatWidget'\nimport type { MessageRenderer, MessageContent } from '../components/LiveChatWidget'\nimport '../styles/livechat.css'\n\nconst meta: Meta<typeof LiveChatWidget> = {\n  title: 'Campaign/LiveChatWidget',\n  component: LiveChatWidget,\n  parameters: {\n    layout: 'fullscreen',\n    docs: {\n      story: {\n        inline: false,\n        iframeHeight: 500,\n      },\n      description: {\n        component: `\n# LiveChat \u804A\u5929\u7EC4\u4EF6\n\n\u53EF\u590D\u7528\u7684\u6C14\u6CE1\u5F39\u7A97\u804A\u5929\u7EC4\u4EF6\uFF0C\u652F\u6301 SSE \u6D41\u5F0F\u6D88\u606F\u3001\u81EA\u5B9A\u4E49\u6E32\u67D3\u5668\u548C\u591A\u79CD\u6D88\u606F\u7C7B\u578B\u3002\n\n## \u529F\u80FD\u7279\u6027\n\n- \uD83C\uDF88 **\u6C14\u6CE1\u5F39\u7A97**: \u53EF\u81EA\u5B9A\u4E49\u4F4D\u7F6E\u7684\u60AC\u6D6E\u6C14\u6CE1\u6309\u94AE\n- \uD83D\uDCAC **\u6D41\u5F0F\u6D88\u606F**: \u57FA\u4E8E SSE \u7684\u5B9E\u65F6\u6D41\u5F0F\u54CD\u5E94\n- \uD83D\uDCE6 **\u591A\u79CD\u6D88\u606F\u7C7B\u578B**: \u6587\u672C\u3001\u5546\u54C1\u5361\u7247\u3001\u5546\u54C1\u5217\u8868\u3001\u653F\u7B56\u3001\u5FEB\u6377\u56DE\u590D\u7B49\n- \uD83C\uDFA8 **\u53EF\u5B9A\u5236**: \u652F\u6301\u81EA\u5B9A\u4E49\u54C1\u724C\u989C\u8272\u3001Logo\u3001\u6E32\u67D3\u5668\n- \uD83D\uDCF1 **\u54CD\u5E94\u5F0F**: \u79FB\u52A8\u7AEF\u5168\u5C4F\uFF0C\u684C\u9762\u7AEF\u56FA\u5B9A\u5C3A\u5BF8\n- \uD83D\uDCBE **\u4F1A\u8BDD\u7BA1\u7406**: \u81EA\u52A8\u7BA1\u7406 userId \u548C sessionId\n- \uD83D\uDD12 **\u5B89\u5168\u9632\u62A4**: \u5185\u7F6E XSS \u9632\u62A4\u548C\u8F93\u5165\u9A8C\u8BC1\n\n## \u57FA\u7840\u7528\u6CD5\n\n\\`\\`\\`tsx\nimport { LiveChatWidget } from '@anker-in/campaign-ui'\nimport '@anker-in/campaign-ui/livechat.css'\n\nfunction App() {\n  return (\n    <LiveChatWidget\n      apiBaseUrl=\"https://beta-api-livechat.anker.com\"\n      site=\"www.eufy.com\"\n      channel_code=\"web_homepage\"\n      welcomeMessage=\"\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\"\n    />\n  )\n}\n\\`\\`\\`\n\n## \u81EA\u5B9A\u4E49\u6E32\u67D3\u5668\n\n\\`\\`\\`tsx\nconst customRenderers = {\n  video: {\n    render: (content) => (\n      <video src={content.url} controls className=\"w-full rounded\" />\n    )\n  }\n}\n\n<LiveChatWidget\n  apiBaseUrl=\"...\"\n  site=\"...\"\n  customRenderers={customRenderers}\n/>\n\\`\\`\\`\n        `,\n      },\n    },\n  },\n  tags: ['autodocs'],\n  argTypes: {\n    apiBaseUrl: {\n      control: 'text',\n      description: 'API \u57FA\u7840 URL',\n    },\n    headers: {\n      control: 'object',\n      description: '\u81EA\u5B9A\u4E49\u8BF7\u6C42\u5934\uFF0C\u5C06\u5728\u6240\u6709 API \u8BF7\u6C42\u4E2D\u6DFB\u52A0',\n      table: {\n        defaultValue: { summary: 'undefined' },\n      },\n    },\n    recaptchaSitekey: {\n      control: 'text',\n      description: 'Google reCAPTCHA v3 site key\uFF0C\u63D0\u4F9B\u6B64\u53C2\u6570\u5C06\u81EA\u52A8\u542F\u7528 reCAPTCHA v3 \u9A8C\u8BC1',\n      table: {\n        defaultValue: { summary: 'undefined' },\n      },\n    },\n    recaptchaAction: {\n      control: 'text',\n      description: 'reCAPTCHA action \u540D\u79F0\uFF0C\u7528\u4E8E\u533A\u5206\u4E0D\u540C\u7684\u9A8C\u8BC1\u573A\u666F',\n      table: {\n        defaultValue: { summary: '\"activity\"' },\n      },\n    },\n    site: {\n      control: 'text',\n      description: 'Shopify \u5E97\u94FA URL',\n    },\n    channelCode: {\n      control: 'text',\n      description: '\u6E20\u9053\u7F16\u7801\uFF0C\u7528\u4E8E\u6807\u8BC6\u6765\u6E90\u6E20\u9053',\n      table: {\n        defaultValue: { summary: 'undefined' },\n      },\n    },\n    welcomeMessage: {\n      control: 'text',\n      description: '\u6B22\u8FCE\u6D88\u606F',\n      table: {\n        defaultValue: { summary: '\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u52A9\u4F60\u7684\u5417\uFF1F' },\n      },\n    },\n    logoUrl: {\n      control: 'text',\n      description: 'Logo URL',\n    },\n    position: {\n      control: 'object',\n      description: '\u6C14\u6CE1\u6309\u94AE\u4F4D\u7F6E\u5BF9\u8C61',\n      table: {\n        defaultValue: { summary: '{ bottom: \"1.5rem\", right: \"1.5rem\" }' },\n      },\n    },\n  },\n  args: {\n    apiBaseUrl: 'http://172.16.38.183:3003',\n    site: 'www.eufy.com',\n    loginUserId: 'test_test',\n    welcomeMessage: '\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u52A9\u4F60\u7684\u5417\uFF1F',\n  },\n}\n\nexport default meta\ntype Story = StoryObj<typeof LiveChatWidget>\n\n/**\n * \u9ED8\u8BA4\u914D\u7F6E\n *\n * \u6700\u7B80\u5355\u7684\u4F7F\u7528\u65B9\u5F0F\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u914D\u7F6E\u3002\n */\nexport const Default: Story = {\n  args: {\n    loginUserId: 'test_test',\n    apiBaseUrl: 'http://172.16.38.183:3003',\n    cartId: 'gid://shopify/Cart/hWN7wB3Pa12gh78d8hPOAUBI?key=0e73db1d3fb5ac21da19099c45033253',\n    accessToken: '47b1aa2c0797043f9baba39388029d70',\n    title: 'eufy',\n\n    commonText: {\n      learnMore: 'Learn More',\n      total: 'Total',\n    },\n\n    site: 'beta.eufy.com',\n    channelCode: 'dtc',\n\n    // reCAPTCHA \u914D\u7F6E\uFF08\u63D0\u4F9B sitekey \u5373\u81EA\u52A8\u542F\u7528\uFF09\n    // recaptchaSitekey: '6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14',\n    recaptchaAction: 'chat',\n  },\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u4F4D\u7F6E\n *\n * \u4F7F\u7528\u81EA\u5B9A\u4E49\u4F4D\u7F6E\u5BF9\u8C61\u6765\u63A7\u5236\u6C14\u6CE1\u6309\u94AE\u7684\u4F4D\u7F6E\u3002\n */\nexport const CustomPosition: Story = {\n  args: {\n    position: { bottom: '1.5rem', left: '1.5rem' },\n  },\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u54C1\u724C\u6837\u5F0F\n *\n * \u81EA\u5B9A\u4E49 Logo \u548C\u6B22\u8FCE\u6D88\u606F\u3002\n */\nexport const CustomBranding: Story = {\n  args: {\n    logoUrl: 'https://images.unsplash.com/photo-1599305445671-ac291c95aaa9?w=100&h=100&fit=crop',\n    welcomeMessage: '\u6B22\u8FCE\u6765\u5230 Soundcore\uFF01\u6211\u662F\u60A8\u7684\u4E13\u5C5E AI \u52A9\u624B \uD83C\uDFA7',\n  },\n}\n\n/**\n * \u5E26\u5FEB\u6377\u56DE\u590D\n *\n * \u5728\u6B22\u8FCE\u6D88\u606F\u540E\u663E\u793A\u5FEB\u6377\u56DE\u590D\u6309\u94AE\u3002\n */\nexport const WithQuickReplies: Story = {\n  args: {\n    quickReplies: [\n      {\n        id: '1',\n        label: '\u67E5\u8BE2\u4EF7\u683C',\n        value: '\u6211\u60F3\u4E86\u89E3\u4EA7\u54C1\u4EF7\u683C',\n        icon: '\uD83D\uDCB0',\n      },\n      {\n        id: '2',\n        label: '\u67E5\u8BE2\u7269\u6D41',\n        value: '\u6211\u60F3\u67E5\u8BE2\u8BA2\u5355\u7269\u6D41',\n        icon: '\uD83D\uDCE6',\n      },\n      {\n        id: '3',\n        label: '\u552E\u540E\u670D\u52A1',\n        value: '\u6211\u9700\u8981\u552E\u540E\u5E2E\u52A9',\n        icon: '\uD83D\uDD27',\n      },\n      {\n        id: '4',\n        label: '\u4EA7\u54C1\u63A8\u8350',\n        value: '\u8BF7\u63A8\u8350\u9002\u5408\u6211\u7684\u4EA7\u54C1',\n        icon: '\u2B50',\n      },\n    ],\n  },\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u6B22\u8FCE\u6D88\u606F\n *\n * \u81EA\u5B9A\u4E49\u9996\u6B21\u6253\u5F00\u804A\u5929\u7A97\u53E3\u65F6\u7684\u6B22\u8FCE\u6D88\u606F\u3002\n */\nexport const CustomWelcomeMessage: Story = {\n  args: {\n    welcomeMessage: `\n\uD83D\uDC4B \u60A8\u597D\uFF01\u6B22\u8FCE\u6765\u5230 Soundcore \u5B98\u65B9\u5546\u57CE\u3002\n\n\u6211\u662F\u60A8\u7684 AI \u8D2D\u7269\u52A9\u624B\uFF0C\u53EF\u4EE5\u5E2E\u60A8\uFF1A\n- \uD83D\uDD0D \u67E5\u627E\u4EA7\u54C1\n- \uD83D\uDCB0 \u6BD4\u8F83\u4EF7\u683C\n- \uD83D\uDCE6 \u8DDF\u8E2A\u8BA2\u5355\n- \uD83D\uDCAC \u89E3\u7B54\u7591\u95EE\n\n\u6709\u4EC0\u4E48\u6211\u53EF\u4EE5\u5E2E\u52A9\u60A8\u7684\u5417\uFF1F\n    `.trim(),\n  },\n}\n\n/**\n * \u4E8B\u4EF6\u56DE\u8C03\n *\n * \u76D1\u542C\u7EC4\u4EF6\u4E8B\u4EF6\u8FDB\u884C\u81EA\u5B9A\u4E49\u5904\u7406\u3002\n */\nexport const WithEventCallbacks: Story = {\n  args: {\n    title: '',\n    showNewSessionButton: true,\n\n    position: {\n      bottom: '24px',\n      right: '30px',\n    },\n\n    chatBubbleIcon: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/Rectangle_400770314.png?v=1768894153',\n\n    // \u81EA\u5B9A\u4E49\u8BF7\u6C42\u5934\u793A\u4F8B\n    headers: undefined,\n\n    site: 'beta.eufy.com',\n  },\n\n  render: args => (\n    <LiveChatWidget\n      {...args}\n      onOpen={() => {\n        console.log('[Story] Chat opened')\n      }}\n      onClose={() => {\n        console.log('[Story] Chat closed')\n      }}\n      onMessageSend={(message: string) => {\n        console.log('[Story] Message sent:', message)\n      }}\n      onError={(error: Error) => {\n        console.error('[Story] Error occurred:', error)\n      }}\n      onTextMessage={() => {\n        console.log('\uD83D\uDCDD [Story] AI started replying with text message')\n      }}\n      onProductList={() => {\n        console.log('\uD83D\uDCE6 [Story] AI replied with product list card')\n      }}\n      onPromotionList={() => {\n        console.log('\uD83C\uDF89 [Story] AI replied with promotion list card')\n      }}\n      onAddToCart={(product: any) => {\n        console.log('\uD83D\uDED2 [Story] Add to Cart clicked!')\n        console.log('\uD83D\uDCE6 Product Info:', {\n          id: product.shopifyId,\n          title: product.title,\n          price: product.price,\n          imageUrl: product.imageUrl,\n          productUrl: product.productUrl,\n        })\n        console.log('\uD83D\uDCCB Full Product Object:', product)\n\n        // \u6A21\u62DF\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\u6210\u529F\n        alert(`\u2705 \"${product.title}\" \u5DF2\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\uFF01\\n\\n\u4EF7\u683C: ${product.price.currency} ${product.price.amount}`)\n      }}\n      onCart={(cartId: string, checkoutUrl?: string) => {\n        console.log('\uD83D\uDED2 [Story] Cart button clicked!')\n        console.log('\uD83D\uDCCB Cart ID:', cartId)\n        console.log('\uD83D\uDD17 Checkout URL:', checkoutUrl)\n\n        // \u6A21\u62DF\u8D2D\u7269\u8F66\u6309\u94AE\u70B9\u51FB\u6210\u529F\n        alert(`\u8D2D\u7269\u8F66\u6309\u94AE\u88AB\u70B9\u51FB\uFF01\\n\\nCart ID: ${cartId}\\nCheckout URL: ${checkoutUrl || '\u65E0'}`)\n      }}\n    />\n  ),\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u89C6\u9891\u6D88\u606F\u6E32\u67D3\u5668\n *\n * \u6269\u5C55\u6D88\u606F\u7C7B\u578B\uFF0C\u6DFB\u52A0\u89C6\u9891\u6D88\u606F\u652F\u6301\u3002\n */\nexport const CustomVideoRenderer: Story = {\n  args: {\n    customRenderers: {\n      video: {\n        render: (content: MessageContent) => {\n          const videoContent = content as any\n          return (\n            <div className=\"w-full\">\n              <video src={videoContent.url} controls className=\"w-full rounded-lg\" poster={videoContent.poster}>\n                \u60A8\u7684\u6D4F\u89C8\u5668\u4E0D\u652F\u6301\u89C6\u9891\u64AD\u653E\n              </video>\n              {videoContent.title && <p className=\"mt-2 text-sm text-gray-600\">{videoContent.title}</p>}\n            </div>\n          )\n        },\n      } as MessageRenderer,\n    },\n  },\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u56FE\u7247\u753B\u5ECA\u6E32\u67D3\u5668\n *\n * \u6269\u5C55\u6D88\u606F\u7C7B\u578B\uFF0C\u6DFB\u52A0\u56FE\u7247\u753B\u5ECA\u652F\u6301\u3002\n */\nexport const CustomImageGalleryRenderer: Story = {\n  args: {\n    customRenderers: {\n      image_gallery: {\n        render: (content: MessageContent) => {\n          const galleryContent = content as any\n          const images = galleryContent.images || []\n\n          return (\n            <div className=\"grid grid-cols-2 gap-2\">\n              {images.map((image: any, index: number) => (\n                <div key={index} className=\"relative aspect-square\">\n                  <img\n                    src={image.url}\n                    alt={image.alt || `Image ${index + 1}`}\n                    className=\"size-full rounded-lg object-cover\"\n                  />\n                </div>\n              ))}\n            </div>\n          )\n        },\n      } as MessageRenderer,\n    },\n  },\n}\n\n/**\n * \u79FB\u52A8\u7AEF\u9884\u89C8\n *\n * \u5728\u79FB\u52A8\u7AEF\u5C3A\u5BF8\u4E0B\u67E5\u770B\u6548\u679C\uFF08\u5168\u5C4F\u663E\u793A\uFF09\u3002\n */\nexport const MobileView: Story = {\n  parameters: {\n    viewport: {\n      defaultViewport: 'mobile1',\n    },\n  },\n  args: {},\n}\n\n/**\n * \u5E73\u677F\u7AEF\u9884\u89C8\n *\n * \u5728\u5E73\u677F\u7AEF\u5C3A\u5BF8\u4E0B\u67E5\u770B\u6548\u679C\u3002\n */\nexport const TabletView: Story = {\n  parameters: {\n    viewport: {\n      defaultViewport: 'tablet',\n    },\n  },\n  args: {},\n}\n\n/**\n * \u9ED8\u8BA4\u4F4D\u7F6E\u5C55\u793A\n *\n * \u5C55\u793A\u6C14\u6CE1\u6309\u94AE\u7684\u9ED8\u8BA4\u4F4D\u7F6E\uFF08\u53F3\u4E0B\u89D2\uFF09\u3002\n */\nexport const DefaultPositionDemo: Story = {\n  render: () => (\n    <div className=\"relative h-screen w-full bg-gray-50\">\n      <div className=\"absolute inset-0 flex items-center justify-center\">\n        <p className=\"text-gray-500\">\u9875\u9762\u5185\u5BB9\u533A\u57DF</p>\n      </div>\n\n      {/* \u6F14\u793A\u9ED8\u8BA4\u4F4D\u7F6E */}\n      <div className=\"absolute bottom-4 right-4 text-xs text-gray-400\">\u9ED8\u8BA4\u4F4D\u7F6E (\u53F3\u4E0B\u89D2)</div>\n\n      <LiveChatWidget apiBaseUrl=\"https://beta-api-livechat.anker.com\" site=\"www.eufy.com\" />\n    </div>\n  ),\n}\n\n/**\n * \u4EA7\u54C1\u5BF9\u6BD4\u6D88\u606F\n *\n * \u5C55\u793A\u4EA7\u54C1\u5BF9\u6BD4\u7C7B\u578B\u7684\u6D88\u606F\u6E32\u67D3\u6548\u679C\uFF0C\u5305\u62EC\u4EF7\u683C\u3001\u4F1A\u5458\u4EF7\u3001\u53D8\u4F53\u6570\u91CF\u3001\u6298\u6263\u7B49\u591A\u4E2A\u7EF4\u5EA6\u7684\u5BF9\u6BD4\u3002\n *\n * \u4EA7\u54C1\u5BF9\u6BD4\u7EC4\u4EF6\u4F1A\u4EE5\u7F51\u683C\u5E03\u5C40\u5C55\u793A\u591A\u4E2A\u4EA7\u54C1\u7684\u57FA\u672C\u4FE1\u606F\uFF0C\u5E76\u5728\u4E0B\u65B9\u663E\u793A\u5404\u7EF4\u5EA6\u7684\u5BF9\u6BD4\u6570\u636E\u3002\n */\nexport const ProductComparisonMessage: Story = {\n  render: args => (\n    <LiveChatWidget\n      {...args}\n      onAddToCart={(product: any) => {\n        console.log('\uD83D\uDED2 [ProductComparison Story] Add to Cart clicked!')\n        console.log('\uD83D\uDCE6 Product Info:', {\n          id: product.shopifyId,\n          title: product.title,\n          price: product.price,\n          imageUrl: product.imageUrl,\n          productUrl: product.productUrl,\n        })\n        console.log('\uD83D\uDCCB Full Product Object:', product)\n\n        // \u6A21\u62DF\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\u6210\u529F\n        alert(`\u2705 \"${product.title}\" \u5DF2\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\uFF01\\n\\n\u4EF7\u683C: ${product.price.currency} ${product.price.amount}`)\n      }}\n    />\n  ),\n  args: {\n    welcomeMessage: '\u4EE5\u4E0B\u662F\u60A8\u5173\u6CE8\u7684\u4EA7\u54C1\u5BF9\u6BD4\u4FE1\u606F\uFF1A',\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: `\n\u4EA7\u54C1\u5BF9\u6BD4\u6D88\u606F\u652F\u6301\u4EE5\u4E0B\u7EF4\u5EA6\uFF1A\n\n- **\u4EF7\u683C\u5BF9\u6BD4**: \u663E\u793A\u4EA7\u54C1\u7684\u4EF7\u683C\u533A\u95F4\u548C\u4FC3\u9500\u6807\u7B7E\n- **\u4F1A\u5458\u4EF7\u5BF9\u6BD4**: \u663E\u793A\u4F1A\u5458\u4E13\u4EAB\u4EF7\u683C\uFF08\u5982\u679C\u53EF\u7528\uFF09\n- **\u53D8\u4F53\u6570\u91CF\u5BF9\u6BD4**: \u663E\u793A\u4EA7\u54C1\u7684\u53EF\u9009\u53D8\u4F53\u6570\u91CF\n- **\u6298\u6263\u5BF9\u6BD4**: \u663E\u793A\u4EA7\u54C1\u662F\u5426\u6709\u6298\u6263\u6D3B\u52A8\n\n\u7EC4\u4EF6\u4F1A\u81EA\u52A8\u5904\u7406\u4ECE\u540E\u7AEF\u8FD4\u56DE\u7684\u4EA7\u54C1\u5BF9\u6BD4\u6570\u636E\uFF0C\u5305\u62EC\uFF1A\n- \u4EA7\u54C1\u57FA\u672C\u4FE1\u606F\uFF08\u56FE\u7247\u3001\u6807\u9898\u3001\u4EF7\u683C\u7B49\uFF09\n- \u591A\u7EF4\u5EA6\u5BF9\u6BD4\u6570\u636E\uFF08\u4EF7\u683C\u3001\u4F1A\u5458\u4EF7\u3001\u53D8\u4F53\u3001\u6298\u6263\uFF09\n- \u54CD\u5E94\u5F0F\u5E03\u5C40\uFF08\u79FB\u52A8\u7AEF\u53EF\u6A2A\u5411\u6EDA\u52A8\uFF09\n\n**\u6D4B\u8BD5 Add to Cart \u529F\u80FD\uFF1A**\n- \u70B9\u51FB\u4EA7\u54C1\u5BF9\u6BD4\u5361\u7247\u4E2D\u7684 \"Add to Cart\" \u6309\u94AE\n- \u67E5\u770B\u63A7\u5236\u53F0\u8F93\u51FA\u7684\u4EA7\u54C1\u4FE1\u606F\n- \u4F1A\u5F39\u51FA\u786E\u8BA4\u63D0\u793A\u6846\u663E\u793A\u5DF2\u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\n        `,\n      },\n    },\n  },\n}\n\n/**\n * FAQ \u5217\u8868\u6D88\u606F\n *\n * \u5C55\u793A\u5E38\u89C1\u95EE\u9898\u5217\u8868\uFF0C\u652F\u6301\u6298\u53E0/\u5C55\u5F00\u3002\n *\n * FAQ \u7EC4\u4EF6\u4F1A\u663E\u793A\u641C\u7D22\u7ED3\u679C\u7684\u5E38\u89C1\u95EE\u9898\uFF0C\u6BCF\u4E2A\u95EE\u9898\u53EF\u4EE5\u70B9\u51FB\u5C55\u5F00\u67E5\u770B\u7B54\u6848\u3002\n */\nexport const FAQListMessage: Story = {\n  args: {\n    welcomeMessage: '\u4EE5\u4E0B\u662F\u4E0E\u60A8\u7684\u95EE\u9898\u76F8\u5173\u7684\u5E38\u89C1\u89E3\u7B54\uFF1A',\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: `\nFAQ \u5217\u8868\u6D88\u606F\u652F\u6301\uFF1A\n\n- **\u53EF\u6298\u53E0\u95EE\u9898**: \u70B9\u51FB\u95EE\u9898\u6807\u9898\u5C55\u5F00/\u6298\u53E0\u7B54\u6848\n- **Markdown \u7B54\u6848**: \u7B54\u6848\u652F\u6301 Markdown \u683C\u5F0F\uFF0C\u53EF\u663E\u793A\u5BCC\u6587\u672C\n- **\u76F8\u5173\u95EE\u9898**: \u5C55\u5F00\u7B54\u6848\u540E\u663E\u793A\u76F8\u5173\u95EE\u9898\uFF0C\u70B9\u51FB\u53EF\u89E6\u53D1\u65B0\u641C\u7D22\n- **\u5206\u7C7B\u6807\u8BB0**: \u6839\u636E\u95EE\u9898\u5206\u7C7B\u663E\u793A\uFF08\u914D\u9001\u3001\u9000\u8D27\u3001\u4EA7\u54C1\u3001\u652F\u4ED8\u3001\u901A\u7528\uFF09\n- **\u641C\u7D22\u7ED3\u679C\u7EDF\u8BA1**: \u663E\u793A\u627E\u5230\u7684\u95EE\u9898\u6570\u91CF\n\n\u4F7F\u7528\u573A\u666F\uFF1A\n- \u7528\u6237\u8BE2\u95EE\u5E38\u89C1\u95EE\u9898\u65F6\u8FD4\u56DE FAQ \u5217\u8868\n- \u4EA7\u54C1\u4E13\u5C5E\u95EE\u9898\u67E5\u8BE2\n- \u6309\u5206\u7C7B\u67E5\u8BE2 FAQ\n        `,\n      },\n    },\n  },\n}\n\n/**\n * \u5E26 reCAPTCHA \u914D\u7F6E\n *\n * \u5C55\u793A\u5982\u4F55\u914D\u7F6E Google reCAPTCHA v3 \u9A8C\u8BC1\uFF0C\u4FDD\u62A4 API \u8BF7\u6C42\u514D\u53D7\u6EE5\u7528\u3002\n *\n * reCAPTCHA \u4F1A\u5728\u540E\u53F0\u81EA\u52A8\u9A8C\u8BC1\u7528\u6237\u884C\u4E3A\uFF0C\u65E0\u9700\u7528\u6237\u624B\u52A8\u64CD\u4F5C\u3002\n */\nexport const WithRecaptcha: Story = {\n  args: {\n    // \u914D\u7F6E\u4F60\u7684 reCAPTCHA site key\uFF08\u63D0\u4F9B\u5373\u81EA\u52A8\u542F\u7528\uFF09\n    recaptchaSitekey: '6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14',\n    // \u53EF\u9009\uFF1A\u81EA\u5B9A\u4E49 action \u540D\u79F0\n    recaptchaAction: 'livechat',\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: `\n### reCAPTCHA v3 \u914D\u7F6E\n\n\u542F\u7528 reCAPTCHA v3 \u53EF\u4EE5\u4FDD\u62A4\u4F60\u7684 API \u514D\u53D7\u673A\u5668\u4EBA\u548C\u6EE5\u7528\u884C\u4E3A\u7684\u653B\u51FB\u3002\n\n**\u914D\u7F6E\u6B65\u9AA4\uFF1A**\n\n1. \u5728 [Google reCAPTCHA](https://www.google.com/recaptcha/admin) \u521B\u5EFA v3 \u5BC6\u94A5\n2. \u5728\u9875\u9762\u4E2D\u52A0\u8F7D reCAPTCHA \u811A\u672C\uFF1A\n   \\`\\`\\`html\n   <script src=\"https://www.google.com/recaptcha/api.js?render=YOUR_SITE_KEY\"></script>\n   \\`\\`\\`\n3. \u914D\u7F6E LiveChatWidget \u7EC4\u4EF6\uFF08\u63D0\u4F9B sitekey \u5373\u81EA\u52A8\u542F\u7528\uFF09\uFF1A\n   \\`\\`\\`tsx\n   <LiveChatWidget\n     recaptchaSitekey=\"YOUR_SITE_KEY\"\n     recaptchaAction=\"livechat\"\n   />\n   \\`\\`\\`\n\n**\u5DE5\u4F5C\u539F\u7406\uFF1A**\n\n- \u63D0\u4F9B recaptchaSitekey \u53C2\u6570\u5373\u81EA\u52A8\u542F\u7528 reCAPTCHA \u9A8C\u8BC1\n- \u6BCF\u6B21\u53D1\u9001\u6D88\u606F\u6216\u521B\u5EFA\u4F1A\u8BDD\u65F6\uFF0C\u4F1A\u81EA\u52A8\u83B7\u53D6 reCAPTCHA token\n- token \u4F1A\u901A\u8FC7 \\`X-Recaptcha-Token\\` header \u53D1\u9001\u5230\u540E\u7AEF\n- \u540E\u7AEF\u9700\u8981\u9A8C\u8BC1 token \u7684\u6709\u6548\u6027\n\n**\u6CE8\u610F\u4E8B\u9879\uFF1A**\n\n- reCAPTCHA v3 \u5728\u540E\u53F0\u8FD0\u884C\uFF0C\u4E0D\u4F1A\u6253\u65AD\u7528\u6237\u4F53\u9A8C\n- \u5EFA\u8BAE\u4E3A\u4E0D\u540C\u7684\u64CD\u4F5C\u4F7F\u7528\u4E0D\u540C\u7684 \\`recaptchaAction\\` \u4EE5\u4FBF\u5206\u6790\n- \u786E\u4FDD\u540E\u7AEF\u6B63\u786E\u9A8C\u8BC1 reCAPTCHA token\n- \u4E0D\u63D0\u4F9B recaptchaSitekey \u5219\u4E0D\u542F\u7528\u9A8C\u8BC1\uFF08\u4EC5\u7528\u4E8E\u5F00\u53D1\u73AF\u5883\uFF09\n        `,\n      },\n    },\n  },\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6E32\u67D3\n *\n * \u6F14\u793A\u5982\u4F55\u4F7F\u7528 productCardRender \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u7684\u6E32\u67D3\u6837\u5F0F\u3002\n *\n * \u5F53\u540E\u7AEF\u8FD4\u56DE\u4EA7\u54C1\u5360\u4F4D\u7B26 {{product:xxx}} \u65F6\uFF0C\u4F1A\u4F7F\u7528\u81EA\u5B9A\u4E49\u6E32\u67D3\u51FD\u6570\u6765\u5C55\u793A\u4EA7\u54C1\u5361\u7247\u3002\n */\nexport const CustomProductCardRender: Story = {\n  args: {\n    loginUserId: 'test_test',\n    apiBaseUrl: 'http://172.16.38.183:3003',\n    cartId: 'gid://shopify/Cart/hWN7wB3Pa12gh78d8hPOAUBI?key=0e73db1d3fb5ac21da19099c45033253',\n    accessToken: '47b1aa2c0797043f9baba39388029d70',\n    title: 'eufy',\n    site: 'beta.eufy.com',\n    channelCode: 'dtc',\n    welcomeMessage: '\u4F60\u597D\uFF01\u6211\u53EF\u4EE5\u4E3A\u4F60\u63A8\u8350\u4EA7\u54C1\uFF0C\u8BD5\u8BD5\u53D1\u9001 \"\u63A8\u8350\u4EA7\u54C1\" \u6765\u67E5\u770B\u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6548\u679C\u3002',\n\n    // \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6E32\u67D3\u51FD\u6570\n    // \u6CE8\u610F\uFF1Aproduct \u53C2\u6570\u662F\u539F\u59CB\u540E\u7AEF\u6570\u636E\uFF08\u672A\u7ECF\u8F6C\u6362\uFF09\n    productCardRender: (product) => {\n      // \u539F\u59CB\u540E\u7AEF\u6570\u636E\u4F7F\u7528 snake_case \u5B57\u6BB5\u540D\n      const imageUrl = product.featured_image || ''\n      const title = product.title || ''\n      const description = product.description || ''\n      const price = product.price_range?.min || product.variants?.[0]?.price || 0\n      const currency = product.price_range?.currency || product.variants?.[0]?.currency || 'USD'\n      const averageRating = product.average_rating\n\n      return (\n        <div\n          style={{\n            border: '2px solid #4CAF50',\n            borderRadius: '16px',\n            padding: '20px',\n            margin: '12px 0',\n            backgroundColor: '#f0f9ff',\n            boxShadow: '0 4px 12px rgba(76, 175, 80, 0.15)',\n            transition: 'transform 0.2s',\n          }}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.transform = 'scale(1.02)'\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.transform = 'scale(1)'\n          }}\n        >\n          <div style={{ display: 'flex', gap: '16px', alignItems: 'center' }}>\n            <div\n              style={{\n                width: '70px',\n                height: 'auto',\n                flexShrink: 0,\n                borderRadius: '12px',\n                overflow: 'hidden',\n                border: '2px solid #e0e0e0',\n              }}\n            >\n              <img\n                src={imageUrl}\n                alt={title}\n                style={{\n                  width: '100%',\n                  height: '100%',\n                  objectFit: 'cover',\n                }}\n              />\n            </div>\n\n            <div style={{ flex: 1 }}>\n              <h3\n                style={{\n                  margin: '0 0 8px 0',\n                  fontSize: '18px',\n                  fontWeight: 'bold',\n                  color: '#1a1a1a',\n                  lineHeight: '1.4',\n                }}\n              >\n                {title}\n              </h3>\n\n              {description && (\n                <p\n                  style={{\n                    margin: '0 0 12px 0',\n                    fontSize: '14px',\n                    color: '#666',\n                    lineHeight: '1.5',\n                    display: '-webkit-box',\n                    WebkitLineClamp: 2,\n                    WebkitBoxOrient: 'vertical',\n                    overflow: 'hidden',\n                  }}\n                >\n                  {description}\n                </p>\n              )}\n\n              <div style={{ display: 'flex', alignItems: 'center', gap: '12px' }}>\n                <div\n                  style={{\n                    fontSize: '24px',\n                    fontWeight: 'bold',\n                    color: '#4CAF50',\n                  }}\n                >\n                  'test price'\n                </div>\n\n                {averageRating !== undefined && (\n                  <div\n                    style={{\n                      display: 'flex',\n                      alignItems: 'center',\n                      gap: '4px',\n                      fontSize: '14px',\n                      color: '#666',\n                    }}\n                  >\n                    <span style={{ color: '#FFB800' }}>\u2B50</span>\n                    <span>{averageRating.toFixed(1)}</span>\n                  </div>\n                )}\n\n                <button\n      \n                  style={{\n                    marginLeft: 'auto',\n                    padding: '8px 20px',\n                    backgroundColor: '#4CAF50',\n                    color: 'white',\n                    borderRadius: '8px',\n                    textDecoration: 'none',\n                    fontSize: '14px',\n                    fontWeight: 'bold',\n                    transition: 'background-color 0.2s',\n                  }}\n                   onClick={() => {\n                    console.log('View Details', product)\n                  }}\n                >\n                  View Details\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )\n    },\n\n    onAddToCart: (product) => {\n      console.log('Add to cart:', product)\n      alert(`Added ${product.title} to cart!`)\n    },\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: `\n### \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6E32\u67D3\n\n\u4F7F\u7528 \\`productCardRender\\` \u5C5E\u6027\u53EF\u4EE5\u5B8C\u5168\u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u7684\u5C55\u793A\u6837\u5F0F\u3002\n\n**\u529F\u80FD\u8BF4\u660E\uFF1A**\n\n- \u5F53\u540E\u7AEF\u8FD4\u56DE\u5E26\u6709\u4EA7\u54C1\u5360\u4F4D\u7B26 \\`{{product:xxx}}\\` \u7684\u6587\u672C\u6D41\u65F6\uFF0C\u4F1A\u4F7F\u7528\u81EA\u5B9A\u4E49\u6E32\u67D3\u51FD\u6570\n- \u81EA\u5B9A\u4E49\u51FD\u6570\u63A5\u6536\u5B8C\u6574\u7684\u4EA7\u54C1\u5BF9\u8C61\u4F5C\u4E3A\u53C2\u6570\n- \u8FD4\u56DE React \u8282\u70B9\uFF0C\u53EF\u4EE5\u662F\u4EFB\u4F55\u5408\u6CD5\u7684 JSX\n- \u5982\u679C\u4E0D\u63D0\u4F9B \\`productCardRender\\`\uFF0C\u5219\u4F7F\u7528\u9ED8\u8BA4\u7684\u4EA7\u54C1\u5361\u7247\u6837\u5F0F\n\n**\u6D4B\u8BD5\u6B65\u9AA4\uFF1A**\n\n1. \u6253\u5F00\u804A\u5929\u7A97\u53E3\n2. \u53D1\u9001 \"\u63A8\u8350\u4EA7\u54C1\" \u6216\u4EFB\u4F55\u4F1A\u89E6\u53D1\u4EA7\u54C1\u63A8\u8350\u7684\u6D88\u606F\n3. \u89C2\u5BDF\u8FD4\u56DE\u7684\u4EA7\u54C1\u5361\u7247\u4F7F\u7528\u7684\u662F\u81EA\u5B9A\u4E49\u6837\u5F0F\uFF08\u7EFF\u8272\u8FB9\u6846\u3001\u60AC\u505C\u653E\u5927\u6548\u679C\uFF09\n        `,\n      },\n    },\n  },\n}\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "LiveChatWidget", "meta", "LiveChatWidget_stories_default", "Default", "CustomPosition", "CustomBranding", "WithQuickReplies", "CustomWelcomeMessage", "WithEventCallbacks", "args", "message", "error", "product", "cartId", "checkoutUrl", "CustomVideoRenderer", "content", "videoContent", "CustomImageGalleryRenderer", "images", "image", "index", "MobileView", "TabletView", "DefaultPositionDemo", "ProductComparisonMessage", "FAQListMessage", "WithRecaptcha", "CustomProductCardRender", "imageUrl", "title", "description", "price", "currency", "averageRating", "e"]
+}

package/dist/esm/templates/{credits.d.ts → Credits.d.ts}

@@ -68,6 +68,21 @@ export type CreditsTemplateProps = {
     };
     gtm: {
         pageGroup: string;
+        pageHandle?: string;
+    };
+    cartConfig?: {
+        addToCart: (params: {
+            variantList: Array<{
+                variant: any;
+                quantity: number;
+                attributes?: Array<{
+                    key: string;
+                    value: string;
+                }>;
+            }>;
+            cartAttributes?: Record<string, string>;
+            discountCodes?: string[];
+        }) => void | Promise<any>;
     };
 };
-export declare const CreditsTemplate: ({ headlessConfig, siteConfig, creditsConfig, userContext, pageConfig, registrationContext, gtm, }: CreditsTemplateProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CreditsTemplate: ({ headlessConfig, siteConfig, creditsConfig, userContext, pageConfig, registrationContext, gtm, cartConfig, }: CreditsTemplateProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/templates/Credits.js

@@ -0,0 +1,2 @@
+import{Fragment as F,jsx as o,jsxs as p}from"react/jsx-runtime";import{classNames as f,HeadlessProvider as y}from"@anker-in/lib";import{RegistrationProvider as l}from"../components/registration/context/provider";import{CreditsProvider as g}from"../components/credits/context/provider";import{CreditsBanner as P}from"../components/credits/creditsBanner";import{CreditsInfoCard as T}from"../components/credits/creditsInfoCard";import{CreditsBenefits as v}from"../components/credits/creditsBenefits";import{CreditsWaysToGetCredits as u}from"../components/credits/creditsWaysToGetCredits";import{CreditsAnkersolixTask as b}from"../components/credits/creditsAnkersolixTask";import{CreditsRedeemList as h}from"../components/credits/creditsRedeemList";import{CreditsCash as A}from"../components/credits/creditsCash";import{CreditsMemberPrice as B}from"../components/credits/creditsMemberPrice";import{CreditsFaq as I}from"../components/credits/creditsFaq";import{CreditsNavigation as L}from"../components/credits/creditsNavigation";var K=(r=>(r.Navigation="creditsNavigation",r.Banner="creditsBanner",r.InfoCard="creditsInfoCard",r.Benefits="creditsBenefits",r.WaysToGetCredits="creditsWaysToGetCredits",r.AnkersolixTask="creditsAnkersolixTask",r.RedeemList="creditsRedeemList",r.SpendCreditsLikeCash="creditsCash",r.MemberPrice="creditsMemberPrice",r.Faqs="creditsFaq",r))(K||{});const ae=({headlessConfig:a,siteConfig:n,creditsConfig:C,userContext:t,pageConfig:s,registrationContext:d,gtm:m,cartConfig:c})=>(console.log("siteConfig",n),o(y,{headlessConfig:a,children:o(l,{copy:n.registrationsSettings,email:t?.profile?.email,children:p(g,{profile:t?.profile,removeProfile:t?.removeProfile,isLoadingProfile:t?.isLoadingProfile,openSignInPopup:d.openSignInPopup,openSignUpPopup:d.openSignUpPopup,creditInfo:t?.creditInfo,taskIdToTypeMapping:n.taskIdToTypeMapping,customer:t?.customer,fetchCreditInfo:t?.fetchCreditInfo,customerLoading:t?.customerLoading,gtm:m,pageCommon:s.common,memberPriceDiscount:n.memberPriceDiscount,alpcBrand:C?.alpcBrand,cartConfig:c,children:[s.components.creditsNavigation&&o(L,{copy:s.components.creditsNavigation}),o("div",{className:f("bg-[#f5f5f7] leading-[1.2]"),children:s.order.map(e=>{if(e==="creditsNavigation")return null;const i=s.components?.[e];return i?p(F,{children:[e==="creditsBanner"&&o(P,{copy:i,id:e}),e==="creditsInfoCard"&&t?.profile&&o(T,{copy:i,id:e}),e==="creditsBenefits"&&o(v,{copy:i,id:e}),e==="creditsWaysToGetCredits"&&o(u,{copy:i,id:e,classNames:a.brand==="anker"?{subtitle:"text-white",equalCreditsText:"bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent"}:{subtitle:"text-[#D1D1D1]",equalCreditsText:"text-[#F6EAD0]"}}),e==="creditsAnkersolixTask"&&o(b,{copy:i,id:e}),e==="creditsRedeemList"&&o(h,{copy:i,id:e}),e==="creditsCash"&&o(A,{copy:i,id:e}),e==="creditsMemberPrice"&&o(B,{copy:i,id:e}),e==="creditsFaq"&&o(I,{copy:i,id:e}),e!=="creditsBanner"&&o("div",{className:"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16"})]}):null})})]})})}));export{K as ComponentKey,ae as CreditsTemplate};
+//# sourceMappingURL=Credits.js.map

package/dist/esm/templates/Credits.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/templates/Credits.tsx"],
+  "sourcesContent": ["import { classNames, HeadlessConfig, HeadlessProvider } from '@anker-in/lib'\nimport { RegistrationProvider } from '../components/registration/context/provider'\n\nimport { DTC_TASK_TYPE } from '../components/credits/context/const'\nimport { CreditsProvider } from '../components/credits/context/provider'\nimport { CreditsPageCommon } from '../components/credits/type'\nimport { FunctionMemberPriceConfig } from '../components/credits/context/memberPriceTypes'\n\nimport { CreditsBanner, CreditsBannerCopy } from '../components/credits/creditsBanner'\nimport { CreditsInfoCard, CreditsInfoCardCopy } from '../components/credits/creditsInfoCard'\nimport { CreditsBenefits, CreditsBenefitsCopy } from '../components/credits/creditsBenefits'\nimport { CreditsWaysToGetCredits, CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits'\nimport { CreditsAnkersolixTask, CreditsAnkersolixTaskCopy } from '../components/credits/creditsAnkersolixTask'\nimport { CreditsRedeemList, CreditsRedeemListCopy } from '../components/credits/creditsRedeemList'\nimport { CreditsCash, CreditsCashCopy } from '../components/credits/creditsCash'\nimport { CreditsMemberPrice, CreditsMemberPriceCopy } from '../components/credits/creditsMemberPrice'\nimport { CreditsFaq, CreditsFaqCopy } from '../components/credits/creditsFaq'\nimport { CreditsNavigation, CreditsNavigationCopy } from '../components/credits/creditsNavigation'\nimport { AuthCodeActivateCopy } from 'src/components/registration/authCodeActivate/type'\n\nexport enum ComponentKey {\n  Navigation = 'creditsNavigation',\n  Banner = 'creditsBanner',\n  InfoCard = 'creditsInfoCard',\n  Benefits = 'creditsBenefits',\n  WaysToGetCredits = 'creditsWaysToGetCredits',\n  AnkersolixTask = 'creditsAnkersolixTask',\n  RedeemList = 'creditsRedeemList',\n  SpendCreditsLikeCash = 'creditsCash',\n  MemberPrice = 'creditsMemberPrice',\n  Faqs = 'creditsFaq',\n}\nexport type CreditsTemplateProps = {\n  headlessConfig: HeadlessConfig\n  siteConfig: {\n    registrationsSettings: {\n      authCodeActivate: AuthCodeActivateCopy\n    }\n    taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n    memberPriceDiscount?: FunctionMemberPriceConfig[]\n  }\n  creditsConfig?: {\n    alpcBrand?: string\n  }\n  pageConfig: {\n    order: ComponentKey[]\n    common: CreditsPageCommon\n    components: {\n      [ComponentKey.Navigation]?: CreditsNavigationCopy\n      [ComponentKey.Banner]?: CreditsBannerCopy\n      [ComponentKey.InfoCard]?: CreditsInfoCardCopy\n      [ComponentKey.Benefits]?: CreditsBenefitsCopy\n      [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy\n      [ComponentKey.AnkersolixTask]?: CreditsAnkersolixTaskCopy\n      [ComponentKey.RedeemList]?: CreditsRedeemListCopy\n      [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy\n      [ComponentKey.MemberPrice]?: CreditsMemberPriceCopy\n      [ComponentKey.Faqs]?: CreditsFaqCopy\n    }\n  }\n  userContext: {\n    profile: any\n    removeProfile: () => void\n    isLoadingProfile: boolean\n    creditInfo: any\n    customer: any\n    customerLoading: boolean\n    fetchCreditInfo: () => void\n  }\n  registrationContext: {\n    openSignUpPopup: () => void\n    openSignInPopup: () => void\n  }\n  gtm: {\n    pageGroup: string\n    pageHandle?: string\n  }\n  cartConfig?: {\n    addToCart: (params: {\n      variantList: Array<{\n        variant: any\n        quantity: number\n        attributes?: Array<{ key: string; value: string }>\n      }>\n      cartAttributes?: Record<string, string>\n      discountCodes?: string[]\n    }) => void | Promise<any>\n  }\n}\n\nexport const CreditsTemplate = ({\n  headlessConfig,\n  siteConfig,\n  creditsConfig,\n  userContext,\n  pageConfig,\n  registrationContext,\n  gtm,\n  cartConfig,\n}: CreditsTemplateProps) => {\n  console.log('siteConfig', siteConfig)\n  return (\n    <HeadlessProvider headlessConfig={headlessConfig}>\n      <RegistrationProvider copy={siteConfig.registrationsSettings} email={userContext?.profile?.email}>\n        <CreditsProvider\n          profile={userContext?.profile}\n          removeProfile={userContext?.removeProfile}\n          isLoadingProfile={userContext?.isLoadingProfile}\n          openSignInPopup={registrationContext.openSignInPopup}\n          openSignUpPopup={registrationContext.openSignUpPopup}\n          creditInfo={userContext?.creditInfo}\n          taskIdToTypeMapping={siteConfig.taskIdToTypeMapping}\n          customer={userContext?.customer}\n          fetchCreditInfo={userContext?.fetchCreditInfo}\n          customerLoading={userContext?.customerLoading}\n          gtm={gtm}\n          pageCommon={pageConfig.common}\n          memberPriceDiscount={siteConfig.memberPriceDiscount}\n          alpcBrand={creditsConfig?.alpcBrand}\n          cartConfig={cartConfig}\n        >\n          {/* \u5BFC\u822A\u7EC4\u4EF6 - \u56FA\u5B9A\u4F4D\u7F6E\uFF0C\u4E0D\u53C2\u4E0E order \u6392\u5E8F */}\n          {pageConfig.components[ComponentKey.Navigation] && (\n            <CreditsNavigation copy={pageConfig.components[ComponentKey.Navigation]} />\n          )}\n          <div className={classNames('bg-[#f5f5f7] leading-[1.2]')}>\n            {pageConfig.order.map(key => {\n              // \u8DF3\u8FC7\u5BFC\u822A\u7EC4\u4EF6\uFF0C\u56E0\u4E3A\u5B83\u5DF2\u7ECF\u56FA\u5B9A\u6E32\u67D3\u5728\u4E0A\u65B9\n              if (key === ComponentKey.Navigation) return null\n              const componentCopy = pageConfig.components?.[key]\n              if (!componentCopy) return null\n              return (\n                <>\n                  {key === ComponentKey.Banner && <CreditsBanner copy={componentCopy as CreditsBannerCopy} id={key} />}\n                  {key === ComponentKey.InfoCard && userContext?.profile && (\n                    <CreditsInfoCard copy={componentCopy as CreditsInfoCardCopy} id={key} />\n                  )}\n                  {key === ComponentKey.Benefits && (\n                    <CreditsBenefits copy={componentCopy as CreditsBenefitsCopy} id={key} />\n                  )}\n                  {key === ComponentKey.WaysToGetCredits && (\n                    <CreditsWaysToGetCredits\n                      copy={componentCopy as CreditsWaysToGetCreditsCopy}\n                      id={key}\n                      classNames={\n                        headlessConfig.brand === 'anker'\n                          ? {\n                              subtitle: 'text-white',\n                              equalCreditsText:\n                                'bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent',\n                            }\n                          : {\n                              subtitle: 'text-[#D1D1D1]',\n                              equalCreditsText: 'text-[#F6EAD0]',\n                            }\n                      }\n                    />\n                  )}\n                  {key === ComponentKey.AnkersolixTask && (\n                    <CreditsAnkersolixTask copy={componentCopy as CreditsAnkersolixTaskCopy} id={key} />\n                  )}\n                  {key === ComponentKey.RedeemList && (\n                    <CreditsRedeemList copy={componentCopy as CreditsRedeemListCopy} id={key} />\n                  )}\n                  {key === ComponentKey.SpendCreditsLikeCash && (\n                    <CreditsCash copy={componentCopy as CreditsCashCopy} id={key} />\n                  )}\n                  {key === ComponentKey.MemberPrice && (\n                    <CreditsMemberPrice copy={componentCopy as CreditsMemberPriceCopy} id={key} />\n                  )}\n                  {key === ComponentKey.Faqs && <CreditsFaq copy={componentCopy as CreditsFaqCopy} id={key} />}\n                  {key !== ComponentKey.Banner && (\n                    <div className=\"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16\" />\n                  )}\n                </>\n              )\n            })}\n          </div>\n        </CreditsProvider>\n      </RegistrationProvider>\n    </HeadlessProvider>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "classNames", "HeadlessProvider", "RegistrationProvider", "CreditsProvider", "CreditsBanner", "CreditsInfoCard", "CreditsBenefits", "CreditsWaysToGetCredits", "CreditsAnkersolixTask", "CreditsRedeemList", "CreditsCash", "CreditsMemberPrice", "CreditsFaq", "CreditsNavigation", "ComponentKey", "CreditsTemplate", "headlessConfig", "siteConfig", "creditsConfig", "userContext", "pageConfig", "registrationContext", "gtm", "cartConfig", "key", "componentCopy"]
+}