"use client";
const require_field_anatomy = require("./field.anatomy.cjs");
const require_use_environment_context = require("../../providers/environment/use-environment-context.cjs");
const require_use_fieldset_context = require("../fieldset/use-fieldset-context.cjs");
const require_use_safe_layout_effect = require("../../utils/use-safe-layout-effect.cjs");
let react = require("react");
let _zag_js_dom_query = require("@zag-js/dom-query");
//#region src/components/field/use-field.ts
var useField = (props = {}) => {
	const fieldset = require_use_fieldset_context.useFieldsetContext();
	const env = require_use_environment_context.useEnvironmentContext();
	const { ids, target, disabled = Boolean(fieldset?.disabled), invalid = false, readOnly = false, required = false } = props;
	const [hasErrorText, setHasErrorText] = (0, react.useState)(false);
	const [hasHelperText, setHasHelperText] = (0, react.useState)(false);
	const uid = (0, react.useId)();
	const id = props.id ?? uid;
	const rootRef = (0, react.useRef)(null);
	const rootId = ids?.control ?? `field::${id}`;
	const errorTextId = ids?.errorText ?? `field::${id}::error-text`;
	const helperTextId = ids?.helperText ?? `field::${id}::helper-text`;
	const labelId = ids?.label ?? `field::${id}::label`;
	require_use_safe_layout_effect.useSafeLayoutEffect(() => {
		const rootNode = rootRef.current;
		if (!rootNode) return;
		const checkTextElements = () => {
			const docOrShadowRoot = env.getRootNode();
			setHasErrorText(!!docOrShadowRoot.getElementById(errorTextId));
			setHasHelperText(!!docOrShadowRoot.getElementById(helperTextId));
		};
		checkTextElements();
		const observer = new (env.getWindow()).MutationObserver(checkTextElements);
		observer.observe(rootNode, {
			childList: true,
			subtree: true
		});
		return () => observer.disconnect();
	}, [
		env,
		errorTextId,
		helperTextId
	]);
	const labelIds = (0, react.useMemo)(() => {
		const ids = [];
		if (hasErrorText && invalid) ids.push(errorTextId);
		if (hasHelperText) ids.push(helperTextId);
		return ids.join(" ") || void 0;
	}, [
		invalid,
		errorTextId,
		helperTextId,
		hasErrorText,
		hasHelperText
	]);
	const getRootProps = (0, react.useMemo)(() => () => ({
		...require_field_anatomy.parts.root.attrs,
		id: rootId,
		ref: rootRef,
		role: "group",
		"data-disabled": (0, _zag_js_dom_query.dataAttr)(disabled),
		"data-invalid": (0, _zag_js_dom_query.dataAttr)(invalid),
		"data-readonly": (0, _zag_js_dom_query.dataAttr)(readOnly)
	}), [
		disabled,
		invalid,
		readOnly,
		rootId
	]);
	const targetControlId = target ? `field::${id}::item::${target}` : void 0;
	const getLabelProps = (0, react.useMemo)(() => () => ({
		...require_field_anatomy.parts.label.attrs,
		id: labelId,
		"data-disabled": (0, _zag_js_dom_query.dataAttr)(disabled),
		"data-invalid": (0, _zag_js_dom_query.dataAttr)(invalid),
		"data-readonly": (0, _zag_js_dom_query.dataAttr)(readOnly),
		"data-required": (0, _zag_js_dom_query.dataAttr)(required),
		htmlFor: targetControlId ?? id
	}), [
		disabled,
		invalid,
		readOnly,
		required,
		id,
		labelId,
		targetControlId
	]);
	const getControlProps = (0, react.useMemo)(() => () => ({
		"aria-describedby": labelIds,
		"aria-invalid": (0, _zag_js_dom_query.ariaAttr)(invalid),
		"data-invalid": (0, _zag_js_dom_query.dataAttr)(invalid),
		"data-required": (0, _zag_js_dom_query.dataAttr)(required),
		"data-readonly": (0, _zag_js_dom_query.dataAttr)(readOnly),
		id,
		required,
		disabled,
		readOnly
	}), [
		labelIds,
		invalid,
		required,
		readOnly,
		id,
		disabled
	]);
	const getInputProps = (0, react.useMemo)(() => () => ({
		...getControlProps(),
		...require_field_anatomy.parts.input.attrs
	}), [getControlProps]);
	const getTextareaProps = (0, react.useMemo)(() => () => ({
		...getControlProps(),
		...require_field_anatomy.parts.textarea.attrs
	}), [getControlProps]);
	const getSelectProps = (0, react.useMemo)(() => () => ({
		...getControlProps(),
		...require_field_anatomy.parts.select.attrs
	}), [getControlProps]);
	const getHelperTextProps = (0, react.useMemo)(() => () => ({
		id: helperTextId,
		...require_field_anatomy.parts.helperText.attrs,
		"data-disabled": (0, _zag_js_dom_query.dataAttr)(disabled)
	}), [disabled, helperTextId]);
	const getErrorTextProps = (0, react.useMemo)(() => () => ({
		id: errorTextId,
		...require_field_anatomy.parts.errorText.attrs,
		"aria-live": "polite"
	}), [errorTextId]);
	const getRequiredIndicatorProps = (0, react.useMemo)(() => () => ({
		"aria-hidden": true,
		...require_field_anatomy.parts.requiredIndicator.attrs
	}), []);
	return {
		ariaDescribedby: labelIds,
		ids: {
			root: rootId,
			control: id,
			label: labelId,
			errorText: errorTextId,
			helperText: helperTextId
		},
		refs: { rootRef },
		disabled,
		invalid,
		readOnly,
		required,
		getLabelProps,
		getRootProps,
		getInputProps,
		getTextareaProps,
		getSelectProps,
		getHelperTextProps,
		getErrorTextProps,
		getRequiredIndicatorProps
	};
};
//#endregion
exports.useField = useField;
