/** @license MIT | @cube-dev/ui-kit v0.127.0 | Cube Dev Team */
import { extractStyles } from "../../../utils/styles.js";
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";
import { CONTAINER_STYLES, Element, TEXT_STYLES, filterBaseProps } from "@tenphi/tasty";
import { forwardRef } from "react";
import { jsx } from "react/jsx-runtime";
import { useFocusable, useHover } from "react-aria";
import { useFocusableRef } from "@react-spectrum/utils";

//#region src/components/content/ActiveZone/ActiveZone.tsx
const DEFAULT_STYLES = {
	display: "inline-grid",
	position: "relative",
	opacity: {
		"": 1,
		disabled: .4
	},
	transition: "theme"
};
const STYLE_PROPS = [...CONTAINER_STYLES, ...TEXT_STYLES];
function ActiveZone({ as, label, onClick, ...props }, ref) {
	const isDisabled = props.isDisabled;
	const styles = extractStyles(props, STYLE_PROPS, DEFAULT_STYLES);
	const domRef = useFocusableRef(ref);
	let { hoverProps, isHovered } = useHover({ isDisabled });
	let { focusProps, isFocused } = useFocus$1({ isDisabled });
	let { focusableProps } = useFocusable(props, domRef);
	return /* @__PURE__ */ jsx(Element, {
		"data-hovered": isHovered && !isDisabled ? "" : null,
		"data-focused": isFocused && !isDisabled ? "" : null,
		"data-disabled": isDisabled || null,
		"aria-label": label,
		...mergeProps$1(hoverProps, focusProps, focusableProps, { onClick }, filterBaseProps(props, { eventProps: true })),
		ref: domRef,
		tabIndex: props.excludeFromTabOrder || isDisabled ? -1 : 0,
		as,
		styles
	});
}
const _ActiveZone = forwardRef(ActiveZone);
_ActiveZone.displayName = "ActiveZone";

//#endregion
export { _ActiveZone };
//# sourceMappingURL=ActiveZone.js.map