azure-devops-ui
Version:
React components for building web UI in Azure DevOps
26 lines (25 loc) • 1.41 kB
JavaScript
import { __rest } from "tslib";
import "../../CommonImports";
import "../../Core/core.css";
import "./Dropdown.css";
import * as React from "react";
import { ExpandableButton } from '../../Button';
export function DropdownExpandableButton(props) {
var _a, _b;
const { expandableRef, items, placeholder, renderSelectedItems, selection, tooltipProps } = props, rest = __rest(props, ["expandableRef", "items", "placeholder", "renderSelectedItems", "selection", "tooltipProps"]);
let text = placeholder;
if (selection.selectedCount > 0) {
text = renderSelectedItems(selection, items);
}
return (React.createElement(ExpandableButton, Object.assign({ ref: expandableRef }, rest, { tooltipProps: Object.assign({ overflowOnly: (_b = (_a = props.tooltipProps) === null || _a === void 0 ? void 0 : _a.overflowOnly) !== null && _b !== void 0 ? _b : true, overflowDetected }, props.tooltipProps) }),
React.createElement("div", { className: "bolt-dropdown-expandable-button-label justify-start flex-grow text-ellipsis" },
props.children,
text)));
}
function overflowDetected(anchorElement) {
const overflowElement = anchorElement.querySelector(".bolt-dropdown-expandable-button-label");
if (overflowElement) {
return overflowElement.scrollWidth > Math.ceil(overflowElement.offsetWidth);
}
return false;
}