@primer/react-brand/esm/forms/ControlGroup/ControlGroup.js

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

import e from "../../node_modules/clsx/dist/clsx.js";
import { useId as t } from "../../hooks/useId.js";
import { Text as n } from "../../Text/Text.js";
import { AlertFillIcon as r, CheckCircleFillIcon as i } from "../../node_modules/@primer/octicons-react/dist/index.esm.js";
import a from "./ControlGroup.module.js";
import { Children as o, createContext as s, forwardRef as c, isValidElement as l, useContext as u } from "react";
import { jsx as d, jsxs as f } from "react/jsx-runtime";
//#region src/forms/ControlGroup/ControlGroup.tsx
var p = s(null), m = () => {
	let e = u(p);
	if (!e) throw Error("useControlGroup must be used within an ControlGroupProvider. Did you forget to wrap your component in a <ControlGroupProvider>?");
	return e;
}, h = c(({ className: n, id: r, ...i }, s) => {
	let c = t(r), u = o.toArray(i.children).some((e) => l(e) && e.type === _), f = o.toArray(i.children).some((e) => l(e) && e.type === v), m = [u && `${c}-caption`, f && `${c}-validation`].filter(Boolean).join(" ") || void 0;
	return /* @__PURE__ */ d(p.Provider, {
		value: { id: c },
		children: /* @__PURE__ */ d("fieldset", {
			ref: s,
			className: e(a.ControlGroup__container, n),
			"aria-describedby": m,
			...i
		})
	});
}), g = c(({ children: t, className: r, visuallyHidden: i, ...o }, s) => /* @__PURE__ */ d("legend", {
	ref: s,
	className: e(a.ControlGroup__label, i && "visually-hidden", r),
	...o,
	children: /* @__PURE__ */ d(n, {
		as: "span",
		weight: "medium",
		size: "100",
		children: t
	})
})), _ = c(({ className: e, ...t }, r) => {
	let { id: i } = m();
	return /* @__PURE__ */ d(n, {
		as: "span",
		size: "100",
		variant: "muted",
		ref: r,
		id: `${i}-caption`,
		className: e,
		...t
	});
}), v = c(({ className: t, variant: o, children: s, ...c }, l) => {
	let { id: u } = m();
	return /* @__PURE__ */ f(n, {
		as: "span",
		size: "100",
		ref: l,
		id: `${u}-validation`,
		className: e(a.ControlGroup__validation, a["ControlGroup__validation--animate-in"], o === "success" && a["ControlGroup__validation--success"], o === "error" && a["ControlGroup__validation--error"], t),
		...c,
		children: [
			o === "success" && /* @__PURE__ */ d("span", {
				className: a["ControlGroup__validation-icon--success"],
				children: /* @__PURE__ */ d(i, {})
			}),
			o === "error" && /* @__PURE__ */ d("span", {
				className: a["ControlGroup__validation-icon--error"],
				children: /* @__PURE__ */ d(r, {})
			}),
			s
		]
	});
}), y = Object.assign(h, {
	Label: g,
	Caption: _,
	Validation: v
});
//#endregion
export { y as ControlGroup };

//# sourceMappingURL=ControlGroup.js.map