/**
 * 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_useWindowResize = require("../../../../../global/js/hooks/useWindowResize.js");
const require_useClickOutside = require("../../../../../global/js/hooks/useClickOutside.js");
const require_ActionSet = require("../../../../ActionSet/ActionSet.js");
const require_constants = require("./constants.js");
const require_FilterProvider = require("./FilterProvider.js");
const require_useSubscribeToEventEmitter = require("./hooks/useSubscribeToEventEmitter.js");
const require_useFilters = require("./hooks/useFilters.js");
const require_useShouldDisableButtons = require("./hooks/useShouldDisableButtons.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");
let _carbon_layout = require("@carbon/layout");
//#region src/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.jsx
/**
* Copyright IBM Corp. 2022, 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__ */ require_runtime.__toESM(require_index.default);
const componentClass = `${`${require_settings.pkg.prefix}--datagrid`}-filter-flyout`;
const defaults = {
	flyoutIconDescription: "Open filters",
	title: "Filter",
	primaryActionLabel: "Apply",
	secondaryActionLabel: "Cancel",
	align: "bottom"
};
const emptyArray = [];
const FilterFlyout = ({ updateMethod, flyoutIconDescription = defaults.flyoutIconDescription, align = defaults.align, filters = emptyArray, title = defaults.title, primaryActionLabel = defaults.primaryActionLabel, onFlyoutOpen = () => {}, onFlyoutClose = () => {}, onApply = () => {}, onCancel = () => {}, secondaryActionLabel = defaults.secondaryActionLabel, setAllFilters, data = emptyArray, reactTableFiltersState = emptyArray }) => {
	/** State */
	const [open, setOpen] = (0, react.useState)(false);
	const [stackedLayout, setStackedLayout] = (0, react.useState)(false);
	const handleCancel = () => {
		setOpen(false);
		onCancel();
	};
	const { filtersState, prevFiltersObjectArrayRef, prevFiltersRef, cancel, reset, renderFilter, filtersObjectArray, lastAppliedFilters } = require_useFilters.default({
		updateMethod,
		filters,
		setAllFilters,
		variation: require_constants.FLYOUT,
		reactTableFiltersState,
		onCancel: handleCancel
	});
	const { width } = _carbon_layout.breakpoints.md;
	const mdPxWidth = parseInt(width) * 16;
	/** Refs */
	const filterFlyoutRef = (0, react.useRef)(null);
	const flyoutInnerRef = (0, react.useRef)(null);
	const flyoutFiltersContainerRef = (0, react.useRef)(null);
	/** State from hooks */
	const [shouldDisableButtons, setShouldDisableButtons] = require_useShouldDisableButtons.default({
		initialValue: true,
		filtersState,
		prevFiltersRef,
		open
	});
	/* istanbul ignore next */
	const handleResize = (current) => {
		const filterFlyoutRefPosition = flyoutInnerRef?.current.getBoundingClientRect();
		const originalFlyoutWidth = parseInt(window.getComputedStyle(flyoutInnerRef?.current).getPropertyValue("width"));
		if (Math.sign(filterFlyoutRefPosition.left) === -1) {
			const newFlyoutWidth = originalFlyoutWidth - Math.abs(filterFlyoutRefPosition.left);
			flyoutInnerRef.current.style.width = (0, _carbon_layout.px)(newFlyoutWidth);
		}
		if (originalFlyoutWidth < 642 && Math.sign(filterFlyoutRefPosition.left) === 1 || Math.sign(filterFlyoutRefPosition.left).toString() === "0") {
			const newFlyoutWidth = originalFlyoutWidth + Math.abs(filterFlyoutRefPosition.left);
			flyoutInnerRef.current.style.width = (0, _carbon_layout.px)(newFlyoutWidth);
		}
		if (current?.innerWidth <= mdPxWidth + 254) setStackedLayout(true);
		else setStackedLayout(false);
	};
	require_useWindowResize.useWindowResize(({ current }) => {
		handleResize(current);
	});
	/** Context */
	const { dispatch: localDispatch } = (0, react.useContext)(require_FilterProvider.FilterContext);
	/** Memos */
	const showActionSet = updateMethod === require_constants.BATCH;
	const carbonPrefix = (0, _carbon_react.usePrefix)();
	/** Methods */
	const openFlyout = () => {
		setOpen(true);
		onFlyoutOpen();
	};
	const closeFlyout = () => {
		setOpen(false);
		onFlyoutClose();
		flyoutInnerRef.current.style.width = (0, _carbon_layout.px)(642);
	};
	(0, react.useEffect)(() => {
		flyoutInnerRef.current.style.width = (0, _carbon_layout.px)(642);
	}, []);
	const apply = () => {
		setAllFilters(filtersObjectArray);
		closeFlyout();
		onApply({
			filtersState,
			filtersObjectArray,
			lastAppliedFilters
		});
		setShouldDisableButtons(true);
		prevFiltersRef.current = JSON.stringify(filtersState);
		prevFiltersObjectArrayRef.current = JSON.stringify(filtersObjectArray);
		lastAppliedFilters.current = JSON.stringify(filtersObjectArray);
		localDispatch({
			type: require_constants.SAVED_FILTERS,
			payload: { savedFilters: filtersObjectArray }
		});
	};
	/** Renders all filters */
	const renderFilters = () => filters.map(renderFilter);
	const renderActionSet = () => {
		return showActionSet && /* @__PURE__ */ react.default.createElement(require_ActionSet.ActionSet, {
			actions: [{
				key: 1,
				kind: "primary",
				label: primaryActionLabel,
				onClick: apply,
				isExpressive: false,
				disabled: shouldDisableButtons
			}, {
				key: 3,
				kind: "secondary",
				label: secondaryActionLabel,
				onClick: cancel,
				isExpressive: false
			}],
			size: "md",
			buttonSize: "md"
		});
	};
	/** Effects */
	require_useClickOutside.useClickOutside(filterFlyoutRef, (target) => {
		const hasClickedOnDatePicker = target.closest(".flatpickr-calendar");
		const hasClickedOnDropdown = target.className === `${carbonPrefix}--list-box__menu-item__option`;
		if (!open || hasClickedOnDatePicker || hasClickedOnDropdown) return;
		closeFlyout();
		cancel();
	});
	require_useSubscribeToEventEmitter.default(require_constants.CLEAR_FILTERS, (tableId) => {
		reset(tableId);
	});
	return /* @__PURE__ */ react.default.createElement("div", {
		className: `${componentClass}__container`,
		ref: filterFlyoutRef
	}, /* @__PURE__ */ react.default.createElement(_carbon_react.IconButton, {
		label: flyoutIconDescription,
		kind: "ghost",
		align,
		onClick: open ? closeFlyout : openFlyout,
		className: (0, import_classnames.default)(`${componentClass}__trigger`, { [`${componentClass}__trigger--open`]: open }),
		disabled: data.length === 0
	}, /* @__PURE__ */ react.default.createElement(_carbon_react_icons.Filter, null)), /* @__PURE__ */ react.default.createElement("div", {
		className: (0, import_classnames.default)(componentClass, {
			[`${componentClass}--open`]: open,
			[`${componentClass}--batch`]: showActionSet,
			[`${componentClass}--instant`]: !showActionSet
		}),
		ref: flyoutInnerRef
	}, /* @__PURE__ */ react.default.createElement("div", { className: `${componentClass}__inner-container` }, /* @__PURE__ */ react.default.createElement("span", { className: `${componentClass}__title` }, title), /* @__PURE__ */ react.default.createElement("div", {
		className: (0, import_classnames.default)(`${componentClass}__filters`, { [`${componentClass}__stacked`]: stackedLayout }),
		ref: flyoutFiltersContainerRef
	}, renderFilters())), renderActionSet()));
};
FilterFlyout.propTypes = {
	/**
	* Tooltip alignment for the filter button
	*/
	align: prop_types.default.string,
	/**
	* All data rows in the table
	*/
	data: prop_types.default.array.isRequired,
	/**
	* Array of filters to render
	*/
	filters: prop_types.default.arrayOf(prop_types.default.shape({
		type: prop_types.default.string.isRequired,
		column: prop_types.default.string.isRequired,
		props: prop_types.default.object.isRequired
	})).isRequired,
	/**
	* Icon description for the filter flyout button
	*/
	flyoutIconDescription: prop_types.default.string,
	/**
	* Callback when the apply button is clicked
	*/
	onApply: prop_types.default.func,
	/**
	* Callback when the cancel button is clicked
	*/
	onCancel: prop_types.default.func,
	/**
	* Callback when the flyout closes
	*/
	onFlyoutClose: prop_types.default.func,
	/**
	* Callback when the flyout opens
	*/
	onFlyoutOpen: prop_types.default.func,
	/**
	* Label text of the primary action in the flyout
	*/
	primaryActionLabel: prop_types.default.string,
	/**
	* Filters from react table's state
	*/
	reactTableFiltersState: prop_types.default.arrayOf(prop_types.default.shape({
		id: prop_types.default.string.isRequired,
		type: prop_types.default.string.isRequired,
		value: prop_types.default.any.isRequired
	})),
	/**
	* Label text of the secondary action in the flyout
	*/
	secondaryActionLabel: prop_types.default.string,
	/**
	* Function that sets all the filters, this comes from the datagridState
	*/
	setAllFilters: prop_types.default.func.isRequired,
	/**
	* Title of the filter flyout
	*/
	title: prop_types.default.string,
	/**
	* The update method used to apply the filters
	*/
	updateMethod: prop_types.default.oneOf([require_constants.BATCH, require_constants.INSTANT]).isRequired
};
//#endregion
exports.default = FilterFlyout;
