/**
 * Copyright IBM Corp. 2020, 2026
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

const require_runtime = require('../../_virtual/_rolldown/runtime.js');
const require_index = require('../../node_modules/classnames/index.js');
const require_settings = require('../../settings.js');
const require_useClickOutside = require('../../global/js/hooks/useClickOutside.js');
let react = require("react");
react = require_runtime.__toESM(react);
let prop_types = require("prop-types");
prop_types = require_runtime.__toESM(prop_types);
let _carbon_react = require("@carbon/react");

//#region src/components/TagOverflow/TagOverflowPopover.tsx
var import_classnames = /* @__PURE__ */ require_runtime.__toESM(require_index.default);
const componentName = "TagOverflowPopover";
const blockClass = `${require_settings.pkg.prefix}--tag-overflow-popover`;
const TagOverflowPopover = (0, react.forwardRef)((props, ref) => {
	const { allTagsModalSearchThreshold, autoAlign, className, onShowAllClick, overflowAlign, overflowTags, overflowType, showAllTagsLabel, popoverOpen, setPopoverOpen, ...rest } = props;
	const localRef = (0, react.useRef)(null);
	const overflowTagContent = (0, react.useRef)(null);
	require_useClickOutside.useClickOutside(ref || localRef, () => {
		if (popoverOpen) setPopoverOpen?.(false);
	});
	const handleShowAllTagsClick = (evt) => {
		evt.stopPropagation();
		evt.preventDefault();
		setPopoverOpen?.(false);
		onShowAllClick?.();
	};
	const handleEscKeyPress = (evt) => {
		const { key } = evt;
		if (key === "Escape") setPopoverOpen?.(false);
	};
	const getOverflowPopoverItems = () => {
		const thresh = allTagsModalSearchThreshold ?? 0;
		return overflowTags?.filter((_, index) => overflowTags?.length > thresh ? index < thresh : index <= thresh);
	};
	const visibleItems = getOverflowPopoverItems();
	const hasItems = visibleItems?.length > 0;
	return /* @__PURE__ */ react.default.createElement("span", {
		...rest,
		"aria-hidden": overflowTags?.length === 0,
		className: (0, import_classnames.default)(blockClass, { [`${blockClass}--hidden`]: overflowTags?.length === 0 }),
		ref: ref || localRef
	}, /* @__PURE__ */ react.default.createElement(_carbon_react.Popover, {
		align: overflowAlign,
		autoAlign,
		className: (0, import_classnames.default)(className, `${blockClass}__el`),
		dropShadow: true,
		highContrast: true,
		onKeyDown: handleEscKeyPress,
		open: popoverOpen || false
	}, /* @__PURE__ */ react.default.createElement(_carbon_react.OperationalTag, {
		onClick: () => setPopoverOpen?.(!popoverOpen),
		className: (0, import_classnames.default)(`${blockClass}__trigger`),
		text: `+${overflowTags.length}`,
		"aria-expanded": popoverOpen,
		"aria-controls": `${require_settings.pkg.prefix}-overflow-content`
	}), /* @__PURE__ */ react.default.createElement(_carbon_react.PopoverContent, {
		id: `${require_settings.pkg.prefix}-overflow-content`,
		"aria-hidden": !popoverOpen
	}, /* @__PURE__ */ react.default.createElement("div", {
		ref: overflowTagContent,
		className: `${blockClass}__content`
	}, /* @__PURE__ */ react.default.createElement("ul", { className: `${blockClass}__tag-list` }, hasItems && visibleItems.map(({ label, id, tagType, filter, onClose, ...other }) => {
		const typeValue = overflowType === "tag" ? "high-contrast" : tagType;
		const isFilterable = overflowType === "tag" && (typeof onClose === "function" || filter);
		let tag;
		if (isFilterable) tag = /* @__PURE__ */ react.default.createElement(_carbon_react.DismissibleTag, {
			...other,
			onClose: () => onClose?.(),
			type: typeValue,
			text: label
		});
		else tag = /* @__PURE__ */ react.default.createElement(_carbon_react.Tag, {
			...other,
			type: typeValue
		}, label);
		return /* @__PURE__ */ react.default.createElement("li", {
			className: (0, import_classnames.default)(`${blockClass}__tag-item`, {
				[`${blockClass}__tag-item--default`]: overflowType === "default",
				[`${blockClass}__tag-item--tag`]: overflowType === "tag"
			}),
			key: id
		}, overflowType === "tag" ? tag : label);
	})), (overflowTags?.length ?? 0) > (allTagsModalSearchThreshold ?? 0) && /* @__PURE__ */ react.default.createElement(_carbon_react.Link, {
		className: `${blockClass}__show-all-tags-link`,
		href: "",
		onClick: handleShowAllTagsClick,
		role: "button"
	}, showAllTagsLabel)))));
});
TagOverflowPopover.displayName = componentName;
TagOverflowPopover.propTypes = {
	allTagsModalSearchThreshold: prop_types.default.number,
	autoAlign: prop_types.default.bool,
	className: prop_types.default.string,
	onShowAllClick: prop_types.default.func.isRequired,
	overflowAlign: prop_types.default.oneOf([
		"top",
		"top-left",
		"top-right",
		"bottom",
		"bottom-left",
		"bottom-right",
		"left",
		"left-bottom",
		"left-top",
		"right",
		"right-bottom",
		"right-top"
	]),
	overflowTags: prop_types.default.arrayOf(prop_types.default.object).isRequired,
	overflowType: prop_types.default.oneOf(["default", "tag"]),
	popoverOpen: prop_types.default.bool,
	setPopoverOpen: prop_types.default.func,
	showAllTagsLabel: prop_types.default.string
};

//#endregion
exports.TagOverflowPopover = TagOverflowPopover;