/**
 * ActionButtons – card action buttons (add to cart, wishlist, buy now, quick view)
 *
 * Renders a set of action buttons for product cards. Can be positioned absolutely
 * over the image (on hover) or inline below the card content.
 */
import React, { useEffect } from "react";
import { clsx } from "clsx";
import { ensureSeekoraStyles } from "../../styles/inject";
import { trackObjectConverted, trackObjectConvertedOutsideSearch, trackProductAdded, emitFilterConvertedForActiveFilters, } from "@seekora-ai/search-sdk";
import { useTrackContext } from "../SearchProvider";
/** Surfaces that route conversions through the search-attributed events. */
const SEARCH_ATTRIBUTED_SURFACES = new Set(["results_page", "dropdown"]);
const SPACING = {
    xs: 4,
    sm: 8,
    md: 12,
    lg: 16,
    xl: 24,
};
const TRANSITIONS = {
    fast: "150ms ease-in-out",
    normal: "200ms ease-in-out",
    slow: "300ms ease-in-out",
};
const BORDER_RADIUS = {
    sm: 4,
    md: 6,
    lg: 8,
    full: 9999,
};
const SHADOWS = {
    sm: "0 1px 2px rgba(0,0,0,0.05)",
    md: "0 2px 4px rgba(0,0,0,0.1)",
    lg: "0 4px 6px rgba(0,0,0,0.1)",
    xl: "0 10px 15px rgba(0,0,0,0.1)",
};
const DEFAULT_ICONS = {
    addToCart: "🛒",
    wishlist: "♡",
    buyNow: "⚡",
    quickView: "👁",
    compare: "⚖",
};
const DEFAULT_LABELS = {
    addToCart: "Add to Cart",
    wishlist: "Wishlist",
    buyNow: "Buy Now",
    quickView: "Quick View",
    compare: "Compare",
};
const BUTTON_SIZES = {
    small: { width: 44, height: 44, fontSize: "0.75rem", iconSize: "1rem" },
    medium: { width: 44, height: 44, fontSize: "0.875rem", iconSize: "1.25rem" },
    large: { width: 44, height: 44, fontSize: "1rem", iconSize: "1.5rem" },
};
export function ActionButtons({ buttons, layout = "horizontal", position = "inline", showLabels = false, size = "medium", className, style, objectId, objectType = "product", surface = "results_page", searchId, price, currency = "USD", productName, trackingEnabled = true, }) {
    useEffect(() => {
        ensureSeekoraStyles();
    }, []);
    const ctx = useTrackContext();
    const sizeConfig = BUTTON_SIZES[size];
    const isOverlay = position !== "inline";
    const isSearchAttributed = SEARCH_ATTRIBUTED_SURFACES.has(surface);
    // Map an ActionButton type to its V4 emission. `compare` is not a
    // V4 event — return null so the click is just the consumer's
    // onClick. Everything else fires its canonical event (using the
    // single-element `object_ids[]` / `object_data[]` array wire shape
    // mandated by the V4 schema cascade), then fans out one Filter
    // Converted per active filter.
    const fireV4ForAction = (type) => {
        if (!trackingEnabled || !ctx || !objectId)
            return;
        try {
            // Build the per-line object_data entry. Single-line conversions
            // still ship as a 1-element array per the cascade's wire shape.
            const dataItem = { object_type: objectType };
            if (productName)
                dataItem.name = productName;
            if (price !== undefined)
                dataItem.price = price;
            if (currency)
                dataItem.currency = currency;
            switch (type) {
                case "addToCart":
                case "buyNow": {
                    // Product Added — Algolia-derived wire shape: object_ids[]
                    // (single line for an action-button surface) + object_data[]
                    // carries price / quantity / name. `quantity` lives inside
                    // object_data per the V4 ProductAddedProperties schema.
                    const productDataItem = {
                        ...dataItem,
                        quantity: 1,
                    };
                    const payload = {
                        object_ids: [objectId],
                        object_data: [productDataItem],
                        surface,
                    };
                    if (searchId)
                        payload.search_id = searchId;
                    trackProductAdded(ctx, payload);
                    emitFilterConvertedForActiveFilters(ctx, {
                        conversion_type: "addToCart",
                        ...(price !== undefined ? { value: price } : {}),
                        currency,
                        ...(searchId ? { search_id: searchId } : {}),
                    });
                    return;
                }
                case "wishlist":
                case "quickView": {
                    const conversionType = type === "wishlist" ? "wishlist" : "quick_view";
                    const payload = {
                        object_ids: [objectId],
                        object_data: [dataItem],
                        conversion_type: conversionType,
                        surface,
                    };
                    if (searchId)
                        payload.search_id = searchId;
                    if (isSearchAttributed) {
                        trackObjectConverted(ctx, payload);
                    }
                    else {
                        trackObjectConvertedOutsideSearch(ctx, payload);
                    }
                    emitFilterConvertedForActiveFilters(ctx, {
                        conversion_type: conversionType,
                        ...(price !== undefined ? { value: price } : {}),
                        currency,
                        ...(searchId ? { search_id: searchId } : {}),
                    });
                    return;
                }
                case "compare":
                default:
                    return;
            }
        }
        catch {
            // Analytics must never break the action.
        }
    };
    const handleClick = (btn, e) => {
        e.stopPropagation();
        e.preventDefault();
        if (btn.disabled || btn.loading)
            return;
        // V4 emission first so any synchronous navigation in onClick
        // doesn't race the analytics dispatch.
        fireV4ForAction(btn.type);
        if (btn.onClick) {
            btn.onClick(e);
        }
    };
    return (React.createElement("div", { className: clsx("seekora-action-buttons", `seekora-action-buttons--${layout}`, className), "data-position": isOverlay ? position : undefined, style: style }, buttons.map((btn, i) => {
        const icon = btn.icon ?? DEFAULT_ICONS[btn.type];
        const label = btn.label ?? DEFAULT_LABELS[btn.type];
        return (React.createElement("button", { key: i, type: "button", className: clsx("seekora-action-button", `seekora-action-button--${btn.type}`, btn.disabled && "seekora-action-button--disabled", btn.loading && "seekora-action-button--loading"), "data-size": size, "data-labels": showLabels ? "true" : undefined, onClick: (e) => handleClick(btn, e), disabled: btn.disabled, "aria-label": label, title: label }, btn.loading ? (React.createElement("span", { className: "seekora-action-button__icon" }, "\u23F3")) : (React.createElement(React.Fragment, null,
            React.createElement("span", { className: "seekora-action-button__icon" }, icon),
            showLabels && (React.createElement("span", { className: "seekora-action-button__label" }, label))))));
    })));
}
