@anker-in/campaign-ui 0.2.11-beta.30 → 0.2.11-beta.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (84) hide show
  1. package/dist/cjs/components/LiveChatWidget/LiveChatWidget.js +1 -1
  2. package/dist/cjs/components/LiveChatWidget/LiveChatWidget.js.map +3 -3
  3. package/dist/cjs/components/LiveChatWidget/components/ChatInput.js +1 -1
  4. package/dist/cjs/components/LiveChatWidget/components/ChatInput.js.map +3 -3
  5. package/dist/cjs/components/LiveChatWidget/components/ChatMessage.js +2 -2
  6. package/dist/cjs/components/LiveChatWidget/components/ChatMessage.js.map +3 -3
  7. package/dist/cjs/components/LiveChatWidget/components/ChatWindow.js +1 -1
  8. package/dist/cjs/components/LiveChatWidget/components/ChatWindow.js.map +2 -2
  9. package/dist/cjs/components/LiveChatWidget/components/MessageContent/FAQList.js +1 -1
  10. package/dist/cjs/components/LiveChatWidget/components/MessageContent/FAQList.js.map +2 -2
  11. package/dist/cjs/components/LiveChatWidget/components/MessageContent/PolicyBlock.js +1 -1
  12. package/dist/cjs/components/LiveChatWidget/components/MessageContent/PolicyBlock.js.map +2 -2
  13. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductCard.d.ts +3 -1
  14. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductCard.js +1 -1
  15. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductCard.js.map +3 -3
  16. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductComparison.d.ts +1 -0
  17. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductComparison.js +1 -1
  18. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductComparison.js.map +3 -3
  19. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductList.js +1 -1
  20. package/dist/cjs/components/LiveChatWidget/components/MessageContent/ProductList.js.map +2 -2
  21. package/dist/cjs/components/LiveChatWidget/components/MessageContent/QuickReplies.js +1 -1
  22. package/dist/cjs/components/LiveChatWidget/components/MessageContent/QuickReplies.js.map +2 -2
  23. package/dist/cjs/components/LiveChatWidget/components/MessageContent/TextBlock.js +1 -1
  24. package/dist/cjs/components/LiveChatWidget/components/MessageContent/TextBlock.js.map +2 -2
  25. package/dist/cjs/components/LiveChatWidget/constants.js +1 -1
  26. package/dist/cjs/components/LiveChatWidget/constants.js.map +2 -2
  27. package/dist/cjs/components/LiveChatWidget/hooks/useChatState.d.ts +5 -1
  28. package/dist/cjs/components/LiveChatWidget/hooks/useChatState.js +1 -1
  29. package/dist/cjs/components/LiveChatWidget/hooks/useChatState.js.map +3 -3
  30. package/dist/cjs/components/LiveChatWidget/types.d.ts +26 -0
  31. package/dist/cjs/components/LiveChatWidget/types.js.map +1 -1
  32. package/dist/cjs/stories/LiveChatWidget.stories.d.ts +8 -0
  33. package/dist/cjs/stories/LiveChatWidget.stories.js +21 -4
  34. package/dist/cjs/stories/LiveChatWidget.stories.js.map +3 -3
  35. package/dist/esm/components/LiveChatWidget/LiveChatWidget.js +1 -1
  36. package/dist/esm/components/LiveChatWidget/LiveChatWidget.js.map +3 -3
  37. package/dist/esm/components/LiveChatWidget/components/ChatInput.js +1 -1
  38. package/dist/esm/components/LiveChatWidget/components/ChatInput.js.map +3 -3
  39. package/dist/esm/components/LiveChatWidget/components/ChatMessage.js +2 -2
  40. package/dist/esm/components/LiveChatWidget/components/ChatMessage.js.map +3 -3
  41. package/dist/esm/components/LiveChatWidget/components/ChatWindow.js +1 -1
  42. package/dist/esm/components/LiveChatWidget/components/ChatWindow.js.map +2 -2
  43. package/dist/esm/components/LiveChatWidget/components/MessageContent/FAQList.js +1 -1
  44. package/dist/esm/components/LiveChatWidget/components/MessageContent/FAQList.js.map +2 -2
  45. package/dist/esm/components/LiveChatWidget/components/MessageContent/PolicyBlock.js +1 -1
  46. package/dist/esm/components/LiveChatWidget/components/MessageContent/PolicyBlock.js.map +2 -2
  47. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductCard.d.ts +3 -1
  48. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductCard.js +1 -1
  49. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductCard.js.map +3 -3
  50. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductComparison.d.ts +1 -0
  51. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductComparison.js +1 -1
  52. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductComparison.js.map +3 -3
  53. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductList.js +1 -1
  54. package/dist/esm/components/LiveChatWidget/components/MessageContent/ProductList.js.map +2 -2
  55. package/dist/esm/components/LiveChatWidget/components/MessageContent/QuickReplies.js +1 -1
  56. package/dist/esm/components/LiveChatWidget/components/MessageContent/QuickReplies.js.map +2 -2
  57. package/dist/esm/components/LiveChatWidget/components/MessageContent/TextBlock.js +1 -1
  58. package/dist/esm/components/LiveChatWidget/components/MessageContent/TextBlock.js.map +2 -2
  59. package/dist/esm/components/LiveChatWidget/constants.js +1 -1
  60. package/dist/esm/components/LiveChatWidget/constants.js.map +2 -2
  61. package/dist/esm/components/LiveChatWidget/hooks/useChatState.d.ts +5 -1
  62. package/dist/esm/components/LiveChatWidget/hooks/useChatState.js +1 -1
  63. package/dist/esm/components/LiveChatWidget/hooks/useChatState.js.map +3 -3
  64. package/dist/esm/components/LiveChatWidget/types.d.ts +26 -0
  65. package/dist/esm/stories/LiveChatWidget.stories.d.ts +8 -0
  66. package/dist/esm/stories/LiveChatWidget.stories.js +24 -7
  67. package/dist/esm/stories/LiveChatWidget.stories.js.map +3 -3
  68. package/package.json +1 -1
  69. package/src/components/LiveChatWidget/LiveChatWidget.tsx +97 -48
  70. package/src/components/LiveChatWidget/components/ChatInput.tsx +26 -1
  71. package/src/components/LiveChatWidget/components/ChatMessage.tsx +11 -4
  72. package/src/components/LiveChatWidget/components/ChatWindow.tsx +2 -0
  73. package/src/components/LiveChatWidget/components/MessageContent/FAQList.tsx +1 -1
  74. package/src/components/LiveChatWidget/components/MessageContent/PolicyBlock.tsx +1 -1
  75. package/src/components/LiveChatWidget/components/MessageContent/ProductCard.tsx +12 -4
  76. package/src/components/LiveChatWidget/components/MessageContent/ProductComparison.tsx +23 -6
  77. package/src/components/LiveChatWidget/components/MessageContent/ProductList.tsx +1 -1
  78. package/src/components/LiveChatWidget/components/MessageContent/QuickReplies.tsx +1 -1
  79. package/src/components/LiveChatWidget/components/MessageContent/TextBlock.tsx +2 -2
  80. package/src/components/LiveChatWidget/constants.ts +12 -5
  81. package/src/components/LiveChatWidget/hooks/useChatState.ts +141 -10
  82. package/src/components/LiveChatWidget/types.ts +27 -0
  83. package/src/stories/LiveChatWidget.stories.tsx +182 -0
  84. package/src/styles/livechat.css +1 -2
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/components/LiveChatWidget/types.ts"],
4
- "sourcesContent": ["/**\n * LiveChat \u7EC4\u4EF6\u6838\u5FC3\u7C7B\u578B\u5B9A\u4E49\n * \u57FA\u4E8E specs/livechat-widget/data-model.md\n */\n\n// ============================================================================\n// Session Types (\u4F1A\u8BDD)\n// ============================================================================\n\nexport type SessionStatus = 'active' | 'expired'\n\nexport interface Session {\n sessionId: string\n userId: string\n site: string\n status: SessionStatus\n createdAt?: number\n lastActivityAt?: number\n}\n\n// ============================================================================\n// Message Types (\u6D88\u606F)\n// ============================================================================\n\nexport type MessageRole = 'user' | 'assistant' | 'system' | 'tool'\n\nexport interface MessageMetadata {\n tokenUsage?: {\n inputTokens: number\n outputTokens: number\n }\n toolCalls?: Array<{\n id: string\n type: string\n name: string\n }>\n}\n\nexport interface Message {\n id: string\n sessionId?: string\n role: MessageRole\n content: MessageContent[]\n timestamp: number\n metadata?: MessageMetadata\n}\n\n// ============================================================================\n// Message Content Types (\u6D88\u606F\u5185\u5BB9)\n// ============================================================================\n\nexport type MessageContentType =\n | 'text'\n | 'product_card'\n | 'product_list'\n | 'product_comparison'\n | 'policy'\n | 'quick_replies'\n | 'thinking'\n | 'error'\n | 'faq_list'\n | 'cart'\n\nexport type MessageContent =\n | TextContent\n | ProductCardContent\n | ProductListContent\n | ProductComparisonContent\n | PolicyContent\n | QuickRepliesContent\n | ThinkingContent\n | ErrorContent\n | FAQListContent\n | PromotionListContent\n | CartContent\n\nexport interface TextContent {\n type: 'text'\n text: string\n}\n\nexport interface ProductCardContent {\n type: 'product_card'\n data: {\n product: Product\n onAddToCart?: (product: Product) => void\n }\n}\n\nexport interface ProductListContent {\n type: 'product_list'\n data: {\n products: Product[]\n title?: string\n onAddToCart?: (product: Product) => void\n commonText?: CommonText\n }\n}\n\nexport interface ProductComparisonContent {\n type: 'product_comparison'\n data: {\n products: Product[]\n dimensions: {\n price?: {\n label: string\n values: Array<{\n product_id: string\n min: number\n max: number\n currency: string\n has_discount: boolean\n }>\n }\n variants?: {\n label: string\n values: Array<{\n product_id: string\n count: number\n }>\n }\n member_price?: {\n label: string\n values: Array<{\n product_id: string\n available: boolean\n min: number\n max: number\n currency: string\n }>\n }\n discount?: {\n label: string\n values: Array<{\n product_id: string\n has_discount: boolean\n }>\n }\n [key: string]: any\n }\n onAddToCart?: (product: Product) => void\n commonText?: CommonText\n }\n}\n\nexport interface PolicyContent {\n type: 'policy'\n data: {\n title: string\n content: string\n }\n}\n\nexport interface QuickRepliesContent {\n type: 'quick_replies'\n data: {\n replies: QuickReply[]\n }\n}\n\nexport interface ThinkingContent {\n type: 'thinking'\n data: {\n status: string\n }\n}\n\nexport interface ErrorContent {\n type: 'error'\n data: {\n message: string\n code?: string\n }\n}\n\nexport interface FAQListContent {\n type: 'faq_list'\n data: {\n found: boolean\n count: number\n total?: number\n results: FAQItem[]\n }\n}\n\nexport interface PromotionListContent {\n type: 'promotion_list'\n data: {\n found: boolean\n count: number\n total?: number\n results: PromotionItem[]\n commonText?: CommonText\n }\n}\n\n// ============================================================================\n// FAQ Types (\u5E38\u89C1\u95EE\u9898)\n// ============================================================================\n\nexport type FAQCategory = 'shipping' | 'return' | 'product' | 'payment' | 'general'\n\nexport interface FAQItem {\n id: string\n question: string\n answer: string\n category: FAQCategory\n keywords?: string[]\n relatedQuestions?: string[]\n metadata?: {\n language?: string\n priority?: number\n lastUpdated?: string\n }\n}\n\n// ============================================================================\n// Promotion Types (\u4FC3\u9500\u6D3B\u52A8)\n// ============================================================================\n\nexport interface PromotionItem {\n id: string\n title: string\n subtitle?: string\n description?: string\n banner_url?: string\n url?: string\n time_range: {\n start: string\n end?: string | null\n is_active: boolean\n }\n priority?: number\n product_count?: number\n metadata?: {\n display_order?: number\n target_audience?: string\n }\n}\n\n// ============================================================================\n// Product Types (\u5546\u54C1)\n// ============================================================================\n\nexport type StockStatus = 'in_stock' | 'low_stock' | 'out_of_stock'\n\nexport interface Price {\n amount: number\n currency: string\n}\n\nexport interface PriceRange {\n min: number\n max: number\n currency: string\n}\n\nexport interface VariantDiscount {\n has_discount: boolean\n discount_price?: number\n discount_code?: string\n discount_percentage?: number\n /** \u6298\u6263\u7C7B\u578B\uFF1Afixed_amount \u56FA\u5B9A\u91D1\u989D\u6298\u6263\uFF0Cpercentage \u767E\u5206\u6BD4\u6298\u6263 */\n discount_type?: 'fixed_amount' | 'percentage'\n /** \u6298\u6263\u6570\u503C\uFF08\u53EF\u80FD\u662F\u5B57\u7B26\u4E32\u6216\u6570\u5B57\uFF09 */\n discount_value?: string | number\n}\n\nexport interface VariantMemberPrice {\n has_member_price: boolean\n price?: number\n}\n\nexport interface ProductFeatures {\n is_new?: boolean\n has_rental?: boolean\n has_presale?: boolean\n has_member_price?: boolean\n has_discount?: boolean\n}\n\nexport interface Variant {\n id: string\n title: string\n sku?: string\n price?: Price\n availableForSale: boolean\n color?: string\n discount?: VariantDiscount\n memberPrice?: VariantMemberPrice\n inventoryQuantity?: number\n option1?: string\n option2?: string\n option3?: string\n}\n\nexport interface Product {\n shopifyId: string\n sku?: string\n handle: string\n title: string\n description?: string\n vendor?: string\n price: Price\n priceRange?: PriceRange\n memberPriceRange?: PriceRange\n imageUrl: string\n productUrl: string\n stockStatus: StockStatus\n hotScore?: number\n averageRating?: number\n reviewCount?: number\n variants?: Variant[]\n variantCount?: number\n availableCount?: number\n features?: ProductFeatures\n tags?: string[]\n}\n\n// ============================================================================\n// Quick Reply Types (\u5FEB\u6377\u56DE\u590D)\n// ============================================================================\n\nexport interface QuickReply {\n id: string\n label: string\n value: string\n icon?: string\n}\n\n// ============================================================================\n// Policy Types (\u653F\u7B56)\n// ============================================================================\n\nexport interface Policy {\n title: string\n content: string\n}\n\n// ============================================================================\n// Cart Types (\u8D2D\u7269\u8F66)\n// ============================================================================\n\n/**\n * \u8D2D\u7269\u8F66\u91D1\u989D\u4FE1\u606F\n */\nexport interface CartAmount {\n /** \u91D1\u989D\u5B57\u7B26\u4E32\uFF08\u5982 \"99.99\"\uFF09 */\n amount: string\n /** \u8D27\u5E01\u4EE3\u7801\uFF08\u5982 \"USD\"\uFF09 */\n currencyCode: string\n}\n\n/**\n * \u8D2D\u7269\u8F66\u4EF7\u683C\u6C47\u603B\n */\nexport interface CartCost {\n /** \u5E94\u4ED8\u603B\u4EF7\uFF08\u5DF2\u5E94\u7528\u6298\u6263\uFF09 */\n totalAmount: CartAmount\n /** \u539F\u4EF7\u5C0F\u8BA1\uFF08\u672A\u5E94\u7528\u6298\u6263\uFF09 */\n subtotalAmount: CartAmount\n}\n\n/**\n * \u8D2D\u7269\u8F66\u5546\u54C1\u53D8\u4F53\u4FE1\u606F\n */\nexport interface CartMerchandise {\n /** \u53D8\u4F53 ID (Shopify ProductVariant GID) */\n id: string\n /** \u53D8\u4F53\u6807\u9898\uFF08\u5982 \"Black\", \"Large\" \u7B49\uFF09 */\n title: string\n /** \u5355\u4EF7 */\n price: CartAmount\n /** \u5546\u54C1\u56FE\u7247 URL */\n image?: {\n url: string\n altText?: string\n }\n /** \u5173\u8054\u7684\u5546\u54C1\u4FE1\u606F */\n product: {\n /** \u5546\u54C1 ID */\n id: string\n /** \u5546\u54C1\u6807\u9898 */\n title: string\n /** \u5546\u54C1 handle */\n handle: string\n }\n}\n\n/**\n * \u8D2D\u7269\u8F66\u5546\u54C1\u884C\n */\nexport interface CartLine {\n /** \u8D2D\u7269\u8F66\u884C ID (\u7528\u4E8E\u66F4\u65B0/\u5220\u9664\u64CD\u4F5C) */\n id: string\n /** \u5546\u54C1\u6570\u91CF */\n quantity: number\n /** \u4EF7\u683C\u4FE1\u606F */\n cost: {\n /** \u884C\u603B\u4EF7\uFF08\u5355\u4EF7 \u00D7 \u6570\u91CF\uFF0C\u5DF2\u5E94\u7528\u6298\u6263\uFF09 */\n totalAmount: CartAmount\n /** \u5355\u4EF7 */\n amountPerQuantity: CartAmount\n /** \u884C\u5C0F\u8BA1\uFF08\u5355\u4EF7 \u00D7 \u6570\u91CF\uFF0C\u672A\u5E94\u7528\u6298\u6263\uFF09 */\n subtotalAmount: CartAmount\n }\n /** \u5546\u54C1\u53D8\u4F53\u4FE1\u606F */\n merchandise: CartMerchandise\n /** \u81EA\u5B9A\u4E49\u5C5E\u6027\uFF08\u53EF\u9009\uFF09 */\n attributes?: Array<{\n key: string\n value: string\n }>\n}\n\n/**\n * \u8D2D\u7269\u8F66\u6298\u6263\u7801\n */\nexport interface CartDiscountCode {\n /** \u6298\u6263\u7801 */\n code: string\n /** \u662F\u5426\u6709\u6548/\u9002\u7528 */\n applicable: boolean\n}\n\n/**\n * \u8D2D\u7269\u8F66\u6570\u636E\n */\nexport interface CartData {\n /** \u8D2D\u7269\u8F66\u662F\u5426\u4E3A\u7A7A */\n isEmpty: boolean\n /** \u8D2D\u7269\u8F66 ID (Shopify Cart GID) */\n cartId: string\n /** \u5546\u54C1\u603B\u6570\u91CF */\n totalQuantity: number\n /** \u5546\u54C1\u5217\u8868 */\n lines: CartLine[]\n /** \u4EF7\u683C\u6C47\u603B */\n cost: CartCost\n /** \u6298\u6263\u7801\u5217\u8868 */\n discountCodes?: CartDiscountCode[]\n /** \u7ED3\u8D26\u9875\u9762 URL */\n checkoutUrl?: string\n /** \u8D2D\u7269\u8F66\u6309\u94AE\u56DE\u8C03\u51FD\u6570 */\n onCart?: (cartId: string, checkoutUrl?: string) => void\n /** \u901A\u7528\u6587\u6848\u914D\u7F6E */\n commonText?: CommonText\n}\n\n/**\n * \u8D2D\u7269\u8F66\u5185\u5BB9\u5757\n */\nexport interface CartContent {\n type: 'cart'\n data: CartData\n}\n\n// ============================================================================\n// Backend Cart Types (\u540E\u7AEF\u8D2D\u7269\u8F66\u6570\u636E\u683C\u5F0F - Shopify GraphQL)\n// ============================================================================\n\n/**\n * \u540E\u7AEF\u8FD4\u56DE\u7684\u8D2D\u7269\u8F66\u5546\u54C1\u884C\u6570\u636E (Shopify GraphQL \u683C\u5F0F)\n */\nexport interface BackendCartLineNode {\n id: string\n quantity: number\n cost: {\n totalAmount: CartAmount\n amountPerQuantity: CartAmount\n compareAtAmountPerQuantity?: CartAmount | null\n subtotalAmount: CartAmount\n }\n discountAllocations: any[]\n merchandise: {\n id: string\n title: string\n availableForSale: boolean\n quantityAvailable?: number\n price: CartAmount\n compareAtPrice?: CartAmount | null\n image?: {\n url: string\n altText?: string | null\n width?: number\n height?: number\n } | null\n product: {\n id: string\n title: string\n handle: string\n vendor?: string\n featuredImage?: {\n url: string\n altText?: string | null\n width?: number\n height?: number\n } | null\n tags?: string[]\n }\n }\n attributes?: Array<{\n key: string\n value: string\n }>\n}\n\n/**\n * \u540E\u7AEF\u8FD4\u56DE\u7684\u8D2D\u7269\u8F66\u6570\u636E (Shopify GraphQL \u683C\u5F0F)\n */\nexport interface BackendCartData {\n id: string\n checkoutUrl?: string\n totalQuantity: number\n lines: {\n edges: Array<{\n node: BackendCartLineNode\n }>\n }\n cost: {\n totalAmount: CartAmount\n subtotalAmount: CartAmount\n checkoutChargeAmount?: CartAmount\n totalAmountEstimated?: boolean\n subtotalAmountEstimated?: boolean\n totalTaxAmount?: CartAmount | null\n totalDutyAmount?: CartAmount | null\n }\n discountAllocations?: any[]\n buyerIdentity?: any\n attributes?: Array<{\n key: string\n value: string\n }>\n discountCodes?: any[]\n createdAt?: string\n updatedAt?: string\n}\n\n// ============================================================================\n// SSE Event Types (SSE \u4E8B\u4EF6)\n// ============================================================================\n\nexport type SSEEventType =\n | 'message_start'\n | 'content_delta'\n | 'content_block'\n | 'message_end'\n | 'tool_start'\n | 'tool_end'\n | 'status'\n | 'error'\n | 'done'\n\nexport interface SSEEvent<T = any> {\n event: SSEEventType | null\n data: T\n}\n\n// \u5177\u4F53\u4E8B\u4EF6\u6570\u636E\u7C7B\u578B\nexport interface MessageStartData {\n sessionId: string\n}\n\nexport interface ContentDeltaData {\n text: string\n}\n\nexport interface ContentBlockData {\n type: string\n data: any\n}\n\nexport interface MessageEndData {\n usage: {\n inputTokens: number\n outputTokens: number\n }\n}\n\nexport interface ToolStartData {\n id: string\n type: string\n name: string\n}\n\nexport interface ToolEndData {\n id: string\n}\n\nexport interface StatusData {\n type: string\n message?: string\n}\n\nexport interface ErrorData {\n message: string\n code?: string\n}\n\n// ============================================================================\n// API Request/Response Types (API \u8BF7\u6C42\u54CD\u5E94)\n// ============================================================================\n\n/**\n * \u6D41\u5F0F\u5BF9\u8BDD\u8BF7\u6C42\u53C2\u6570\n */\nexport interface ChatStreamRequest {\n /** \u7528\u6237\u7684\u6D88\u606F\u6587\u672C */\n message: string\n /** \u7528\u6237\u6807\u8BC6\u7B26 */\n user_id: string\n /** \u6765\u81EA new-session \u7AEF\u70B9\u7684\u4F1A\u8BDD ID */\n session_id: string\n /** \u53EF\u9009\u7684\u4E0A\u4E0B\u6587\u4FE1\u606F */\n context?: {\n /** \u7528\u4E8E\u8D2D\u7269\u8F66\u64CD\u4F5C\u7684 Shopify \u8D2D\u7269\u8F66 ID */\n cartId?: string\n /** Storefront API \u8BBF\u95EE\u4EE4\u724C */\n accessToken?: string\n /** \u5DF2\u767B\u5F55\u7528\u6237\u7684 ID */\n real_user_id?: string\n }\n}\n\nexport interface NewSessionRequest {\n user_id: string\n session_id?: string\n site?: string\n channel_code?: string\n real_user_id?: string\n}\n\nexport interface NewSessionResponse {\n success: boolean\n sessionId: string\n message: string\n resumed?: boolean\n messages?: Message[]\n welcomeMessage?: string\n quickQuestions?: string[]\n brand?: string\n}\n\nexport interface ErrorResponse {\n success: boolean\n error: string\n code?: string\n details?: any\n}\n\n// ============================================================================\n// Common Text Types (\u901A\u7528\u6587\u6848)\n// ============================================================================\n\n/**\n * \u901A\u7528\u6587\u6848\u914D\u7F6E\n * \u7528\u4E8E\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u4E2D\u7684\u6309\u94AE\u6587\u6848\n */\nexport interface CommonText {\n /**\n * \u4EA7\u54C1\u5217\u8868\u5C55\u5F00\u6309\u94AE\u6587\u6848\n * @default \"Learn More\"\n */\n learnMore?: string\n\n /**\n * \u4EA7\u54C1\u5217\u8868\u6536\u8D77\u6309\u94AE\u6587\u6848\n * @default \"Show Less\"\n */\n showLess?: string\n\n /**\n * \u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\u6309\u94AE\u6587\u6848\n * @default \"Add to Cart\"\n */\n addToCart?: string\n\n /**\n * \u67E5\u770B\u8D2D\u7269\u8F66/\u66F4\u591A\u6309\u94AE\u6587\u6848\n * @default \"View More\"\n */\n viewMore?: string\n\n /**\n * \u6298\u6263\u6807\u7B7E\u540E\u7F00\u6587\u6848\uFF08\u5982 \"20% OFF\" \u4E2D\u7684 \"OFF\"\uFF09\n * @default \"OFF\"\n */\n off?: string\n\n /**\n * \u8D2D\u7269\u8F66\u603B\u8BA1\u6587\u6848\n * @default \"Total\"\n */\n total?: string\n}\n\n// ============================================================================\n// Component Props Types (\u7EC4\u4EF6 Props)\n// ============================================================================\n\nexport interface LiveChatWidgetProps {\n /**\n * API \u57FA\u7840 URL\n * @example \"https://beta-api-livechat.anker.com\"\n */\n apiBaseUrl: string\n\n /**\n * \u81EA\u5B9A\u4E49\u8BF7\u6C42\u5934\n * \u5C06\u5728\u6240\u6709 API \u8BF7\u6C42\u4E2D\u6DFB\u52A0\u8FD9\u4E9B\u8BF7\u6C42\u5934\n * @example { \"Authorization\": \"Bearer token\", \"X-Custom-Header\": \"value\" }\n */\n headers?: Record<string, string>\n\n /**\n * reCAPTCHA site key\n * \u63D0\u4F9B\u6B64\u53C2\u6570\u5C06\u81EA\u52A8\u542F\u7528 reCAPTCHA v3 \u9A8C\u8BC1\n * @example \"6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14\"\n */\n recaptchaSitekey?: string\n\n /**\n * reCAPTCHA action \u524D\u7F00\n * \u5B9E\u9645\u4F7F\u7528\u65F6\u4F1A\u6839\u636E\u4E0D\u540C\u63A5\u53E3\u6DFB\u52A0\u540E\u7F00\uFF08\u5982 chat_stream, new_session\uFF09\n * @default \"livechat\"\n */\n recaptchaAction?: string\n\n /**\n * Shopify \u5E97\u94FA\u57DF\u540D\n * @example \"www.eufy.com\"\n */\n site?: string\n\n /**\n * \u6E20\u9053\u7F16\u7801\n * \u7528\u4E8E\u6807\u8BC6\u6765\u6E90\u6E20\u9053\n * @example \"web_homepage\"\n */\n channelCode?: string\n\n /**\n * \u5DF2\u767B\u5F55\u7528\u6237\u7684 ID\uFF08\u53EF\u9009\uFF09\n * \u5982\u679C\u63D0\u4F9B\uFF0C\u5C06\u5728 API \u8BF7\u6C42\u4E2D\u4F20\u9012\n */\n loginUserId?: string\n\n /**\n * Shopify \u8D2D\u7269\u8F66 ID\uFF08\u53EF\u9009\uFF09\n * \u7528\u4E8E\u8D2D\u7269\u8F66\u64CD\u4F5C\uFF0C\u5C06\u5728 stream \u63A5\u53E3\u7684 context \u4E2D\u4F20\u9012\n * @example \"gid://shopify/Cart/Z2NwLXVzLWVhc3QxOjAxSkZH...\"\n */\n cartId?: string\n\n /**\n * Storefront API \u8BBF\u95EE\u4EE4\u724C\uFF08\u53EF\u9009\uFF09\n * \u7528\u4E8E\u8D2D\u7269\u8F66\u64CD\u4F5C\uFF0C\u5C06\u5728 stream \u63A5\u53E3\u7684 context \u4E2D\u4F20\u9012\n */\n accessToken?: string\n\n /**\n * \u6C14\u6CE1\u6309\u94AE\u4F4D\u7F6E\n * \u81EA\u5B9A\u4E49\u4F4D\u7F6E\u5BF9\u8C61\uFF1A{ top?: string, bottom?: string, left?: string, right?: string }\n * @default { bottom: \"1.5rem\", right: \"1.5rem\" }\n * @example\n * // \u81EA\u5B9A\u4E49\u4F4D\u7F6E\n * position={{ bottom: \"20px\", right: \"30px\" }}\n * position={{ top: \"100px\", left: \"50px\" }}\n */\n position?: BubblePosition\n\n /**\n * \u6B22\u8FCE\u6D88\u606F\n * @default \"\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u52A9\u4F60\u7684\u5417\uFF1F\"\n */\n welcomeMessage?: string\n\n /**\n * \u521D\u59CB\u5FEB\u6377\u56DE\u590D\u6309\u94AE\n */\n quickReplies?: QuickReply[]\n\n /**\n * \u81EA\u5B9A\u4E49\u6D88\u606F\u6E32\u67D3\u5668\n */\n customRenderers?: Record<string, MessageRenderer>\n\n /**\n * Logo URL\n */\n logoUrl?: string\n\n /**\n * \u804A\u5929\u7A97\u53E3\u6807\u9898\n * @default \"AI \u52A9\u624B\"\n */\n title?: string\n\n /**\n * \u804A\u5929\u6C14\u6CE1\u6309\u94AE\u56FE\u6807\uFF08\u56FE\u7247 URL\uFF09\n * \u5982\u679C\u63D0\u4F9B\uFF0C\u5C06\u4F7F\u7528\u56FE\u7247\u66FF\u4EE3\u9ED8\u8BA4\u7684 SVG \u56FE\u6807\n */\n chatBubbleIcon?: string\n\n /**\n * \u53D7\u63A7\u6A21\u5F0F\uFF1A\u662F\u5426\u6253\u5F00\u804A\u5929\u7A97\u53E3\n * \u63D0\u4F9B\u6B64\u53C2\u6570\u65F6\uFF0C\u7EC4\u4EF6\u5C06\u5904\u4E8E\u53D7\u63A7\u6A21\u5F0F\n * @example\n * ```tsx\n * const [isOpen, setIsOpen] = useState(false)\n * <LiveChatWidget open={isOpen} onOpenChange={setIsOpen} />\n * ```\n */\n open?: boolean\n\n /**\n * \u53D7\u63A7\u6A21\u5F0F\uFF1A\u6253\u5F00/\u5173\u95ED\u72B6\u6001\u53D8\u5316\u56DE\u8C03\n * \u3010\u5FC5\u9700\u3011\u914D\u5408 `open` \u4F7F\u7528\uFF0C\u7528\u4E8E\u540C\u6B65\u72B6\u6001\u5230\u7236\u7EC4\u4EF6\n * \u5F53\u7528\u6237\u70B9\u51FB\u6253\u5F00\u6216\u5173\u95ED\u6309\u94AE\u65F6\u89E6\u53D1\n * @example\n * ```tsx\n * <LiveChatWidget\n * open={isOpen}\n * onOpenChange={setIsOpen} // \u5FC5\u9700\uFF1A\u540C\u6B65\u72B6\u6001\n * />\n * ```\n */\n onOpenChange?: (open: boolean) => void\n\n /**\n * \u3010\u53EF\u9009\u3011\u7A97\u53E3\u6253\u5F00\u4E8B\u4EF6\u76D1\u542C\n * \u7528\u4E8E\u57CB\u70B9\u3001\u65E5\u5FD7\u7B49\u526F\u4F5C\u7528\uFF0C\u4E0D\u5F71\u54CD\u72B6\u6001\u63A7\u5236\n * \u5728 onOpenChange \u4E4B\u540E\u89E6\u53D1\n * @example\n * ```tsx\n * <LiveChatWidget\n * open={isOpen}\n * onOpenChange={setIsOpen}\n * onOpen={() => trackEvent('chat_opened')} // \u53EF\u9009\uFF1A\u57CB\u70B9\n * />\n * ```\n */\n onOpen?: () => void\n\n /**\n * \u3010\u53EF\u9009\u3011\u7A97\u53E3\u5173\u95ED\u4E8B\u4EF6\u76D1\u542C\n * \u7528\u4E8E\u57CB\u70B9\u3001\u65E5\u5FD7\u7B49\u526F\u4F5C\u7528\uFF0C\u4E0D\u5F71\u54CD\u72B6\u6001\u63A7\u5236\n * \u5728 onOpenChange \u4E4B\u540E\u89E6\u53D1\n * @example\n * ```tsx\n * <LiveChatWidget\n * open={isOpen}\n * onOpenChange={setIsOpen}\n * onClose={() => trackEvent('chat_closed')} // \u53EF\u9009\uFF1A\u57CB\u70B9\n * />\n * ```\n */\n onClose?: () => void\n onMessageSend?: (message: string) => void\n onError?: (error: Error) => void\n\n /**\n * AI \u6D88\u606F\u56DE\u8C03\n */\n /**\n * AI \u56DE\u590D\u6587\u672C\u6D88\u606F\u65F6\u89E6\u53D1\n */\n onTextMessage?: () => void\n\n /**\n * AI \u56DE\u590D\u5546\u54C1\u5217\u8868\u5361\u7247\u65F6\u89E6\u53D1\n */\n onProductList?: () => void\n\n /**\n * AI \u56DE\u590D\u4FC3\u9500\u5361\u7247\u65F6\u89E6\u53D1\n */\n onPromotionList?: () => void\n\n /**\n * \u5546\u54C1\u64CD\u4F5C\u56DE\u8C03\n */\n onAddToCart?: (product: Product) => void\n\n /**\n * \u8D2D\u7269\u8F66\u6309\u94AE\u70B9\u51FB\u56DE\u8C03\n */\n onCart?: (cartId: string, checkoutUrl?: string) => void\n\n /**\n * \u662F\u5426\u663E\u793A\u65B0\u4F1A\u8BDD\u6309\u94AE\n * @default true\n */\n showNewSessionButton?: boolean\n\n /**\n * \u901A\u7528\u6587\u6848\u914D\u7F6E\n * \u7528\u4E8E\u81EA\u5B9A\u4E49\u6309\u94AE\u6587\u6848\n */\n commonText?: CommonText\n}\n\nexport interface MessageRenderer {\n render: (content: MessageContent, isUser: boolean, isSystem: boolean) => React.ReactNode\n}\n\nexport interface CustomRendererMap {\n [type: string]: MessageRenderer\n}\n\n// ============================================================================\n// Utility Types (\u5DE5\u5177\u7C7B\u578B)\n// ============================================================================\n\nexport interface PositionStyles {\n bottom?: string\n top?: string\n left?: string\n right?: string\n}\n\nexport type BubblePosition = PositionStyles\n"],
4
+ "sourcesContent": ["/**\n * LiveChat \u7EC4\u4EF6\u6838\u5FC3\u7C7B\u578B\u5B9A\u4E49\n * \u57FA\u4E8E specs/livechat-widget/data-model.md\n */\n\n// ============================================================================\n// Session Types (\u4F1A\u8BDD)\n// ============================================================================\n\nexport type SessionStatus = 'active' | 'expired'\n\nexport interface Session {\n sessionId: string\n userId: string\n site: string\n status: SessionStatus\n createdAt?: number\n lastActivityAt?: number\n}\n\n// ============================================================================\n// Message Types (\u6D88\u606F)\n// ============================================================================\n\nexport type MessageRole = 'user' | 'assistant' | 'system' | 'tool'\n\nexport interface MessageMetadata {\n tokenUsage?: {\n inputTokens: number\n outputTokens: number\n }\n toolCalls?: Array<{\n id: string\n type: string\n name: string\n }>\n}\n\nexport interface Message {\n id: string\n sessionId?: string\n role: MessageRole\n content: MessageContent[]\n timestamp: number\n metadata?: MessageMetadata\n structured_content?: Array<{\n type: string\n data: any\n }>\n}\n\n// ============================================================================\n// Message Content Types (\u6D88\u606F\u5185\u5BB9)\n// ============================================================================\n\nexport type MessageContentType =\n | 'text'\n | 'product_card'\n | 'product_list'\n | 'product_comparison'\n | 'policy'\n | 'quick_replies'\n | 'thinking'\n | 'error'\n | 'faq_list'\n | 'cart'\n\nexport type MessageContent =\n | TextContent\n | ProductCardContent\n | ProductListContent\n | ProductComparisonContent\n | PolicyContent\n | QuickRepliesContent\n | ThinkingContent\n | ErrorContent\n | FAQListContent\n | PromotionListContent\n | CartContent\n\nexport interface TextContent {\n type: 'text'\n text: string\n}\n\nexport interface ProductCardContent {\n type: 'product_card'\n data: {\n product: Product\n rawProduct?: any // Raw backend product data (for custom render)\n onAddToCart?: (product: Product) => void\n productCardRender?: (product: any) => React.ReactNode\n }\n}\n\nexport interface ProductListContent {\n type: 'product_list'\n data: {\n products: Product[]\n title?: string\n onAddToCart?: (product: Product) => void\n commonText?: CommonText\n }\n}\n\nexport interface ProductComparisonContent {\n type: 'product_comparison'\n data: {\n products: Product[]\n dimensions: {\n price?: {\n label: string\n values: Array<{\n product_id: string\n min: number\n max: number\n currency: string\n has_discount: boolean\n }>\n }\n variants?: {\n label: string\n values: Array<{\n product_id: string\n count: number\n }>\n }\n member_price?: {\n label: string\n values: Array<{\n product_id: string\n available: boolean\n min: number\n max: number\n currency: string\n }>\n }\n discount?: {\n label: string\n values: Array<{\n product_id: string\n has_discount: boolean\n }>\n }\n [key: string]: any\n }\n onAddToCart?: (product: Product) => void\n commonText?: CommonText\n }\n}\n\nexport interface PolicyContent {\n type: 'policy'\n data: {\n title: string\n content: string\n }\n}\n\nexport interface QuickRepliesContent {\n type: 'quick_replies'\n data: {\n replies: QuickReply[]\n }\n}\n\nexport interface ThinkingContent {\n type: 'thinking'\n data: {\n status: string\n }\n}\n\nexport interface ErrorContent {\n type: 'error'\n data: {\n message: string\n code?: string\n }\n}\n\nexport interface FAQListContent {\n type: 'faq_list'\n data: {\n found: boolean\n count: number\n total?: number\n results: FAQItem[]\n }\n}\n\nexport interface PromotionListContent {\n type: 'promotion_list'\n data: {\n found: boolean\n count: number\n total?: number\n results: PromotionItem[]\n commonText?: CommonText\n }\n}\n\n// ============================================================================\n// FAQ Types (\u5E38\u89C1\u95EE\u9898)\n// ============================================================================\n\nexport type FAQCategory = 'shipping' | 'return' | 'product' | 'payment' | 'general'\n\nexport interface FAQItem {\n id: string\n question: string\n answer: string\n category: FAQCategory\n keywords?: string[]\n relatedQuestions?: string[]\n metadata?: {\n language?: string\n priority?: number\n lastUpdated?: string\n }\n}\n\n// ============================================================================\n// Promotion Types (\u4FC3\u9500\u6D3B\u52A8)\n// ============================================================================\n\nexport interface PromotionItem {\n id: string\n title: string\n subtitle?: string\n description?: string\n banner_url?: string\n url?: string\n time_range: {\n start: string\n end?: string | null\n is_active: boolean\n }\n priority?: number\n product_count?: number\n metadata?: {\n display_order?: number\n target_audience?: string\n }\n}\n\n// ============================================================================\n// Product Types (\u5546\u54C1)\n// ============================================================================\n\nexport type StockStatus = 'in_stock' | 'low_stock' | 'out_of_stock'\n\nexport interface Price {\n amount: number\n currency: string\n}\n\nexport interface PriceRange {\n min: number\n max: number\n currency: string\n}\n\nexport interface VariantDiscount {\n has_discount: boolean\n discount_price?: number\n discount_code?: string\n discount_percentage?: number\n /** \u6298\u6263\u7C7B\u578B\uFF1Afixed_amount \u56FA\u5B9A\u91D1\u989D\u6298\u6263\uFF0Cpercentage \u767E\u5206\u6BD4\u6298\u6263 */\n discount_type?: 'fixed_amount' | 'percentage'\n /** \u6298\u6263\u6570\u503C\uFF08\u53EF\u80FD\u662F\u5B57\u7B26\u4E32\u6216\u6570\u5B57\uFF09 */\n discount_value?: string | number\n}\n\nexport interface VariantMemberPrice {\n has_member_price: boolean\n price?: number\n}\n\nexport interface ProductFeatures {\n is_new?: boolean\n has_rental?: boolean\n has_presale?: boolean\n has_member_price?: boolean\n has_discount?: boolean\n}\n\nexport interface Variant {\n id: string\n title: string\n sku?: string\n price?: Price\n availableForSale: boolean\n color?: string\n discount?: VariantDiscount\n memberPrice?: VariantMemberPrice\n inventoryQuantity?: number\n option1?: string\n option2?: string\n option3?: string\n}\n\nexport interface Product {\n shopifyId: string\n sku?: string\n handle: string\n title: string\n description?: string\n vendor?: string\n price: Price\n priceRange?: PriceRange\n memberPriceRange?: PriceRange\n imageUrl: string\n productUrl: string\n stockStatus: StockStatus\n hotScore?: number\n averageRating?: number\n reviewCount?: number\n variants?: Variant[]\n variantCount?: number\n availableCount?: number\n features?: ProductFeatures\n tags?: string[]\n}\n\n// ============================================================================\n// Quick Reply Types (\u5FEB\u6377\u56DE\u590D)\n// ============================================================================\n\nexport interface QuickReply {\n id: string\n label: string\n value: string\n icon?: string\n}\n\n// ============================================================================\n// Policy Types (\u653F\u7B56)\n// ============================================================================\n\nexport interface Policy {\n title: string\n content: string\n}\n\n// ============================================================================\n// Cart Types (\u8D2D\u7269\u8F66)\n// ============================================================================\n\n/**\n * \u8D2D\u7269\u8F66\u91D1\u989D\u4FE1\u606F\n */\nexport interface CartAmount {\n /** \u91D1\u989D\u5B57\u7B26\u4E32\uFF08\u5982 \"99.99\"\uFF09 */\n amount: string\n /** \u8D27\u5E01\u4EE3\u7801\uFF08\u5982 \"USD\"\uFF09 */\n currencyCode: string\n}\n\n/**\n * \u8D2D\u7269\u8F66\u4EF7\u683C\u6C47\u603B\n */\nexport interface CartCost {\n /** \u5E94\u4ED8\u603B\u4EF7\uFF08\u5DF2\u5E94\u7528\u6298\u6263\uFF09 */\n totalAmount: CartAmount\n /** \u539F\u4EF7\u5C0F\u8BA1\uFF08\u672A\u5E94\u7528\u6298\u6263\uFF09 */\n subtotalAmount: CartAmount\n}\n\n/**\n * \u8D2D\u7269\u8F66\u5546\u54C1\u53D8\u4F53\u4FE1\u606F\n */\nexport interface CartMerchandise {\n /** \u53D8\u4F53 ID (Shopify ProductVariant GID) */\n id: string\n /** \u53D8\u4F53\u6807\u9898\uFF08\u5982 \"Black\", \"Large\" \u7B49\uFF09 */\n title: string\n /** \u5355\u4EF7 */\n price: CartAmount\n /** \u5546\u54C1\u56FE\u7247 URL */\n image?: {\n url: string\n altText?: string\n }\n /** \u5173\u8054\u7684\u5546\u54C1\u4FE1\u606F */\n product: {\n /** \u5546\u54C1 ID */\n id: string\n /** \u5546\u54C1\u6807\u9898 */\n title: string\n /** \u5546\u54C1 handle */\n handle: string\n }\n}\n\n/**\n * \u8D2D\u7269\u8F66\u5546\u54C1\u884C\n */\nexport interface CartLine {\n /** \u8D2D\u7269\u8F66\u884C ID (\u7528\u4E8E\u66F4\u65B0/\u5220\u9664\u64CD\u4F5C) */\n id: string\n /** \u5546\u54C1\u6570\u91CF */\n quantity: number\n /** \u4EF7\u683C\u4FE1\u606F */\n cost: {\n /** \u884C\u603B\u4EF7\uFF08\u5355\u4EF7 \u00D7 \u6570\u91CF\uFF0C\u5DF2\u5E94\u7528\u6298\u6263\uFF09 */\n totalAmount: CartAmount\n /** \u5355\u4EF7 */\n amountPerQuantity: CartAmount\n /** \u884C\u5C0F\u8BA1\uFF08\u5355\u4EF7 \u00D7 \u6570\u91CF\uFF0C\u672A\u5E94\u7528\u6298\u6263\uFF09 */\n subtotalAmount: CartAmount\n }\n /** \u5546\u54C1\u53D8\u4F53\u4FE1\u606F */\n merchandise: CartMerchandise\n /** \u81EA\u5B9A\u4E49\u5C5E\u6027\uFF08\u53EF\u9009\uFF09 */\n attributes?: Array<{\n key: string\n value: string\n }>\n}\n\n/**\n * \u8D2D\u7269\u8F66\u6298\u6263\u7801\n */\nexport interface CartDiscountCode {\n /** \u6298\u6263\u7801 */\n code: string\n /** \u662F\u5426\u6709\u6548/\u9002\u7528 */\n applicable: boolean\n}\n\n/**\n * \u8D2D\u7269\u8F66\u6570\u636E\n */\nexport interface CartData {\n /** \u8D2D\u7269\u8F66\u662F\u5426\u4E3A\u7A7A */\n isEmpty: boolean\n /** \u8D2D\u7269\u8F66 ID (Shopify Cart GID) */\n cartId: string\n /** \u5546\u54C1\u603B\u6570\u91CF */\n totalQuantity: number\n /** \u5546\u54C1\u5217\u8868 */\n lines: CartLine[]\n /** \u4EF7\u683C\u6C47\u603B */\n cost: CartCost\n /** \u6298\u6263\u7801\u5217\u8868 */\n discountCodes?: CartDiscountCode[]\n /** \u7ED3\u8D26\u9875\u9762 URL */\n checkoutUrl?: string\n /** \u8D2D\u7269\u8F66\u6309\u94AE\u56DE\u8C03\u51FD\u6570 */\n onCart?: (cartId: string, checkoutUrl?: string) => void\n /** \u901A\u7528\u6587\u6848\u914D\u7F6E */\n commonText?: CommonText\n}\n\n/**\n * \u8D2D\u7269\u8F66\u5185\u5BB9\u5757\n */\nexport interface CartContent {\n type: 'cart'\n data: CartData\n}\n\n// ============================================================================\n// Backend Cart Types (\u540E\u7AEF\u8D2D\u7269\u8F66\u6570\u636E\u683C\u5F0F - Shopify GraphQL)\n// ============================================================================\n\n/**\n * \u540E\u7AEF\u8FD4\u56DE\u7684\u8D2D\u7269\u8F66\u5546\u54C1\u884C\u6570\u636E (Shopify GraphQL \u683C\u5F0F)\n */\nexport interface BackendCartLineNode {\n id: string\n quantity: number\n cost: {\n totalAmount: CartAmount\n amountPerQuantity: CartAmount\n compareAtAmountPerQuantity?: CartAmount | null\n subtotalAmount: CartAmount\n }\n discountAllocations: any[]\n merchandise: {\n id: string\n title: string\n availableForSale: boolean\n quantityAvailable?: number\n price: CartAmount\n compareAtPrice?: CartAmount | null\n image?: {\n url: string\n altText?: string | null\n width?: number\n height?: number\n } | null\n product: {\n id: string\n title: string\n handle: string\n vendor?: string\n featuredImage?: {\n url: string\n altText?: string | null\n width?: number\n height?: number\n } | null\n tags?: string[]\n }\n }\n attributes?: Array<{\n key: string\n value: string\n }>\n}\n\n/**\n * \u540E\u7AEF\u8FD4\u56DE\u7684\u8D2D\u7269\u8F66\u6570\u636E (Shopify GraphQL \u683C\u5F0F)\n */\nexport interface BackendCartData {\n id: string\n checkoutUrl?: string\n totalQuantity: number\n lines: {\n edges: Array<{\n node: BackendCartLineNode\n }>\n }\n cost: {\n totalAmount: CartAmount\n subtotalAmount: CartAmount\n checkoutChargeAmount?: CartAmount\n totalAmountEstimated?: boolean\n subtotalAmountEstimated?: boolean\n totalTaxAmount?: CartAmount | null\n totalDutyAmount?: CartAmount | null\n }\n discountAllocations?: any[]\n buyerIdentity?: any\n attributes?: Array<{\n key: string\n value: string\n }>\n discountCodes?: any[]\n createdAt?: string\n updatedAt?: string\n}\n\n// ============================================================================\n// SSE Event Types (SSE \u4E8B\u4EF6)\n// ============================================================================\n\nexport type SSEEventType =\n | 'message_start'\n | 'content_delta'\n | 'content_block'\n | 'message_end'\n | 'tool_start'\n | 'tool_end'\n | 'status'\n | 'error'\n | 'done'\n\nexport interface SSEEvent<T = any> {\n event: SSEEventType | null\n data: T\n}\n\n// \u5177\u4F53\u4E8B\u4EF6\u6570\u636E\u7C7B\u578B\nexport interface MessageStartData {\n sessionId: string\n}\n\nexport interface ContentDeltaData {\n text: string\n}\n\nexport interface ContentBlockData {\n type: string\n data: any\n}\n\nexport interface MessageEndData {\n usage: {\n inputTokens: number\n outputTokens: number\n }\n}\n\nexport interface ToolStartData {\n id: string\n type: string\n name: string\n}\n\nexport interface ToolEndData {\n id: string\n}\n\nexport interface StatusData {\n type: string\n message?: string\n}\n\nexport interface ErrorData {\n message: string\n code?: string\n type?: string\n}\n\n// ============================================================================\n// API Request/Response Types (API \u8BF7\u6C42\u54CD\u5E94)\n// ============================================================================\n\n/**\n * \u6D41\u5F0F\u5BF9\u8BDD\u8BF7\u6C42\u53C2\u6570\n */\nexport interface ChatStreamRequest {\n /** \u7528\u6237\u7684\u6D88\u606F\u6587\u672C */\n message: string\n /** \u7528\u6237\u6807\u8BC6\u7B26 */\n user_id: string\n /** \u6765\u81EA new-session \u7AEF\u70B9\u7684\u4F1A\u8BDD ID */\n session_id: string\n /** \u53EF\u9009\u7684\u4E0A\u4E0B\u6587\u4FE1\u606F */\n context?: {\n /** \u7528\u4E8E\u8D2D\u7269\u8F66\u64CD\u4F5C\u7684 Shopify \u8D2D\u7269\u8F66 ID */\n cartId?: string\n /** Storefront API \u8BBF\u95EE\u4EE4\u724C */\n accessToken?: string\n /** \u5DF2\u767B\u5F55\u7528\u6237\u7684 ID */\n real_user_id?: string\n }\n}\n\nexport interface NewSessionRequest {\n user_id: string\n session_id?: string\n site?: string\n channel_code?: string\n real_user_id?: string\n}\n\nexport interface NewSessionResponse {\n success: boolean\n sessionId: string\n message: string\n resumed?: boolean\n messages?: Message[]\n welcomeMessage?: string\n quickQuestions?: string[]\n brand?: string\n}\n\nexport interface ErrorResponse {\n success: boolean\n error: string\n code?: string\n details?: any\n}\n\n// ============================================================================\n// Common Text Types (\u901A\u7528\u6587\u6848)\n// ============================================================================\n\n/**\n * \u901A\u7528\u6587\u6848\u914D\u7F6E\n * \u7528\u4E8E\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u4E2D\u7684\u6309\u94AE\u6587\u6848\n */\nexport interface CommonText {\n /**\n * \u4EA7\u54C1\u5217\u8868\u5C55\u5F00\u6309\u94AE\u6587\u6848\n * @default \"Learn More\"\n */\n learnMore?: string\n\n /**\n * \u4EA7\u54C1\u5217\u8868\u6536\u8D77\u6309\u94AE\u6587\u6848\n * @default \"Show Less\"\n */\n showLess?: string\n\n /**\n * \u6DFB\u52A0\u5230\u8D2D\u7269\u8F66\u6309\u94AE\u6587\u6848\n * @default \"Add to Cart\"\n */\n addToCart?: string\n\n /**\n * \u67E5\u770B\u8D2D\u7269\u8F66/\u66F4\u591A\u6309\u94AE\u6587\u6848\n * @default \"View More\"\n */\n viewMore?: string\n\n /**\n * \u6298\u6263\u6807\u7B7E\u540E\u7F00\u6587\u6848\uFF08\u5982 \"20% OFF\" \u4E2D\u7684 \"OFF\"\uFF09\n * @default \"OFF\"\n */\n off?: string\n\n /**\n * \u8D2D\u7269\u8F66\u603B\u8BA1\u6587\u6848\n * @default \"Total\"\n */\n total?: string\n}\n\n// ============================================================================\n// Component Props Types (\u7EC4\u4EF6 Props)\n// ============================================================================\n\nexport interface LiveChatWidgetProps {\n /**\n * API \u57FA\u7840 URL\n * @example \"https://beta-api-livechat.anker.com\"\n */\n apiBaseUrl: string\n\n /**\n * \u81EA\u5B9A\u4E49\u8BF7\u6C42\u5934\n * \u5C06\u5728\u6240\u6709 API \u8BF7\u6C42\u4E2D\u6DFB\u52A0\u8FD9\u4E9B\u8BF7\u6C42\u5934\n * @example { \"Authorization\": \"Bearer token\", \"X-Custom-Header\": \"value\" }\n */\n headers?: Record<string, string>\n\n /**\n * reCAPTCHA site key\n * \u63D0\u4F9B\u6B64\u53C2\u6570\u5C06\u81EA\u52A8\u542F\u7528 reCAPTCHA v3 \u9A8C\u8BC1\n * @example \"6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14\"\n */\n recaptchaSitekey?: string\n\n /**\n * reCAPTCHA action \u524D\u7F00\n * \u5B9E\u9645\u4F7F\u7528\u65F6\u4F1A\u6839\u636E\u4E0D\u540C\u63A5\u53E3\u6DFB\u52A0\u540E\u7F00\uFF08\u5982 chat_stream, new_session\uFF09\n * @default \"livechat\"\n */\n recaptchaAction?: string\n\n /**\n * Shopify \u5E97\u94FA\u57DF\u540D\n * @example \"www.eufy.com\"\n */\n site?: string\n\n /**\n * \u6E20\u9053\u7F16\u7801\n * \u7528\u4E8E\u6807\u8BC6\u6765\u6E90\u6E20\u9053\n * @example \"web_homepage\"\n */\n channelCode?: string\n\n /**\n * \u5DF2\u767B\u5F55\u7528\u6237\u7684 ID\uFF08\u53EF\u9009\uFF09\n * \u5982\u679C\u63D0\u4F9B\uFF0C\u5C06\u5728 API \u8BF7\u6C42\u4E2D\u4F20\u9012\n */\n loginUserId?: string\n\n /**\n * Shopify \u8D2D\u7269\u8F66 ID\uFF08\u53EF\u9009\uFF09\n * \u7528\u4E8E\u8D2D\u7269\u8F66\u64CD\u4F5C\uFF0C\u5C06\u5728 stream \u63A5\u53E3\u7684 context \u4E2D\u4F20\u9012\n * @example \"gid://shopify/Cart/Z2NwLXVzLWVhc3QxOjAxSkZH...\"\n */\n cartId?: string\n\n /**\n * Storefront API \u8BBF\u95EE\u4EE4\u724C\uFF08\u53EF\u9009\uFF09\n * \u7528\u4E8E\u8D2D\u7269\u8F66\u64CD\u4F5C\uFF0C\u5C06\u5728 stream \u63A5\u53E3\u7684 context \u4E2D\u4F20\u9012\n */\n accessToken?: string\n\n /**\n * \u6C14\u6CE1\u6309\u94AE\u4F4D\u7F6E\n * \u81EA\u5B9A\u4E49\u4F4D\u7F6E\u5BF9\u8C61\uFF1A{ top?: string, bottom?: string, left?: string, right?: string }\n * @default { bottom: \"1.5rem\", right: \"1.5rem\" }\n * @example\n * // \u81EA\u5B9A\u4E49\u4F4D\u7F6E\n * position={{ bottom: \"20px\", right: \"30px\" }}\n * position={{ top: \"100px\", left: \"50px\" }}\n */\n position?: BubblePosition\n\n /**\n * \u6B22\u8FCE\u6D88\u606F\n * @default \"\u4F60\u597D\uFF01\u6211\u662F AI \u52A9\u624B\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u52A9\u4F60\u7684\u5417\uFF1F\"\n */\n welcomeMessage?: string\n\n /**\n * \u521D\u59CB\u5FEB\u6377\u56DE\u590D\u6309\u94AE\n */\n quickReplies?: QuickReply[]\n\n /**\n * \u81EA\u5B9A\u4E49\u6D88\u606F\u6E32\u67D3\u5668\n */\n customRenderers?: Record<string, MessageRenderer>\n\n /**\n * Logo URL\n */\n logoUrl?: string\n\n /**\n * \u804A\u5929\u7A97\u53E3\u6807\u9898\n * @default \"AI \u52A9\u624B\"\n */\n title?: string\n\n /**\n * \u804A\u5929\u6C14\u6CE1\u6309\u94AE\u56FE\u6807\uFF08\u56FE\u7247 URL\uFF09\n * \u5982\u679C\u63D0\u4F9B\uFF0C\u5C06\u4F7F\u7528\u56FE\u7247\u66FF\u4EE3\u9ED8\u8BA4\u7684 SVG \u56FE\u6807\n */\n chatBubbleIcon?: string\n\n /**\n * \u53D7\u63A7\u6A21\u5F0F\uFF1A\u662F\u5426\u6253\u5F00\u804A\u5929\u7A97\u53E3\n * \u63D0\u4F9B\u6B64\u53C2\u6570\u65F6\uFF0C\u7EC4\u4EF6\u5C06\u5904\u4E8E\u53D7\u63A7\u6A21\u5F0F\n * @example\n * ```tsx\n * const [isOpen, setIsOpen] = useState(false)\n * <LiveChatWidget open={isOpen} onOpenChange={setIsOpen} />\n * ```\n */\n open?: boolean\n\n /**\n * \u53D7\u63A7\u6A21\u5F0F\uFF1A\u6253\u5F00/\u5173\u95ED\u72B6\u6001\u53D8\u5316\u56DE\u8C03\n * \u3010\u5FC5\u9700\u3011\u914D\u5408 `open` \u4F7F\u7528\uFF0C\u7528\u4E8E\u540C\u6B65\u72B6\u6001\u5230\u7236\u7EC4\u4EF6\n * \u5F53\u7528\u6237\u70B9\u51FB\u6253\u5F00\u6216\u5173\u95ED\u6309\u94AE\u65F6\u89E6\u53D1\n * @example\n * ```tsx\n * <LiveChatWidget\n * open={isOpen}\n * onOpenChange={setIsOpen} // \u5FC5\u9700\uFF1A\u540C\u6B65\u72B6\u6001\n * />\n * ```\n */\n onOpenChange?: (open: boolean) => void\n\n /**\n * \u3010\u53EF\u9009\u3011\u7A97\u53E3\u6253\u5F00\u4E8B\u4EF6\u76D1\u542C\n * \u7528\u4E8E\u57CB\u70B9\u3001\u65E5\u5FD7\u7B49\u526F\u4F5C\u7528\uFF0C\u4E0D\u5F71\u54CD\u72B6\u6001\u63A7\u5236\n * \u5728 onOpenChange \u4E4B\u540E\u89E6\u53D1\n * @example\n * ```tsx\n * <LiveChatWidget\n * open={isOpen}\n * onOpenChange={setIsOpen}\n * onOpen={() => trackEvent('chat_opened')} // \u53EF\u9009\uFF1A\u57CB\u70B9\n * />\n * ```\n */\n onOpen?: () => void\n\n /**\n * \u3010\u53EF\u9009\u3011\u7A97\u53E3\u5173\u95ED\u4E8B\u4EF6\u76D1\u542C\n * \u7528\u4E8E\u57CB\u70B9\u3001\u65E5\u5FD7\u7B49\u526F\u4F5C\u7528\uFF0C\u4E0D\u5F71\u54CD\u72B6\u6001\u63A7\u5236\n * \u5728 onOpenChange \u4E4B\u540E\u89E6\u53D1\n * @example\n * ```tsx\n * <LiveChatWidget\n * open={isOpen}\n * onOpenChange={setIsOpen}\n * onClose={() => trackEvent('chat_closed')} // \u53EF\u9009\uFF1A\u57CB\u70B9\n * />\n * ```\n */\n onClose?: () => void\n onMessageSend?: (message: string) => void\n onError?: (error: Error) => void\n\n /**\n * AI \u6D88\u606F\u56DE\u8C03\n */\n /**\n * AI \u56DE\u590D\u6587\u672C\u6D88\u606F\u65F6\u89E6\u53D1\n */\n onTextMessage?: () => void\n\n /**\n * AI \u56DE\u590D\u5546\u54C1\u5217\u8868\u5361\u7247\u65F6\u89E6\u53D1\n */\n onProductList?: () => void\n\n /**\n * AI \u56DE\u590D\u4FC3\u9500\u5361\u7247\u65F6\u89E6\u53D1\n */\n onPromotionList?: () => void\n\n /**\n * \u5546\u54C1\u64CD\u4F5C\u56DE\u8C03\n */\n onAddToCart?: (product: Product) => void\n\n /**\n * \u8D2D\u7269\u8F66\u6309\u94AE\u70B9\u51FB\u56DE\u8C03\n */\n onCart?: (cartId: string, checkoutUrl?: string) => void\n\n /**\n * \u662F\u5426\u663E\u793A\u65B0\u4F1A\u8BDD\u6309\u94AE\n * @default true\n */\n showNewSessionButton?: boolean\n\n /**\n * \u901A\u7528\u6587\u6848\u914D\u7F6E\n * \u7528\u4E8E\u81EA\u5B9A\u4E49\u6309\u94AE\u6587\u6848\n */\n commonText?: CommonText\n\n /**\n * \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6E32\u67D3\u51FD\u6570\n * \u7528\u4E8E\u81EA\u5B9A\u4E49\u6E32\u67D3 product_card \u7C7B\u578B\u7684\u4EA7\u54C1\u5361\u7247\n * \u5F53\u63D0\u4F9B\u6B64\u51FD\u6570\u65F6\uFF0C\u5C06\u66FF\u4EE3\u9ED8\u8BA4\u7684\u4EA7\u54C1\u5361\u7247\u6E32\u67D3\u903B\u8F91\n * @param product \u539F\u59CB\u540E\u7AEF\u4EA7\u54C1\u6570\u636E\uFF08\u672A\u7ECF\u8F6C\u6362\u7684\u6570\u636E\uFF09\n * @returns React \u53EF\u6E32\u67D3\u7684\u5185\u5BB9\n * @example\n * ```tsx\n * <LiveChatWidget\n * productCardRender={(product) => (\n * <div>\n * <h3>{product.title}</h3>\n * <p>{product.price_range?.min}</p>\n * </div>\n * )}\n * />\n * ```\n */\n productCardRender?: (product: any) => React.ReactNode\n}\n\nexport interface MessageRenderer {\n render: (content: MessageContent, isUser: boolean, isSystem: boolean) => React.ReactNode\n}\n\nexport interface CustomRendererMap {\n [type: string]: MessageRenderer\n}\n\n// ============================================================================\n// Utility Types (\u5DE5\u5177\u7C7B\u578B)\n// ============================================================================\n\nexport interface PositionStyles {\n bottom?: string\n top?: string\n left?: string\n right?: string\n}\n\nexport type BubblePosition = PositionStyles\n"],
5
5
  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
6
6
  "names": ["types_exports", "__toCommonJS"]
7
7
  }
@@ -98,3 +98,11 @@ export declare const FAQListMessage: Story;
98
98
  * reCAPTCHA 会在后台自动验证用户行为,无需用户手动操作。
99
99
  */
100
100
  export declare const WithRecaptcha: Story;
101
+ /**
102
+ * 自定义产品卡片渲染
103
+ *
104
+ * 演示如何使用 productCardRender 自定义产品卡片的渲染样式。
105
+ *
106
+ * 当后端返回产品占位符 {{product:xxx}} 时,会使用自定义渲染函数来展示产品卡片。
107
+ */
108
+ export declare const CustomProductCardRender: Story;
@@ -1,4 +1,4 @@
1
- "use strict";var n=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var p=(t,e)=>{for(var r in e)n(t,r,{get:e[r],enumerable:!0})},m=(t,e,r,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of l(e))!d.call(t,a)&&a!==r&&n(t,a,{get:()=>e[a],enumerable:!(s=c(e,a))||s.enumerable});return t};var g=t=>m(n({},"__esModule",{value:!0}),t);var L={};p(L,{CustomBranding:()=>A,CustomImageGalleryRenderer:()=>w,CustomPosition:()=>C,CustomVideoRenderer:()=>b,CustomWelcomeMessage:()=>v,Default:()=>h,DefaultPositionDemo:()=>I,FAQListMessage:()=>P,MobileView:()=>x,ProductComparisonMessage:()=>M,TabletView:()=>k,WithEventCallbacks:()=>S,WithQuickReplies:()=>f,WithRecaptcha:()=>U,default:()=>y});module.exports=g(L);var o=require("react/jsx-runtime"),i=require("../components/LiveChatWidget"),T=require("../styles/livechat.css");const u={title:"Campaign/LiveChatWidget",component:i.LiveChatWidget,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:500},description:{component:`
1
+ "use strict";var l=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var m=(t,e)=>{for(var r in e)l(t,r,{get:e[r],enumerable:!0})},y=(t,e,r,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of p(e))!g.call(t,a)&&a!==r&&l(t,a,{get:()=>e[a],enumerable:!(s=d(e,a))||s.enumerable});return t};var u=t=>y(l({},"__esModule",{value:!0}),t);var W={};m(W,{CustomBranding:()=>x,CustomImageGalleryRenderer:()=>k,CustomPosition:()=>v,CustomProductCardRender:()=>T,CustomVideoRenderer:()=>w,CustomWelcomeMessage:()=>A,Default:()=>f,DefaultPositionDemo:()=>U,FAQListMessage:()=>P,MobileView:()=>I,ProductComparisonMessage:()=>M,TabletView:()=>R,WithEventCallbacks:()=>S,WithQuickReplies:()=>b,WithRecaptcha:()=>L,default:()=>C});module.exports=u(W);var o=require("react/jsx-runtime"),i=require("../components/LiveChatWidget"),F=require("../styles/livechat.css");const h={title:"Campaign/LiveChatWidget",component:i.LiveChatWidget,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:500},description:{component:`
2
2
  # LiveChat \u804A\u5929\u7EC4\u4EF6
3
3
 
4
4
  \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
@@ -48,7 +48,7 @@ const customRenderers = {
48
48
  customRenderers={customRenderers}
49
49
  />
50
50
  \`\`\`
51
- `}}},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=u;const h={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"}},C={args:{position:{bottom:"1.5rem",left:"1.5rem"}}},A={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:`
51
+ `}}},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 C=h;const f={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"}},v={args:{position:{bottom:"1.5rem",left:"1.5rem"}}},x={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}"}},b={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"}]}},A={args:{welcomeMessage:`
52
52
  \u{1F44B} \u60A8\u597D\uFF01\u6B22\u8FCE\u6765\u5230 Soundcore \u5B98\u65B9\u5546\u57CE\u3002
53
53
 
54
54
  \u6211\u662F\u60A8\u7684 AI \u8D2D\u7269\u52A9\u624B\uFF0C\u53EF\u4EE5\u5E2E\u60A8\uFF1A
@@ -63,7 +63,7 @@ const customRenderers = {
63
63
  \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
64
64
 
65
65
  Cart ID: ${e}
66
- Checkout URL: ${r||"\u65E0"}`)}})},b={args:{customRenderers:{video:{render:t=>{const e=t;return(0,o.jsxs)("div",{className:"w-full",children:[(0,o.jsx)("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&&(0,o.jsx)("p",{className:"mt-2 text-sm text-gray-600",children:e.title})]})}}}}},w={args:{customRenderers:{image_gallery:{render:t=>{const r=t.images||[];return(0,o.jsx)("div",{className:"grid grid-cols-2 gap-2",children:r.map((s,a)=>(0,o.jsx)("div",{className:"relative aspect-square",children:(0,o.jsx)("img",{src:s.url,alt:s.alt||`Image ${a+1}`,className:"size-full rounded-lg object-cover"})},a))})}}}}},x={parameters:{viewport:{defaultViewport:"mobile1"}},args:{}},k={parameters:{viewport:{defaultViewport:"tablet"}},args:{}},I={render:()=>(0,o.jsxs)("div",{className:"relative h-screen w-full bg-gray-50",children:[(0,o.jsx)("div",{className:"absolute inset-0 flex items-center justify-center",children:(0,o.jsx)("p",{className:"text-gray-500",children:"\u9875\u9762\u5185\u5BB9\u533A\u57DF"})}),(0,o.jsx)("div",{className:"absolute bottom-4 right-4 text-xs text-gray-400",children:"\u9ED8\u8BA4\u4F4D\u7F6E (\u53F3\u4E0B\u89D2)"}),(0,o.jsx)(i.LiveChatWidget,{apiBaseUrl:"https://beta-api-livechat.anker.com",site:"www.eufy.com"})]})},M={render:t=>(0,o.jsx)(i.LiveChatWidget,{...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
66
+ Checkout URL: ${r||"\u65E0"}`)}})},w={args:{customRenderers:{video:{render:t=>{const e=t;return(0,o.jsxs)("div",{className:"w-full",children:[(0,o.jsx)("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&&(0,o.jsx)("p",{className:"mt-2 text-sm text-gray-600",children:e.title})]})}}}}},k={args:{customRenderers:{image_gallery:{render:t=>{const r=t.images||[];return(0,o.jsx)("div",{className:"grid grid-cols-2 gap-2",children:r.map((s,a)=>(0,o.jsx)("div",{className:"relative aspect-square",children:(0,o.jsx)("img",{src:s.url,alt:s.alt||`Image ${a+1}`,className:"size-full rounded-lg object-cover"})},a))})}}}}},I={parameters:{viewport:{defaultViewport:"mobile1"}},args:{}},R={parameters:{viewport:{defaultViewport:"tablet"}},args:{}},U={render:()=>(0,o.jsxs)("div",{className:"relative h-screen w-full bg-gray-50",children:[(0,o.jsx)("div",{className:"absolute inset-0 flex items-center justify-center",children:(0,o.jsx)("p",{className:"text-gray-500",children:"\u9875\u9762\u5185\u5BB9\u533A\u57DF"})}),(0,o.jsx)("div",{className:"absolute bottom-4 right-4 text-xs text-gray-400",children:"\u9ED8\u8BA4\u4F4D\u7F6E (\u53F3\u4E0B\u89D2)"}),(0,o.jsx)(i.LiveChatWidget,{apiBaseUrl:"https://beta-api-livechat.anker.com",site:"www.eufy.com"})]})},M={render:t=>(0,o.jsx)(i.LiveChatWidget,{...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
67
67
 
68
68
  \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:`
69
69
  \u4EA7\u54C1\u5BF9\u6BD4\u6D88\u606F\u652F\u6301\u4EE5\u4E0B\u7EF4\u5EA6\uFF1A
@@ -95,7 +95,7 @@ FAQ \u5217\u8868\u6D88\u606F\u652F\u6301\uFF1A
95
95
  - \u7528\u6237\u8BE2\u95EE\u5E38\u89C1\u95EE\u9898\u65F6\u8FD4\u56DE FAQ \u5217\u8868
96
96
  - \u4EA7\u54C1\u4E13\u5C5E\u95EE\u9898\u67E5\u8BE2
97
97
  - \u6309\u5206\u7C7B\u67E5\u8BE2 FAQ
98
- `}}}},U={args:{recaptchaSitekey:"6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14",recaptchaAction:"livechat"},parameters:{docs:{description:{story:`
98
+ `}}}},L={args:{recaptchaSitekey:"6LfS4J4pAAAAACX1e_WrxutmxxzCK7FU4WzVqL14",recaptchaAction:"livechat"},parameters:{docs:{description:{story:`
99
99
  ### reCAPTCHA v3 \u914D\u7F6E
100
100
 
101
101
  \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
@@ -128,5 +128,22 @@ FAQ \u5217\u8868\u6D88\u606F\u652F\u6301\uFF1A
128
128
  - \u5EFA\u8BAE\u4E3A\u4E0D\u540C\u7684\u64CD\u4F5C\u4F7F\u7528\u4E0D\u540C\u7684 \`recaptchaAction\` \u4EE5\u4FBF\u5206\u6790
129
129
  - \u786E\u4FDD\u540E\u7AEF\u6B63\u786E\u9A8C\u8BC1 reCAPTCHA token
130
130
  - \u4E0D\u63D0\u4F9B recaptchaSitekey \u5219\u4E0D\u542F\u7528\u9A8C\u8BC1\uFF08\u4EC5\u7528\u4E8E\u5F00\u53D1\u73AF\u5883\uFF09
131
+ `}}}},T={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||"",a=t.price_range?.min||t.variants?.[0]?.price||0,B=t.price_range?.currency||t.variants?.[0]?.currency||"USD",c=t.average_rating;return(0,o.jsx)("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:n=>{n.currentTarget.style.transform="scale(1.02)"},onMouseLeave:n=>{n.currentTarget.style.transform="scale(1)"},children:(0,o.jsxs)("div",{style:{display:"flex",gap:"16px",alignItems:"center"},children:[(0,o.jsx)("div",{style:{width:"70px",height:"auto",flexShrink:0,borderRadius:"12px",overflow:"hidden",border:"2px solid #e0e0e0"},children:(0,o.jsx)("img",{src:e,alt:r,style:{width:"100%",height:"100%",objectFit:"cover"}})}),(0,o.jsxs)("div",{style:{flex:1},children:[(0,o.jsx)("h3",{style:{margin:"0 0 8px 0",fontSize:"18px",fontWeight:"bold",color:"#1a1a1a",lineHeight:"1.4"},children:r}),s&&(0,o.jsx)("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}),(0,o.jsxs)("div",{style:{display:"flex",alignItems:"center",gap:"12px"},children:[(0,o.jsx)("div",{style:{fontSize:"24px",fontWeight:"bold",color:"#4CAF50"},children:"'test price'"}),c!==void 0&&(0,o.jsxs)("div",{style:{display:"flex",alignItems:"center",gap:"4px",fontSize:"14px",color:"#666"},children:[(0,o.jsx)("span",{style:{color:"#FFB800"},children:"\u2B50"}),(0,o.jsx)("span",{children:c.toFixed(1)})]}),(0,o.jsx)("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:`
132
+ ### \u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u6E32\u67D3
133
+
134
+ \u4F7F\u7528 \`productCardRender\` \u5C5E\u6027\u53EF\u4EE5\u5B8C\u5168\u81EA\u5B9A\u4E49\u4EA7\u54C1\u5361\u7247\u7684\u5C55\u793A\u6837\u5F0F\u3002
135
+
136
+ **\u529F\u80FD\u8BF4\u660E\uFF1A**
137
+
138
+ - \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
139
+ - \u81EA\u5B9A\u4E49\u51FD\u6570\u63A5\u6536\u5B8C\u6574\u7684\u4EA7\u54C1\u5BF9\u8C61\u4F5C\u4E3A\u53C2\u6570
140
+ - \u8FD4\u56DE React \u8282\u70B9\uFF0C\u53EF\u4EE5\u662F\u4EFB\u4F55\u5408\u6CD5\u7684 JSX
141
+ - \u5982\u679C\u4E0D\u63D0\u4F9B \`productCardRender\`\uFF0C\u5219\u4F7F\u7528\u9ED8\u8BA4\u7684\u4EA7\u54C1\u5361\u7247\u6837\u5F0F
142
+
143
+ **\u6D4B\u8BD5\u6B65\u9AA4\uFF1A**
144
+
145
+ 1. \u6253\u5F00\u804A\u5929\u7A97\u53E3
146
+ 2. \u53D1\u9001 "\u63A8\u8350\u4EA7\u54C1" \u6216\u4EFB\u4F55\u4F1A\u89E6\u53D1\u4EA7\u54C1\u63A8\u8350\u7684\u6D88\u606F
147
+ 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
131
148
  `}}}};
132
149
  //# sourceMappingURL=LiveChatWidget.stories.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/stories/LiveChatWidget.stories.tsx"],
4
- "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"],
5
- "mappings": "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",
6
- "names": ["LiveChatWidget_stories_exports", "__export", "CustomBranding", "CustomImageGalleryRenderer", "CustomPosition", "CustomVideoRenderer", "CustomWelcomeMessage", "Default", "DefaultPositionDemo", "FAQListMessage", "MobileView", "ProductComparisonMessage", "TabletView", "WithEventCallbacks", "WithQuickReplies", "WithRecaptcha", "LiveChatWidget_stories_default", "__toCommonJS", "import_jsx_runtime", "import_LiveChatWidget", "import_livechat", "meta", "args", "message", "error", "product", "cartId", "checkoutUrl", "content", "videoContent", "images", "image", "index"]
4
+ "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"],
5
+ "mappings": "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",
6
+ "names": ["LiveChatWidget_stories_exports", "__export", "CustomBranding", "CustomImageGalleryRenderer", "CustomPosition", "CustomProductCardRender", "CustomVideoRenderer", "CustomWelcomeMessage", "Default", "DefaultPositionDemo", "FAQListMessage", "MobileView", "ProductComparisonMessage", "TabletView", "WithEventCallbacks", "WithQuickReplies", "WithRecaptcha", "LiveChatWidget_stories_default", "__toCommonJS", "import_jsx_runtime", "import_LiveChatWidget", "import_livechat", "meta", "args", "message", "error", "product", "cartId", "checkoutUrl", "content", "videoContent", "images", "image", "index", "imageUrl", "title", "description", "price", "currency", "averageRating", "e"]
7
7
  }
@@ -1,2 +1,2 @@
1
- import{Fragment as Le,jsx as w,jsxs as Oe}from"react/jsx-runtime";import P,{useEffect as me,useCallback as E}from"react";import*as I from"@radix-ui/react-dialog";import{DEFAULT_COMMON_TEXT as ge}from"./constants";import{ChatBubble as fe}from"./components/ChatBubble";import{ChatWindow as ye}from"./components/ChatWindow";import{useChatState as he}from"./hooks/useChatState";import{useChatAPI as _e}from"./hooks/useChatAPI";import{MessageRendererRegistry as Ce}from"./utils/messageRenderers";import{sanitizeInput as we}from"./utils/validation";import{transformProducts as H}from"./utils/productTransformers.js";import{transformCartData as Re}from"./utils/cartTransformers.js";import{TextBlock as xe,ProductCard as Se,ProductList as De,ProductComparisonRenderer as Me,PolicyBlock as Pe,createQuickRepliesRenderer as Ee,ThinkingBlock as Te,ErrorBlock as qe,FAQListRenderer as ve,PromotionListRenderer as Fe,CartCard as Be}from"./components/MessageContent/index.js";const Ge=({apiBaseUrl:J,headers:Y,recaptchaSitekey:W,recaptchaAction:Z,site:r,channelCode:g,loginUserId:u,cartId:$,accessToken:N,position:j,welcomeMessage:y,quickReplies:p,customRenderers:T,logoUrl:U,title:b,chatBubbleIcon:ee,open:te,onOpenChange:se,onOpen:ae,onClose:ne,onMessageSend:q,onError:l,onTextMessage:re,onProductList:ie,onPromotionList:oe,onAddToCart:R,onCart:v,showNewSessionButton:de,commonText:Q})=>{const h=P.useMemo(()=>({...ge,...Q}),[Q]),ce=he({welcomeMessage:y,site:r,open:te,onOpenChange:se,onOpen:ae,onClose:ne,onMessageSend:q,onError:l,onTextMessage:re,onProductList:ie,onPromotionList:oe,onAddToCart:R,onCart:v}),{messages:F,isOpen:x,userId:i,sessionId:B,inputValue:L,isStreaming:pe,openChat:z,closeChat:k,setInputValue:O,addMessage:c,setMessages:S,clearMessages:D,handleSSEEvent:V,saveSession:M,clearSession:_}=ce,{sendMessageStream:K,createSession:f}=_e({apiBaseUrl:J,headers:Y,recaptchaConfig:{needRecaptcha:!!W,recaptchaSitekey:W,recaptchaAction:Z},onError:l}),X=P.useRef(async t=>{}),ue=P.useMemo(()=>{const t=new Ce;t.register("text",xe),t.register("product_card",Se),t.register("product_list",De),t.register("product_comparison",Me),t.register("policy",Pe),t.register("thinking",Te),t.register("error",qe),t.register("faq_list",ve),t.register("promotion_list",Fe),t.register("cart",Be);const s=Ee(a=>{X.current(a.value)});return t.register("quick_replies",s),T&&t.registerMany(T),t},[T]);me(()=>{if(!x||!i)return;const t=B;t?le(t):C()},[x,i]);const G=E(t=>{if(Array.isArray(t.content))return t;const s=[];typeof t.content=="string"&&t.content.trim()&&s.push({type:"text",text:t.content});const a=t.structuredContent||t.structured_content;return Array.isArray(a)&&a.forEach(e=>{if(e.type==="product_list"&&Array.isArray(e.data))s.push({type:"product_list",data:{products:H(e.data,r),title:void 0,commonText:h}});else if(e.type==="quick_replies"&&e.data?.replies)s.push({type:"quick_replies",data:{replies:e.data.replies}});else if(e.type==="policy"&&e.data?.title&&e.data?.content)s.push({type:"policy",data:{title:e.data.title,content:e.data.content}});else if(e.type==="product_comparison"&&e.data?.products&&e.data?.dimensions)s.push({type:"product_comparison",data:{products:H(e.data.products,r),dimensions:e.data.dimensions,onAddToCart:R,commonText:h}});else if(e.type==="faq_list"&&e.data?.found!==void 0)s.push({type:"faq_list",data:e.data});else if(e.type==="promotion_list"&&e.data?.found!==void 0)s.push({type:"promotion_list",data:{...e.data,commonText:h}});else if(e.type==="cart"&&e.data?.id!==void 0){const o=Re(e.data);s.push({type:"cart",data:{...o,onCart:v,commonText:h}})}else s.push(e)}),s.length===0&&s.push({type:"text",text:""}),{...t,content:s}},[r,v,R,h]),C=E(async()=>{if(i)try{const t=await f({user_id:i,site:r,channel_code:g,real_user_id:u});if(t.success){M(t.sessionId),D();const s=t.welcomeMessage||y;if(s){const a=[{type:"text",text:s}],e=t.quickQuestions;if(e&&e.length>0){const o=e.map((n,m)=>({id:`quick-${m}`,label:n,value:n}));a.push({type:"quick_replies",data:{replies:o}})}else p&&p.length>0&&a.push({type:"quick_replies",data:{replies:p}});c({id:`welcome-${Date.now()}`,role:"assistant",content:a,timestamp:Date.now()})}}}catch(t){console.error("[LiveChatWidget] Failed to create new session:",t),l?.(t),c({id:`error-${Date.now()}`,role:"system",content:[{type:"error",data:{message:"Failed to create session. Please refresh the page and try again.",code:"SESSION_CREATE_ERROR"}}],timestamp:Date.now()})}},[i,r,g,u,f,M,D,y,p,c,l]),le=E(async t=>{try{const s=await f({user_id:i,session_id:t,site:r,channel_code:g,real_user_id:u});if(s.success&&s.resumed)if(s.messages&&s.messages.length>0){const a=s.messages.filter(e=>e!=null).map(G).filter(e=>e.content&&e.content.length>0&&!(e.content.length===1&&e.content[0].type==="text"&&!e.content[0].text));S(a)}else{D();const a=s.welcomeMessage||y;if(a){const e=[{type:"text",text:a}],o=s.quickQuestions;if(o&&o.length>0){const n=o.map((m,d)=>({id:`quick-${d}`,label:m,value:m}));e.push({type:"quick_replies",data:{replies:n}})}else p&&p.length>0&&e.push({type:"quick_replies",data:{replies:p}});c({id:`welcome-${Date.now()}`,role:"assistant",content:e,timestamp:Date.now()})}}else s.resumed||(_(),C())}catch(s){console.error("[LiveChatWidget] Failed to resume session:",s),c({id:`error-${Date.now()}`,role:"system",content:[{type:"error",data:{message:"Failed to resume session. Creating a new session...",code:"SESSION_RESUME_ERROR"}}],timestamp:Date.now()}),_(),C()}},[i,r,g,u,f,S,_,D,G,C,y,p,c]),A=E(async t=>{const s=t||L.trim();if(!s)return;t||O("");const a=we(s);if(!a){l?.(new Error("Invalid message"));return}const e={id:`user-${Date.now()}`,role:"user",content:[{type:"text",text:a}],timestamp:Date.now()};c(e);const o={id:`thinking-${Date.now()}`,role:"assistant",content:[{type:"thinking",data:{status:"thinking"}}],timestamp:Date.now()};c(o),q?.(a);try{let n=B;if(!n){const d=await f({user_id:i,site:r,channel_code:g,real_user_id:u});if(d.success)n=d.sessionId,M(n);else throw new Error("Failed to create session")}await K({message:a,user_id:i,session_id:n,context:{cartId:$,accessToken:N,real_user_id:u}},d=>{V(d),d.event==="status"&&d.data.type==="session_expired"&&_()})}catch(n){console.error("[LiveChatWidget] Failed to send message:",n),l?.(n);const m=F.filter(d=>d.id!==o.id);S([...m,{id:`error-${Date.now()}`,role:"system",content:[{type:"error",data:{message:"Failed to send message. Please check your network connection and try again.",code:"NETWORK_ERROR"}}],timestamp:Date.now()}])}},[L,i,B,r,g,u,$,N,F,O,c,S,f,K,V,M,_,q,l]);return P.useEffect(()=>{X.current=A},[A]),Oe(Le,{children:[w(fe,{position:j,onClick:z,visible:!x,iconImageUrl:ee}),w(I.Root,{open:x,onOpenChange:t=>t?z():k(),children:w(I.Portal,{children:w(I.Content,{className:"livechat-window-enter",style:{position:"fixed",zIndex:9998},children:w(ye,{messages:F,inputValue:L,onInputChange:O,onSend:()=>A(),onClose:k,onNewSession:C,title:b,logoUrl:U,isSending:pe,rendererRegistry:ue,inputPlaceholder:"",onAddToCart:R,showNewSessionButton:de})})})})]})};export{Ge as LiveChatWidget};
1
+ import{Fragment as $e,jsx as S,jsxs as Ae}from"react/jsx-runtime";import T,{useEffect as ye,useCallback as q}from"react";import*as $ from"@radix-ui/react-dialog";import{DEFAULT_COMMON_TEXT as _e}from"./constants";import{ChatBubble as we}from"./components/ChatBubble";import{ChatWindow as Ce}from"./components/ChatWindow";import{useChatState as xe}from"./hooks/useChatState";import{useChatAPI as Se}from"./hooks/useChatAPI";import{MessageRendererRegistry as De}from"./utils/messageRenderers";import{sanitizeInput as Re}from"./utils/validation";import{transformProducts as J}from"./utils/productTransformers.js";import{transformCartData as Me}from"./utils/cartTransformers.js";import{TextBlock as Ee,ProductCard as Pe,ProductList as ve,ProductComparisonRenderer as Te,PolicyBlock as qe,createQuickRepliesRenderer as Fe,ThinkingBlock as We,ErrorBlock as Be,FAQListRenderer as Ie,PromotionListRenderer as Le,CartCard as Oe}from"./components/MessageContent/index.js";const Ze=({apiBaseUrl:Z,headers:j,recaptchaSitekey:A,recaptchaAction:U,site:i,channelCode:m,loginUserId:u,cartId:N,accessToken:Q,position:b,welcomeMessage:y,quickReplies:l,customRenderers:F,logoUrl:ee,title:te,chatBubbleIcon:se,open:ae,onOpenChange:ne,onOpen:re,onClose:ie,onMessageSend:W,onError:g,onTextMessage:oe,onProductList:de,onPromotionList:ce,onAddToCart:D,onCart:B,showNewSessionButton:pe,commonText:k,productCardRender:ue})=>{const _=T.useMemo(()=>({..._e,...k}),[k]),le=xe({welcomeMessage:y,site:i,open:ae,onOpenChange:ne,onOpen:re,onClose:ie,onMessageSend:W,onError:g,onTextMessage:oe,onProductList:de,onPromotionList:ce,onAddToCart:D,onCart:B,productCardRender:ue}),{messages:R,isOpen:M,userId:o,sessionId:I,inputValue:L,isStreaming:me,openChat:z,closeChat:V,setInputValue:O,addMessage:p,setMessages:h,clearMessages:E,handleSSEEvent:X,saveSession:w,clearSession:C}=le,{sendMessageStream:K,createSession:f}=Se({apiBaseUrl:Z,headers:j,recaptchaConfig:{needRecaptcha:!!A,recaptchaSitekey:A,recaptchaAction:U},onError:g}),Y=T.useRef(async t=>{}),ge=T.useMemo(()=>{const t=new De;t.register("text",Ee),t.register("product_card",Pe),t.register("product_list",ve),t.register("product_comparison",Te),t.register("policy",qe),t.register("thinking",We),t.register("error",Be),t.register("faq_list",Ie),t.register("promotion_list",Le),t.register("cart",Oe);const s=Fe(n=>{Y.current(n.value)});return t.register("quick_replies",s),F&&t.registerMany(F),t},[F]);ye(()=>{if(!M||!o)return;const t=I;t?fe(t):x()},[M,o]);const G=q(t=>{if(Array.isArray(t.content))return t;const s=[];typeof t.content=="string"&&t.content.trim()&&s.push({type:"text",text:t.content});const n=t.structuredContent||t.structured_content;return Array.isArray(n)&&n.forEach(e=>{if(e.type==="product_list"&&Array.isArray(e.data))s.push({type:"product_list",data:{products:J(e.data,i),title:void 0,commonText:_}});else if(e.type==="quick_replies"&&e.data?.replies)s.push({type:"quick_replies",data:{replies:e.data.replies}});else if(e.type==="policy"&&e.data?.title&&e.data?.content)s.push({type:"policy",data:{title:e.data.title,content:e.data.content}});else if(e.type==="product_comparison"&&e.data?.products&&e.data?.dimensions)s.push({type:"product_comparison",data:{products:J(e.data.products,i),dimensions:e.data.dimensions,onAddToCart:D,commonText:_}});else if(e.type==="faq_list"&&e.data?.found!==void 0)s.push({type:"faq_list",data:e.data});else if(e.type==="promotion_list"&&e.data?.found!==void 0)s.push({type:"promotion_list",data:{...e.data,commonText:_}});else if(e.type==="cart"&&e.data?.id!==void 0){const d=Me(e.data);s.push({type:"cart",data:{...d,onCart:B,commonText:_}})}else s.push(e)}),s.length===0&&s.push({type:"text",text:""}),{...t,content:s}},[i,B,D,_]),x=q(async()=>{if(o)try{const t=await f({user_id:o,site:i,channel_code:m,real_user_id:u});if(t.success){w(t.sessionId),E();const s=t.welcomeMessage||y;if(s){const n=[{type:"text",text:s}],e=t.quickQuestions;if(e&&e.length>0){const d=e.map((r,a)=>({id:`quick-${a}`,label:r,value:r}));n.push({type:"quick_replies",data:{replies:d}})}else l&&l.length>0&&n.push({type:"quick_replies",data:{replies:l}});p({id:`welcome-${Date.now()}`,role:"assistant",content:n,timestamp:Date.now()})}}}catch(t){console.error("[LiveChatWidget] Failed to create new session:",t),g?.(t),p({id:`error-${Date.now()}`,role:"system",content:[{type:"error",data:{message:"Failed to create session. Please refresh the page and try again.",code:"SESSION_CREATE_ERROR"}}],timestamp:Date.now()})}},[o,i,m,u,f,w,E,y,l,p,g]),fe=q(async t=>{try{const s=await f({user_id:o,session_id:t,site:i,channel_code:m,real_user_id:u});if(s.success&&s.resumed){const n=s.welcomeMessage||y,e=n?[{type:"text",text:n}]:[],d=s.quickQuestions;if(d&&d.length>0){const r=d.map((a,v)=>({id:`quick-${v}`,label:a,value:a}));e.push({type:"quick_replies",data:{replies:r}})}else l&&l.length>0&&e.push({type:"quick_replies",data:{replies:l}});if(s.messages&&s.messages.length>0){const r=s.messages.filter(a=>a!=null).map(G).filter(a=>a.content&&a.content.length>0&&!(a.content.length===1&&a.content[0].type==="text"&&!a.content[0].text));if(e.length>0){const a={id:`welcome-${Date.now()}`,role:"assistant",content:e,timestamp:Date.now()};h([a,...r])}else h(r)}else E(),e.length>0&&p({id:`welcome-${Date.now()}`,role:"assistant",content:e,timestamp:Date.now()})}else s.resumed||(C(),x())}catch(s){console.error("[LiveChatWidget] Failed to resume session:",s),p({id:`error-${Date.now()}`,role:"system",content:[{type:"error",data:{message:"Failed to resume session. Creating a new session...",code:"SESSION_RESUME_ERROR"}}],timestamp:Date.now()}),C(),x()}},[o,i,m,u,f,h,C,E,G,x,y,l,p]),P=q(async(t,s=!1)=>{const n=t||L.trim();if(!n)return;!t&&!s&&O("");const e=Re(n);if(!e){g?.(new Error("Invalid message"));return}if(!s){const a={id:`user-${Date.now()}`,role:"user",content:[{type:"text",text:e}],timestamp:Date.now()};p(a)}const d={id:`thinking-${Date.now()}`,role:"assistant",content:[{type:"thinking",data:{status:"thinking"}}],timestamp:Date.now()};p(d),s||W?.(e);let r=!1;try{let a=I;if(!a){const c=await f({user_id:o,site:i,channel_code:m,real_user_id:u});if(c.success)a=c.sessionId,w(a);else throw new Error("Failed to create session")}if(await K({message:e,user_id:o,session_id:a,context:{cartId:N,accessToken:Q,real_user_id:u}},c=>{X(c),c.event==="error"&&c.data.type==="validation_error"&&(r=!0,C())}),r&&!s){console.log("[LiveChatWidget] Session expired (validation_error), creating new session and retrying...");const c=R.filter(he=>he.id!==d.id);h(c);const H=await f({user_id:o,site:i,channel_code:m,real_user_id:u});if(H.success)w(H.sessionId),await P(e,!0);else throw new Error("Failed to recreate session after expiration")}}catch(a){console.error("[LiveChatWidget] Failed to send message:",a),g?.(a);const v=R.filter(c=>c.id!==d.id);h([...v,{id:`error-${Date.now()}`,role:"system",content:[{type:"error",data:{message:r?"Your session has expired. We tried to reconnect but failed. Please try again.":"Failed to send message. Please check your network connection and try again.",code:r?"SESSION_EXPIRED":"NETWORK_ERROR"}}],timestamp:Date.now()}])}},[L,o,I,i,m,u,N,Q,R,O,p,h,f,K,X,w,C,W,g]);return T.useEffect(()=>{Y.current=P},[P]),Ae($e,{children:[S(we,{position:b,onClick:z,visible:!M,iconImageUrl:se}),S($.Root,{open:M,onOpenChange:t=>t?z():V(),children:S($.Portal,{children:S($.Content,{className:"livechat-window-enter",style:{position:"fixed",zIndex:9998},children:S(Ce,{messages:R,inputValue:L,onInputChange:O,onSend:()=>P(),onClose:V,onNewSession:x,title:te,logoUrl:ee,isSending:me,rendererRegistry:ge,inputPlaceholder:"",onAddToCart:D,showNewSessionButton:pe})})})})]})};export{Ze as LiveChatWidget};
2
2
  //# sourceMappingURL=LiveChatWidget.js.map