@yamada-ui/react/dist/esm/components/slot/slot.js

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

import { useFindChild, useValidChildren } from "../../utils/children.js";
import { mergeProps } from "../../core/components/props.js";
import { Children, cloneElement, isValidElement } from "react";
import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";

//#region src/components/slot/slot.tsx
/**
* `Slot` is a component that merges its props onto its immediate child.
*
* @see https://yamada-ui.com/docs/components/slot
*/
const Slot = ({ children,...rest }) => {
	const validChildren = useValidChildren(children);
	const slottable = useFindChild(validChildren, Slottable);
	if (slottable) {
		const newElement = slottable.props.children;
		const newChildren = validChildren.map((child) => {
			if (child === slottable) {
				if (Children.count(newElement) > 1) return Children.only(null);
				return isValidElement(newElement) ? newElement.props.children : null;
			} else return child;
		});
		return /* @__PURE__ */ jsx(SlotClone, {
			...rest,
			children: isValidElement(newElement) ? cloneElement(newElement, void 0, newChildren) : null
		});
	}
	return /* @__PURE__ */ jsx(SlotClone, {
		...rest,
		children
	});
};
const SlotClone = ({ children,...rest }) => {
	if (isValidElement(children)) return cloneElement(children, mergeProps(rest, children.props)());
	return Children.count(children) > 1 ? Children.only(null) : null;
};
const Slottable = ({ children }) => {
	return /* @__PURE__ */ jsx(Fragment$1, { children });
};

//#endregion
export { Slot, Slottable };
//# sourceMappingURL=slot.js.map