import { jsx as _jsx } from "react/jsx-runtime";
import { ShortenedText } from "../../../ShortenedText/ShortenedText.js";
import { UiTabsBem } from "../bem.js";
import { getTypedUiTabsContextStore } from "../context.js";
/**
 * @internal
 */
export function DefaultUiTabsTabValue({ tab, isSelected }) {
    const store = getTypedUiTabsContextStore();
    const { maxLabelLength } = store.useContextStoreValues(["maxLabelLength"]);
    const isOverflowing = maxLabelLength !== undefined && tab.label.length > maxLabelLength;
    return (_jsx(ShortenedText, { className: UiTabsBem.e("label", { selected: isSelected, variant: tab.variant ?? "default" }), ellipsisPosition: "end", tagName: "div", tooltipAlignPoints: [{ align: "cl cr" }], children: isOverflowing && maxLabelLength !== undefined
            ? tab.label.substring(0, maxLabelLength) + "…"
            : tab.label }));
}
