"use client";
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
const require_styles_styler = require('../../../styles/styler.cjs');
const require_components_Box = require('../../Box.cjs');
const require_components_client_Input_InputHelpTextInternal = require('./InputHelpTextInternal.cjs');
let react_jsx_runtime = require("react/jsx-runtime");

//#region src/components/client/Input/InputHelpText.tsx
/**
* **📦 A component that displays helper text for input fields.**
*
* @componentType Client component
*
* @description
* A component that displays helper text for input fields.
*
* @see
* Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
*
* @usage
* - Help text that isn't tied to a specific Input.
*
* @example
* ```tsx
* 'use client';
* import { InputHelpText } from "@yahoo/uds";
*
* <InputHelpText>
*   This is some helper text for the input field.
* </InputHelpText>
*```
*
* @related [Input](https://uds.build/docs/components/input).
**/
const InputHelpText = ({ size = "md", isFilled, ...props }) => {
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Box.Box, {
		asChild: true,
		spacingTop: "2",
		className: { root: require_styles_styler.getStyles({
			inputSizeRoot: size,
			inputVariantRoot: "default",
			inputVariantValueRoot: !isFilled ? "empty" : "filled"
		}) }.root,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Input_InputHelpTextInternal.InputHelpTextInternal, {
			size,
			isFilled,
			...props
		})
	});
};
InputHelpText.displayName = "InputHelpText";

//#endregion
exports.InputHelpText = InputHelpText;