/**
 * 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_util = require('../../utils/util.js');
const require_ConditionBuilderProvider = require('../../ConditionBuilderContext/ConditionBuilderProvider.js');
const require_useTranslations = require('../../utils/useTranslations.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");
let _carbon_react_icons = require("@carbon/react/icons");

//#region src/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.tsx
/**
* Copyright IBM Corp. 2024
*
* 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 ItemOption = ({ conditionState = {}, config = {}, onChange, closePopover, group }) => {
	const { popOverSearchThreshold } = (0, react.useContext)(require_ConditionBuilderProvider.ConditionBuilderContext);
	const contentRef = (0, react.useRef)(null);
	const [propertyText, clearSearchText] = require_useTranslations.useTranslations(["propertyText", "clearSearchText"]);
	const { conditionBuilderRef } = (0, react.useContext)(require_ConditionBuilderProvider.ConditionBuilderContext);
	const allOptions = config?.options;
	const [searchValue, setSearchValue] = (0, react.useState)("");
	const selection = conditionState.value;
	const filteredItems = searchValue ? allOptions?.filter((opt) => opt.label?.toLowerCase().includes(searchValue.toLowerCase())) : allOptions;
	(0, react.useEffect)(() => {
		if (contentRef.current) {
			const firstFocusableElement = contentRef.current?.querySelector("input, button,li");
			if (firstFocusableElement) firstFocusableElement.focus();
		}
	}, [allOptions]);
	const onClickHandler = (evt, option) => {
		if (!evt.currentTarget.hasAttribute("aria-disabled")) onChange(option.id, evt);
	};
	const onSearchChangeHandler = (evt) => {
		const { value } = evt.target;
		setSearchValue(value);
	};
	const getAriaLabel = () => {
		return conditionState.label ? conditionState.label : propertyText;
	};
	const getStatementContent = (option) => {
		return /* @__PURE__ */ react.default.createElement("div", { className: `${require_util.blockClass}__statement_wrapper` }, /* @__PURE__ */ react.default.createElement("div", null, option.label, " (", option.connector, ")"), /* @__PURE__ */ react.default.createElement("div", null, option.secondaryLabel));
	};
	if (!allOptions) return;
	return /* @__PURE__ */ react.default.createElement("div", {
		className: `${require_util.blockClass}__item-option`,
		ref: contentRef
	}, allOptions.length > popOverSearchThreshold ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_util.blockClass}__item-option__search` }, /* @__PURE__ */ react.default.createElement(_carbon_react.Search, {
		size: "sm",
		labelText: clearSearchText,
		closeButtonLabelText: clearSearchText,
		onChange: onSearchChangeHandler,
		onKeyDown: (evt) => {
			require_util.onKeyDownHandlerForSearch(evt, conditionBuilderRef, closePopover);
		}
	})) : null, /* @__PURE__ */ react.default.createElement("ul", {
		"aria-label": getAriaLabel(),
		role: "listbox"
	}, filteredItems?.map((option) => {
		const isSelected = selection === option.id;
		const Icon = option.icon;
		const disabled = option?.getIsDisabled?.({
			conditionState,
			group
		});
		const hidden = option?.getIsHidden?.({
			conditionState,
			group
		});
		return /* @__PURE__ */ react.default.createElement("li", {
			tabIndex: 0,
			key: option.id,
			role: "option",
			"aria-selected": isSelected,
			className: `${require_util.blockClass}__item-option__option`,
			onKeyUp: () => {
				return false;
			},
			onClick: (evt) => onClickHandler(evt, option),
			...disabled ? { "aria-disabled": "true" } : {},
			...hidden ? { "aria-hidden": "true" } : {}
		}, /* @__PURE__ */ react.default.createElement("div", { className: `${require_util.blockClass}__item-option__option-content` }, /* @__PURE__ */ react.default.createElement("span", { className: `${require_util.blockClass}__item-option__option-label` }, Icon && /* @__PURE__ */ react.default.createElement(Icon, null), /* @__PURE__ */ react.default.createElement("span", {
			className: `${require_util.blockClass}__item-option__option-label-text`,
			title: option.label
		}, config?.isStatement ? getStatementContent(option) : option.label)), isSelected && /* @__PURE__ */ react.default.createElement(_carbon_react_icons.Checkmark, { className: `${require_util.blockClass}__checkmark` })));
	})));
};
ItemOption.propTypes = {
	conditionState: prop_types.default.object,
	config: prop_types.default.object,
	onChange: prop_types.default.func
};

//#endregion
exports.ItemOption = ItemOption;