@anker-in/campaign-ui 0.2.11-beta.2 → 0.2.11-beta.21

package/dist/esm/components/LiveChatWidget/types.d.ts

@@ -0,0 +1,609 @@
+/**
+ * LiveChat 组件核心类型定义
+ * 基于 specs/livechat-widget/data-model.md
+ */
+export type SessionStatus = 'active' | 'expired';
+export interface Session {
+    sessionId: string;
+    userId: string;
+    site: string;
+    status: SessionStatus;
+    createdAt?: number;
+    lastActivityAt?: number;
+}
+export type MessageRole = 'user' | 'assistant' | 'system' | 'tool';
+export interface MessageMetadata {
+    tokenUsage?: {
+        inputTokens: number;
+        outputTokens: number;
+    };
+    toolCalls?: Array<{
+        id: string;
+        type: string;
+        name: string;
+    }>;
+}
+export interface Message {
+    id: string;
+    sessionId?: string;
+    role: MessageRole;
+    content: MessageContent[];
+    timestamp: number;
+    metadata?: MessageMetadata;
+}
+export type MessageContentType = 'text' | 'product_card' | 'product_list' | 'product_comparison' | 'policy' | 'quick_replies' | 'thinking' | 'error' | 'faq_list' | 'cart';
+export type MessageContent = TextContent | ProductCardContent | ProductListContent | ProductComparisonContent | PolicyContent | QuickRepliesContent | ThinkingContent | ErrorContent | FAQListContent | PromotionListContent | CartContent;
+export interface TextContent {
+    type: 'text';
+    text: string;
+}
+export interface ProductCardContent {
+    type: 'product_card';
+    data: {
+        product: Product;
+    };
+}
+export interface ProductListContent {
+    type: 'product_list';
+    data: {
+        products: Product[];
+        title?: string;
+        onAddToCart?: (product: Product) => void;
+    };
+}
+export interface ProductComparisonContent {
+    type: 'product_comparison';
+    data: {
+        products: Product[];
+        dimensions: {
+            price?: {
+                label: string;
+                values: Array<{
+                    product_id: string;
+                    min: number;
+                    max: number;
+                    currency: string;
+                    has_discount: boolean;
+                }>;
+            };
+            variants?: {
+                label: string;
+                values: Array<{
+                    product_id: string;
+                    count: number;
+                }>;
+            };
+            member_price?: {
+                label: string;
+                values: Array<{
+                    product_id: string;
+                    available: boolean;
+                    min: number;
+                    max: number;
+                    currency: string;
+                }>;
+            };
+            discount?: {
+                label: string;
+                values: Array<{
+                    product_id: string;
+                    has_discount: boolean;
+                }>;
+            };
+            [key: string]: any;
+        };
+        onAddToCart?: (product: Product) => void;
+    };
+}
+export interface PolicyContent {
+    type: 'policy';
+    data: {
+        title: string;
+        content: string;
+    };
+}
+export interface QuickRepliesContent {
+    type: 'quick_replies';
+    data: {
+        replies: QuickReply[];
+    };
+}
+export interface ThinkingContent {
+    type: 'thinking';
+    data: {
+        status: string;
+    };
+}
+export interface ErrorContent {
+    type: 'error';
+    data: {
+        message: string;
+        code?: string;
+    };
+}
+export interface FAQListContent {
+    type: 'faq_list';
+    data: {
+        found: boolean;
+        count: number;
+        total?: number;
+        results: FAQItem[];
+    };
+}
+export interface PromotionListContent {
+    type: 'promotion_list';
+    data: {
+        found: boolean;
+        count: number;
+        total?: number;
+        results: PromotionItem[];
+    };
+}
+export type FAQCategory = 'shipping' | 'return' | 'product' | 'payment' | 'general';
+export interface FAQItem {
+    id: string;
+    question: string;
+    answer: string;
+    category: FAQCategory;
+    keywords?: string[];
+    relatedQuestions?: string[];
+    metadata?: {
+        language?: string;
+        priority?: number;
+        lastUpdated?: string;
+    };
+}
+export interface PromotionItem {
+    id: string;
+    title: string;
+    subtitle?: string;
+    description?: string;
+    banner_url?: string;
+    url?: string;
+    time_range: {
+        start: string;
+        end?: string | null;
+        is_active: boolean;
+    };
+    priority?: number;
+    product_count?: number;
+    metadata?: {
+        display_order?: number;
+        target_audience?: string;
+    };
+}
+export type StockStatus = 'in_stock' | 'low_stock' | 'out_of_stock';
+export interface Price {
+    amount: number;
+    currency: string;
+}
+export interface PriceRange {
+    min: number;
+    max: number;
+    currency: string;
+}
+export interface VariantDiscount {
+    has_discount: boolean;
+    discount_price?: number;
+    discount_code?: string;
+    discount_percentage?: number;
+    /** 折扣类型：fixed_amount 固定金额折扣，percentage 百分比折扣 */
+    discount_type?: 'fixed_amount' | 'percentage';
+    /** 折扣数值（可能是字符串或数字） */
+    discount_value?: string | number;
+}
+export interface VariantMemberPrice {
+    has_member_price: boolean;
+    price?: number;
+}
+export interface ProductFeatures {
+    is_new?: boolean;
+    has_rental?: boolean;
+    has_presale?: boolean;
+    has_member_price?: boolean;
+    has_discount?: boolean;
+}
+export interface Variant {
+    id: string;
+    title: string;
+    sku?: string;
+    price?: Price;
+    availableForSale: boolean;
+    color?: string;
+    discount?: VariantDiscount;
+    memberPrice?: VariantMemberPrice;
+    inventoryQuantity?: number;
+    option1?: string;
+    option2?: string;
+    option3?: string;
+}
+export interface Product {
+    shopifyId: string;
+    sku?: string;
+    handle: string;
+    title: string;
+    description?: string;
+    vendor?: string;
+    price: Price;
+    priceRange?: PriceRange;
+    memberPriceRange?: PriceRange;
+    imageUrl: string;
+    productUrl: string;
+    stockStatus: StockStatus;
+    hotScore?: number;
+    averageRating?: number;
+    reviewCount?: number;
+    variants?: Variant[];
+    variantCount?: number;
+    availableCount?: number;
+    features?: ProductFeatures;
+    tags?: string[];
+}
+export interface QuickReply {
+    id: string;
+    label: string;
+    value: string;
+    icon?: string;
+}
+export interface Policy {
+    title: string;
+    content: string;
+}
+/**
+ * 购物车金额信息
+ */
+export interface CartAmount {
+    /** 金额字符串（如 "99.99"） */
+    amount: string;
+    /** 货币代码（如 "USD"） */
+    currencyCode: string;
+}
+/**
+ * 购物车价格汇总
+ */
+export interface CartCost {
+    /** 应付总价（已应用折扣） */
+    totalAmount: CartAmount;
+    /** 原价小计（未应用折扣） */
+    subtotalAmount: CartAmount;
+}
+/**
+ * 购物车商品变体信息
+ */
+export interface CartMerchandise {
+    /** 变体 ID (Shopify ProductVariant GID) */
+    id: string;
+    /** 变体标题（如 "Black", "Large" 等） */
+    title: string;
+    /** 单价 */
+    price: CartAmount;
+    /** 商品图片 URL */
+    image?: {
+        url: string;
+        altText?: string;
+    };
+    /** 关联的商品信息 */
+    product: {
+        /** 商品 ID */
+        id: string;
+        /** 商品标题 */
+        title: string;
+        /** 商品 handle */
+        handle: string;
+    };
+}
+/**
+ * 购物车商品行
+ */
+export interface CartLine {
+    /** 购物车行 ID (用于更新/删除操作) */
+    id: string;
+    /** 商品数量 */
+    quantity: number;
+    /** 价格信息 */
+    cost: {
+        /** 行总价（单价 × 数量，已应用折扣） */
+        totalAmount: CartAmount;
+        /** 单价 */
+        amountPerQuantity: CartAmount;
+        /** 行小计（单价 × 数量，未应用折扣） */
+        subtotalAmount: CartAmount;
+    };
+    /** 商品变体信息 */
+    merchandise: CartMerchandise;
+    /** 自定义属性（可选） */
+    attributes?: Array<{
+        key: string;
+        value: string;
+    }>;
+}
+/**
+ * 购物车折扣码
+ */
+export interface CartDiscountCode {
+    /** 折扣码 */
+    code: string;
+    /** 是否有效/适用 */
+    applicable: boolean;
+}
+/**
+ * 购物车数据
+ */
+export interface CartData {
+    /** 购物车是否为空 */
+    isEmpty: boolean;
+    /** 购物车 ID (Shopify Cart GID) */
+    cartId: string;
+    /** 商品总数量 */
+    totalQuantity: number;
+    /** 商品列表 */
+    lines: CartLine[];
+    /** 价格汇总 */
+    cost: CartCost;
+    /** 折扣码列表 */
+    discountCodes?: CartDiscountCode[];
+    /** 结账页面 URL */
+    checkoutUrl?: string;
+    /** 购物车按钮回调函数 */
+    onCart?: (cartId: string, checkoutUrl?: string) => void;
+}
+/**
+ * 购物车内容块
+ */
+export interface CartContent {
+    type: 'cart';
+    data: CartData;
+}
+/**
+ * 后端返回的购物车商品行数据 (Shopify GraphQL 格式)
+ */
+export interface BackendCartLineNode {
+    id: string;
+    quantity: number;
+    cost: {
+        totalAmount: CartAmount;
+        amountPerQuantity: CartAmount;
+        compareAtAmountPerQuantity?: CartAmount | null;
+        subtotalAmount: CartAmount;
+    };
+    discountAllocations: any[];
+    merchandise: {
+        id: string;
+        title: string;
+        availableForSale: boolean;
+        quantityAvailable?: number;
+        price: CartAmount;
+        compareAtPrice?: CartAmount | null;
+        image?: {
+            url: string;
+            altText?: string | null;
+            width?: number;
+            height?: number;
+        } | null;
+        product: {
+            id: string;
+            title: string;
+            handle: string;
+            vendor?: string;
+            featuredImage?: {
+                url: string;
+                altText?: string | null;
+                width?: number;
+                height?: number;
+            } | null;
+            tags?: string[];
+        };
+    };
+    attributes?: Array<{
+        key: string;
+        value: string;
+    }>;
+}
+/**
+ * 后端返回的购物车数据 (Shopify GraphQL 格式)
+ */
+export interface BackendCartData {
+    id: string;
+    checkoutUrl?: string;
+    totalQuantity: number;
+    lines: {
+        edges: Array<{
+            node: BackendCartLineNode;
+        }>;
+    };
+    cost: {
+        totalAmount: CartAmount;
+        subtotalAmount: CartAmount;
+        checkoutChargeAmount?: CartAmount;
+        totalAmountEstimated?: boolean;
+        subtotalAmountEstimated?: boolean;
+        totalTaxAmount?: CartAmount | null;
+        totalDutyAmount?: CartAmount | null;
+    };
+    discountAllocations?: any[];
+    buyerIdentity?: any;
+    attributes?: Array<{
+        key: string;
+        value: string;
+    }>;
+    discountCodes?: any[];
+    createdAt?: string;
+    updatedAt?: string;
+}
+export type SSEEventType = 'message_start' | 'content_delta' | 'content_block' | 'message_end' | 'tool_start' | 'tool_end' | 'status' | 'error' | 'done';
+export interface SSEEvent<T = any> {
+    event: SSEEventType | null;
+    data: T;
+}
+export interface MessageStartData {
+    sessionId: string;
+}
+export interface ContentDeltaData {
+    text: string;
+}
+export interface ContentBlockData {
+    type: string;
+    data: any;
+}
+export interface MessageEndData {
+    usage: {
+        inputTokens: number;
+        outputTokens: number;
+    };
+}
+export interface ToolStartData {
+    id: string;
+    type: string;
+    name: string;
+}
+export interface ToolEndData {
+    id: string;
+}
+export interface StatusData {
+    type: string;
+    message?: string;
+}
+export interface ErrorData {
+    message: string;
+    code?: string;
+}
+/**
+ * 流式对话请求参数
+ */
+export interface ChatStreamRequest {
+    /** 用户的消息文本 */
+    message: string;
+    /** 用户标识符 */
+    user_id: string;
+    /** 来自 new-session 端点的会话 ID */
+    session_id: string;
+    /** 可选的上下文信息 */
+    context?: {
+        /** 用于购物车操作的 Shopify 购物车 ID */
+        cartId?: string;
+        /** Storefront API 访问令牌 */
+        accessToken?: string;
+        /** 已登录用户的 ID */
+        real_user_id?: string;
+    };
+}
+export interface NewSessionRequest {
+    user_id: string;
+    session_id?: string;
+    site?: string;
+    real_user_id?: string;
+}
+export interface NewSessionResponse {
+    success: boolean;
+    sessionId: string;
+    message: string;
+    resumed?: boolean;
+    messages?: Message[];
+    welcomeMessage?: string;
+    quickQuestions?: string[];
+    brand?: string;
+}
+export interface ErrorResponse {
+    success: boolean;
+    error: string;
+    code?: string;
+    details?: any;
+}
+export interface LiveChatWidgetProps {
+    /**
+     * API 基础 URL
+     * @example "https://beta-api-livechat.anker.com"
+     */
+    apiBaseUrl: string;
+    /**
+     * Shopify 店铺域名
+     * @example "www.eufy.com"
+     */
+    site?: string;
+    /**
+     * 已登录用户的 ID（可选）
+     * 如果提供，将在 API 请求中传递
+     */
+    loginUserId?: string;
+    /**
+     * Shopify 购物车 ID（可选）
+     * 用于购物车操作，将在 stream 接口的 context 中传递
+     * @example "gid://shopify/Cart/Z2NwLXVzLWVhc3QxOjAxSkZH..."
+     */
+    cartId?: string;
+    /**
+     * Storefront API 访问令牌（可选）
+     * 用于购物车操作，将在 stream 接口的 context 中传递
+     */
+    accessToken?: string;
+    /**
+     * 气泡按钮位置
+     * 自定义位置对象：{ top?: string, bottom?: string, left?: string, right?: string }
+     * @default { bottom: "1.5rem", right: "1.5rem" }
+     * @example
+     * // 自定义位置
+     * position={{ bottom: "20px", right: "30px" }}
+     * position={{ top: "100px", left: "50px" }}
+     */
+    position?: BubblePosition;
+    /**
+     * 欢迎消息
+     * @default "你好！我是 AI 助手，有什么可以帮助你的吗？"
+     */
+    welcomeMessage?: string;
+    /**
+     * 初始快捷回复按钮
+     */
+    quickReplies?: QuickReply[];
+    /**
+     * 自定义消息渲染器
+     */
+    customRenderers?: Record<string, MessageRenderer>;
+    /**
+     * Logo URL
+     */
+    logoUrl?: string;
+    /**
+     * 聊天窗口标题
+     * @default "AI 助手"
+     */
+    title?: string;
+    /**
+     * 聊天气泡按钮图标（图片 URL）
+     * 如果提供，将使用图片替代默认的 SVG 图标
+     */
+    chatBubbleIcon?: string;
+    /**
+     * 事件回调
+     */
+    onOpen?: () => void;
+    onClose?: () => void;
+    onMessageSend?: (message: string) => void;
+    onError?: (error: Error) => void;
+    /**
+     * 商品操作回调
+     */
+    onAddToCart?: (product: Product) => void;
+    /**
+     * 购物车按钮点击回调
+     */
+    onCart?: (cartId: string, checkoutUrl?: string) => void;
+    /**
+     * 是否显示新会话按钮
+     * @default true
+     */
+    showNewSessionButton?: boolean;
+}
+export interface MessageRenderer {
+    render: (content: MessageContent, isUser: boolean, isSystem: boolean) => React.ReactNode;
+}
+export interface CustomRendererMap {
+    [type: string]: MessageRenderer;
+}
+export interface PositionStyles {
+    bottom?: string;
+    top?: string;
+    left?: string;
+    right?: string;
+}
+export type BubblePosition = PositionStyles;

package/dist/esm/components/LiveChatWidget/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/components/LiveChatWidget/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/esm/components/LiveChatWidget/utils/cartTransformers.d.ts

@@ -0,0 +1,25 @@
+/**
+ * 购物车数据转换工具
+ * 将后端返回的 Shopify GraphQL 格式转换为前端标准格式
+ */
+import type { BackendCartData, CartData } from '../types';
+/**
+ * 转换后端购物车数据为前端格式
+ *
+ * @param backendData 后端返回的 Shopify GraphQL 格式数据
+ * @returns 前端标准化的购物车数据
+ *
+ * @example
+ * ```typescript
+ * const backendData = {
+ *   id: "gid://shopify/Cart/xxx",
+ *   lines: { edges: [{ node: {...} }] },
+ *   cost: { totalAmount: {...}, subtotalAmount: {...} },
+ *   ...
+ * }
+ *
+ * const cartData = transformCartData(backendData)
+ * // => { cartId: "gid://shopify/Cart/xxx", lines: [...], ... }
+ * ```
+ */
+export declare function transformCartData(backendData: BackendCartData): CartData;

package/dist/esm/components/LiveChatWidget/utils/cartTransformers.js

@@ -0,0 +1,2 @@
+function i(o){const n=o.lines.edges.map(t=>({id:t.node.id,quantity:t.node.quantity,cost:{totalAmount:t.node.cost.totalAmount,amountPerQuantity:t.node.cost.amountPerQuantity,subtotalAmount:t.node.cost.subtotalAmount},merchandise:{id:t.node.merchandise.id,title:t.node.merchandise.title,price:t.node.merchandise.price,image:t.node.merchandise.image?{url:t.node.merchandise.image.url,altText:t.node.merchandise.image.altText||void 0}:void 0,product:{id:t.node.merchandise.product.id,title:t.node.merchandise.product.title,handle:t.node.merchandise.product.handle}},attributes:t.node.attributes}));return{isEmpty:o.totalQuantity===0||n.length===0,cartId:o.id,totalQuantity:o.totalQuantity,lines:n,cost:{totalAmount:o.cost.totalAmount,subtotalAmount:o.cost.subtotalAmount},discountCodes:o.discountCodes?.map(t=>({code:t.code||t,applicable:t.applicable!==!1})),checkoutUrl:o.checkoutUrl}}export{i as transformCartData};
+//# sourceMappingURL=cartTransformers.js.map

package/dist/esm/components/LiveChatWidget/utils/cartTransformers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/LiveChatWidget/utils/cartTransformers.ts"],
+  "sourcesContent": ["/**\n * \u8D2D\u7269\u8F66\u6570\u636E\u8F6C\u6362\u5DE5\u5177\n * \u5C06\u540E\u7AEF\u8FD4\u56DE\u7684 Shopify GraphQL \u683C\u5F0F\u8F6C\u6362\u4E3A\u524D\u7AEF\u6807\u51C6\u683C\u5F0F\n */\n\nimport type { BackendCartData, CartData, CartLine } from '../types'\n\n/**\n * \u8F6C\u6362\u540E\u7AEF\u8D2D\u7269\u8F66\u6570\u636E\u4E3A\u524D\u7AEF\u683C\u5F0F\n *\n * @param backendData \u540E\u7AEF\u8FD4\u56DE\u7684 Shopify GraphQL \u683C\u5F0F\u6570\u636E\n * @returns \u524D\u7AEF\u6807\u51C6\u5316\u7684\u8D2D\u7269\u8F66\u6570\u636E\n *\n * @example\n * ```typescript\n * const backendData = {\n *   id: \"gid://shopify/Cart/xxx\",\n *   lines: { edges: [{ node: {...} }] },\n *   cost: { totalAmount: {...}, subtotalAmount: {...} },\n *   ...\n * }\n *\n * const cartData = transformCartData(backendData)\n * // => { cartId: \"gid://shopify/Cart/xxx\", lines: [...], ... }\n * ```\n */\nexport function transformCartData(backendData: BackendCartData): CartData {\n  // \u8F6C\u6362\u5546\u54C1\u884C\u6570\u636E\uFF1A\u4ECE edges[].node \u7ED3\u6784\u8F6C\u4E3A\u6241\u5E73\u6570\u7EC4\n  const lines: CartLine[] = backendData.lines.edges.map(edge => ({\n    id: edge.node.id,\n    quantity: edge.node.quantity,\n    cost: {\n      totalAmount: edge.node.cost.totalAmount,\n      amountPerQuantity: edge.node.cost.amountPerQuantity,\n      subtotalAmount: edge.node.cost.subtotalAmount,\n    },\n    merchandise: {\n      id: edge.node.merchandise.id,\n      title: edge.node.merchandise.title,\n      price: edge.node.merchandise.price,\n      image: edge.node.merchandise.image\n        ? {\n            url: edge.node.merchandise.image.url,\n            altText: edge.node.merchandise.image.altText || undefined,\n          }\n        : undefined,\n      product: {\n        id: edge.node.merchandise.product.id,\n        title: edge.node.merchandise.product.title,\n        handle: edge.node.merchandise.product.handle,\n      },\n    },\n    attributes: edge.node.attributes,\n  }))\n\n  // \u8FD4\u56DE\u6807\u51C6\u5316\u7684\u8D2D\u7269\u8F66\u6570\u636E\n  return {\n    isEmpty: backendData.totalQuantity === 0 || lines.length === 0,\n    cartId: backendData.id,\n    totalQuantity: backendData.totalQuantity,\n    lines,\n    cost: {\n      totalAmount: backendData.cost.totalAmount,\n      subtotalAmount: backendData.cost.subtotalAmount,\n    },\n    discountCodes: backendData.discountCodes?.map((code: any) => ({\n      code: code.code || code,\n      applicable: code.applicable !== false,\n    })),\n    checkoutUrl: backendData.checkoutUrl,\n  }\n}\n"],
+  "mappings": "AA0BO,SAASA,EAAkBC,EAAwC,CAExE,MAAMC,EAAoBD,EAAY,MAAM,MAAM,IAAIE,IAAS,CAC7D,GAAIA,EAAK,KAAK,GACd,SAAUA,EAAK,KAAK,SACpB,KAAM,CACJ,YAAaA,EAAK,KAAK,KAAK,YAC5B,kBAAmBA,EAAK,KAAK,KAAK,kBAClC,eAAgBA,EAAK,KAAK,KAAK,cACjC,EACA,YAAa,CACX,GAAIA,EAAK,KAAK,YAAY,GAC1B,MAAOA,EAAK,KAAK,YAAY,MAC7B,MAAOA,EAAK,KAAK,YAAY,MAC7B,MAAOA,EAAK,KAAK,YAAY,MACzB,CACE,IAAKA,EAAK,KAAK,YAAY,MAAM,IACjC,QAASA,EAAK,KAAK,YAAY,MAAM,SAAW,MAClD,EACA,OACJ,QAAS,CACP,GAAIA,EAAK,KAAK,YAAY,QAAQ,GAClC,MAAOA,EAAK,KAAK,YAAY,QAAQ,MACrC,OAAQA,EAAK,KAAK,YAAY,QAAQ,MACxC,CACF,EACA,WAAYA,EAAK,KAAK,UACxB,EAAE,EAGF,MAAO,CACL,QAASF,EAAY,gBAAkB,GAAKC,EAAM,SAAW,EAC7D,OAAQD,EAAY,GACpB,cAAeA,EAAY,cAC3B,MAAAC,EACA,KAAM,CACJ,YAAaD,EAAY,KAAK,YAC9B,eAAgBA,EAAY,KAAK,cACnC,EACA,cAAeA,EAAY,eAAe,IAAKG,IAAe,CAC5D,KAAMA,EAAK,MAAQA,EACnB,WAAYA,EAAK,aAAe,EAClC,EAAE,EACF,YAAaH,EAAY,WAC3B,CACF",
+  "names": ["transformCartData", "backendData", "lines", "edge", "code"]
+}