import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2007-2025 GoodData Corporation
import { memo } from "react";
import { getColorStyle } from "../utils.js";
export const ColorsPreview = memo(function ColorsPreview({ currentHslColor, draftHslColor, currentTextLabel = "current", draftTextLabel = "new", }) {
    return (_jsxs("div", { className: "color-picker-preview", children: [
            _jsx(ColorItem, { id: "current-color", hslColor: currentHslColor, textLabel: currentTextLabel }), _jsx(ColorItem, { id: "new-color", hslColor: draftHslColor, textLabel: draftTextLabel })
        ] }));
});
const ColorItem = memo(function ColorItem({ id, hslColor, textLabel }) {
    return (_jsxs("div", { className: "color-picker-value-wrapper", children: [
            _jsx("div", { "aria-label": id, className: `color-value s-${id}`, style: getColorStyle(hslColor) }), _jsx("span", { children: textLabel })
        ] }));
});
