import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2025-2026 GoodData Corporation
import { useLayoutEffect, useRef, useState } from "react";
import { bem } from "../@utils/bem.js";
import { ChipContent } from "./ChipContent.js";
import { ChipDeleteButton } from "./ChipDeleteButton.js";
const { b } = bem("gd-ui-kit-chip");
/**
 * @internal
 */
export function UiChip({ label, tag, isDeletable = false, isActive = false, isLocked = false, isExpandable = true, isDisabled = false, maxWidth, iconBefore, iconAfter, iconColor = "primary", onClick, onDelete, onKeyDown, onDeleteKeyDown, accessibilityConfig, dataTestId, buttonRef, renderChipContent, renderDeleteButton, }) {
    const [styleObj, setStyleObj] = useState();
    const defaultButtonRef = useRef(null);
    const effectiveButtonRef = buttonRef || defaultButtonRef;
    useLayoutEffect(() => {
        if (effectiveButtonRef.current) {
            // Reset width to auto to calculate the width of the label and tag
            effectiveButtonRef.current.style.width = "auto";
            const width = effectiveButtonRef.current.getBoundingClientRect().width;
            setStyleObj({ width });
        }
    }, [label, tag, effectiveButtonRef]);
    const { deleteAriaLabel, deleteAriaDescribedBy } = accessibilityConfig ?? {};
    const chipContent = (_jsx(ChipContent, { label: label, tag: tag, iconBefore: iconBefore, iconAfter: iconAfter, iconColor: iconColor, onClick: onClick, onKeyDown: onKeyDown, isActive: isActive, isLocked: isLocked, isExpandable: isExpandable, isDisabled: isDisabled, isDeletable: isDeletable, maxWidth: maxWidth, accessibilityConfig: accessibilityConfig, dataTestId: dataTestId, buttonRef: effectiveButtonRef, styleObj: styleObj }));
    const deleteButton = isDeletable ? (_jsx(ChipDeleteButton, { onDelete: onDelete, onDeleteKeyDown: onDeleteKeyDown, deleteAriaLabel: deleteAriaLabel, deleteAriaDescribedBy: deleteAriaDescribedBy, dataTestId: dataTestId })) : null;
    return (_jsxs("div", { className: b(), style: { maxWidth }, children: [renderChipContent ? renderChipContent(chipContent) : chipContent, deleteButton && renderDeleteButton ? renderDeleteButton(deleteButton) : deleteButton] }));
}
