/**
 * 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 { getDevtoolsProps } from "../../global/js/utils/devtools.js";
import React, { useEffect, useState } from "react";
import PropTypes from "prop-types";
import { Button, MultiSelect, Search } from "@carbon/react";

//#region src/components/SearchBar/SearchBar.tsx
/**
* Copyright IBM Corp. 2024, 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.
*/
var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
const blockClass = `${pkg.prefix}--search-bar`;
const componentName = "SearchBar";
const defaults = {
	onSubmit: () => {},
	onChange: () => {},
	scopes: [],
	selectedScopes: [],
	hideScopesLabel: true
};
const SearchBar = React.forwardRef(({ className, clearButtonLabelText, hideScopesLabel = defaults.hideScopesLabel, labelText, onChange = defaults.onChange, onSubmit = defaults.onSubmit, placeholderText, scopes = [], scopesTypeLabel, scopeToString, selectedScopes = [], sortItems, submitLabel, translateWithId, value, ...rest }, ref) => {
	const [text, setText] = useState(value || "");
	const [_selectedScopes, setSelectedScopes] = useState(selectedScopes || []);
	const [isInputDirty, setIsInputDirty] = useState(false);
	useEffect(() => {
		if (!text || !text.length) setIsInputDirty(false);
		else setIsInputDirty(true);
	}, [text]);
	/**
	* Handler for form submit that calls onSubmit prop.
	* @param {Event} event Submit event generated.
	*/
	const handleSubmit = (event) => {
		event.preventDefault();
		const eventObject = { value: text };
		if (scopes.length > 0) eventObject.selectedScopes = _selectedScopes;
		onSubmit(eventObject);
	};
	/**
	* Handler for when scope selection changes that calls onChangeProp.
	* @param {{selectedItems: Array<any>}} {selectedItems} Object containing array of selected items.
	*/
	const handleSearchScopeChange = ({ selectedItems }) => {
		setSelectedScopes(selectedItems);
		onChange({
			selectedScopes: selectedItems,
			value: text
		});
	};
	/**
	* Handler for search input changes that calls onChange prop.
	* @param {KeyboardEvent} event Event object from input change.
	*/
	const handleInputChange = (event) => {
		const { value } = event.target;
		const eventObject = { value };
		if (scopes.length > 0) eventObject.selectedScopes = selectedScopes;
		setText(value);
		onChange(eventObject);
	};
	const multiSelectProps = {
		initialSelectedItems: selectedScopes,
		items: scopes,
		itemToString: scopeToString,
		label: scopesTypeLabel,
		sortItems,
		translateWithId
	};
	return /* @__PURE__ */ React.createElement("form", {
		...rest,
		ref,
		...getDevtoolsProps(componentName),
		className: (0, import_classnames.default)(blockClass, className, { [`${blockClass}--hide-scopes-label`]: hideScopesLabel }),
		onSubmit: handleSubmit
	}, scopes?.length ? /* @__PURE__ */ React.createElement(MultiSelect, {
		...multiSelectProps,
		id: `${blockClass}__multi-select`,
		className: `${blockClass}__scopes`,
		onChange: handleSearchScopeChange,
		size: "lg"
	}) : null, /* @__PURE__ */ React.createElement(Search, {
		className: `${blockClass}__input`,
		closeButtonLabelText: clearButtonLabelText,
		labelText,
		name: "search-input",
		onChange: handleInputChange,
		placeholder: placeholderText,
		value: text,
		size: "lg"
	}), /* @__PURE__ */ React.createElement(Button, {
		name: "search-submit",
		kind: "primary",
		type: "submit",
		className: `${blockClass}__submit`,
		disabled: !isInputDirty
	}, submitLabel));
});
SearchBar.displayName = componentName;
const conditionalScopePropValidator = (props, propName, componentName, ...rest) => {
	if (props.scopes && props.scopes.length > 0 && !props[propName]) return /* @__PURE__ */ new Error(`Required \`${propName}\` when \`scopes\` prop type is supplied to \`${componentName}\`. Validation failed.`);
	/**@ts-ignore */
	return PropTypes.string(props, propName, componentName, ...rest);
};
const deprecatedProps = { titleText: PropTypes.string };
SearchBar.propTypes = {
	className: PropTypes.string,
	clearButtonLabelText: PropTypes.string.isRequired,
	hideScopesLabel: PropTypes.bool,
	labelText: PropTypes.string.isRequired,
	onChange: PropTypes.func,
	onSubmit: PropTypes.func,
	placeholderText: PropTypes.string.isRequired,
	scopeToString: PropTypes.func,
	scopes: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.object])),
	scopesTypeLabel: conditionalScopePropValidator,
	selectedScopes: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.object])),
	sortItems: PropTypes.func,
	submitLabel: PropTypes.string.isRequired,
	translateWithId: PropTypes.func,
	value: PropTypes.string,
	...deprecatedProps
};

//#endregion
export { SearchBar };