/**
 * BadgeList – renders product badges (sale, new, sold out, custom)
 */
import React from 'react';
import { clsx } from 'clsx';
const SPACING = {
    xs: 4,
    sm: 8,
    md: 12,
    lg: 16,
    xl: 24,
};
const BORDER_RADIUS = {
    sm: 4,
    md: 6,
    lg: 8,
    full: 9999,
};
// Z-index scale for consistent layering
const Z_INDEX = {
    dropdown: 100,
    modal: 200,
    overlay: 300,
    tooltip: 50,
};
const positionStyles = {
    'top-left': { position: 'absolute', top: SPACING.sm, left: SPACING.sm },
    'top-right': { position: 'absolute', top: SPACING.sm, right: SPACING.sm },
    'bottom-left': { position: 'absolute', bottom: SPACING.sm, left: SPACING.sm },
    'bottom-right': { position: 'absolute', bottom: SPACING.sm, right: SPACING.sm },
    inline: {},
};
const typeColors = {
    sale: { bg: 'var(--seekora-badge-sale-bg, #ef4444)', text: 'var(--seekora-badge-sale-text, #fff)' },
    new: { bg: 'var(--seekora-badge-new-bg, #3b82f6)', text: 'var(--seekora-badge-new-text, #fff)' },
    soldOut: { bg: 'var(--seekora-badge-soldout-bg, #6b7280)', text: 'var(--seekora-badge-soldout-text, #fff)' },
    limited: { bg: 'var(--seekora-badge-limited-bg, #f59e0b)', text: 'var(--seekora-badge-limited-text, #fff)' },
    custom: { bg: 'var(--seekora-badge-custom-bg, #111827)', text: 'var(--seekora-badge-custom-text, #fff)' },
};
export function BadgeList({ badges, maxBadges, position = 'top-left', className, style, }) {
    if (!badges || badges.length === 0)
        return null;
    const visible = maxBadges ? badges.slice(0, maxBadges) : badges;
    return (React.createElement("div", { className: clsx('seekora-badge-list', className), style: {
            display: 'flex',
            flexWrap: 'wrap',
            gap: SPACING.xs,
            zIndex: 2,
            ...positionStyles[position],
            ...style,
        } }, visible.map((badge, i) => {
        const colors = typeColors[badge.type ?? 'custom'];
        return (React.createElement("span", { key: `${badge.text}-${i}`, className: clsx('seekora-badge', badge.type && `seekora-badge--${badge.type === 'soldOut' ? 'sold-out' : badge.type}`), style: {
                display: 'inline-block',
                padding: '2px 8px',
                borderRadius: BORDER_RADIUS.sm,
                fontSize: '0.6875rem',
                fontWeight: 600,
                lineHeight: 1.2,
                backgroundColor: badge.color ?? colors.bg,
                color: badge.textColor ?? colors.text,
                whiteSpace: 'nowrap',
            } }, badge.text));
    })));
}
