@yamada-ui/react/dist/cjs/components/input/input-group.cjs

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
const require_children = require('../../utils/children.cjs');
const require_utils_index = require('../../utils/index.cjs');
const require_use_field_props = require('../field/use-field-props.cjs');
const require_input = require('./input.cjs');
const require_input_addon = require('./input-addon.cjs');
const require_input_element = require('./input-element.cjs');
const require_group = require('../group/group.cjs');
let react = require("react");
react = require_rolldown_runtime.__toESM(react);
let react_jsx_runtime = require("react/jsx-runtime");
react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);

//#region src/components/input/input-group.tsx
const InputGroupRoot = ((props) => {
	const { props: { id: _id, size, variant, children, disabled, errorBorderColor, focusBorderColor, readOnly, required,...rest }, dataProps } = require_use_field_props.useFieldProps(props);
	const validChildren = require_children.useValidChildren(children);
	const cloneChildren = (0, react.useMemo)(() => validChildren.map((child, index) => {
		const first = !index;
		if (require_children.isSomeElement(child.type, require_input_element.InputElement)) return (0, react.cloneElement)(child, {
			"data-ungrouped": "",
			placement: first ? "start" : "end",
			...child.props
		});
		else return child;
	}), [validChildren]);
	const sharedContext = (0, react.useMemo)(() => ({
		size,
		variant,
		errorBorderColor,
		focusBorderColor,
		...dataProps
	}), [
		size,
		variant,
		errorBorderColor,
		focusBorderColor,
		dataProps
	]);
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_input.InputPropsContext, {
		value: (0, react.useMemo)(() => ({
			...sharedContext,
			disabled,
			invalid: (0, require_utils_index.utils_exports.isTruthyDataAttr)(sharedContext["data-invalid"]),
			readOnly,
			required
		}), [
			sharedContext,
			disabled,
			readOnly,
			required
		]),
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_input_addon.InputAddonPropsContext, {
			value: sharedContext,
			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_input_element.InputElementPropsContext, {
				value: sharedContext,
				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
					attached: true,
					minW: "0",
					w: "full",
					...rest,
					children: cloneChildren
				})
			})
		})
	});
});

//#endregion
exports.InputGroupRoot = InputGroupRoot;
//# sourceMappingURL=input-group.cjs.map