/**
 * 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.
 */

import { __toESM } from "../../_virtual/_rolldown/runtime.js";
import { require_classnames } from "../../node_modules/classnames/index.js";
import { pkg } from "../../settings.js";
import { prepareProps } from "../../global/js/utils/props-helper.js";
import { usePortalTarget } from "../../global/js/hooks/usePortalTarget.js";
import React, { useEffect, useState } from "react";
import PropTypes from "prop-types";
import { ComposedModal, ModalBody, ModalHeader, Search, Tag } from "@carbon/react";

//#region src/components/TagSet/TagSetModal.tsx
var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
const componentName = "TagSetModal";
const blockClass = `${pkg.prefix}--tag-set-modal`;
const defaults = {
	modalAriaLabel: "List of all tags",
	searchLabel: ""
};
const TagSetModal = ({ allTags, className, title, modalAriaLabel = defaults.modalAriaLabel, onClose, open, portalTarget: portalTargetIn, searchLabel = defaults.searchLabel, searchPlaceholder, ...rest }) => {
	const [filteredModalTags, setFilteredModalTags] = useState([]);
	const [search, setSearch] = useState("");
	const renderPortalUse = usePortalTarget(portalTargetIn);
	useEffect(() => {
		let newFilteredModalTags = [];
		if (open) if (search === "" && allTags) newFilteredModalTags = allTags?.slice(0);
		else {
			const lCaseSearch = search.toLocaleLowerCase();
			allTags?.forEach((tag) => {
				const dataSearch = tag["data-search"]?.toLocaleLowerCase()?.indexOf(lCaseSearch);
				const labelSearch = tag.label?.toLocaleLowerCase()?.indexOf(lCaseSearch);
				if (dataSearch > -1 || labelSearch > -1) newFilteredModalTags.push(tag);
			});
		}
		setFilteredModalTags(newFilteredModalTags);
	}, [
		allTags,
		open,
		search
	]);
	const handleSearch = (ev) => {
		setSearch(ev.target.value || "");
	};
	return renderPortalUse(/* @__PURE__ */ React.createElement(ComposedModal, {
		...rest,
		containerClassName: `${blockClass}__container`,
		className: (0, import_classnames.default)(className, `${blockClass}`),
		size: "sm",
		open,
		onClose
	}, /* @__PURE__ */ React.createElement(ModalHeader, {
		className: `${blockClass}__header`,
		closeModal: onClose,
		title
	}, /* @__PURE__ */ React.createElement(Search, {
		"data-modal-primary-focus": true,
		className: `${blockClass}__search`,
		labelText: searchLabel,
		placeholder: searchPlaceholder,
		onChange: handleSearch,
		size: "lg"
	})), /* @__PURE__ */ React.createElement(ModalBody, {
		className: `${blockClass}__body`,
		hasForm: true,
		hasScrollingContent: true,
		"aria-label": modalAriaLabel
	}, filteredModalTags.map(({ label, ...other }, index) => /* @__PURE__ */ React.createElement(Tag, {
		...other,
		key: `all-tags-${index}`
	}, label)), /* @__PURE__ */ React.createElement("div", { className: `${blockClass}__fade` }))));
};
TagSetModal.propTypes = {
	allTags: PropTypes.arrayOf(PropTypes.shape({
		...prepareProps(Tag.propTypes, "filter"),
		label: PropTypes.string.isRequired
	})),
	className: PropTypes.string,
	onClose: PropTypes.func,
	open: PropTypes.bool,
	portalTarget: PropTypes.node,
	searchLabel: PropTypes.string,
	searchPlaceholder: PropTypes.string,
	title: PropTypes.string
};
TagSetModal.displayName = componentName;

//#endregion
export { TagSetModal };