import { YamlEditor as e } from "../../editors/yaml-editor.js";
import { t } from "../../utils-BC9GT6Pr.js";
import * as n from "react";
import { jsx as r } from "react/jsx-runtime";
//#region src/react/editors/yaml-editor.tsx
function i({ defaultValue: i, value: a, onChange: o, className: s, ...c }) {
	let l = n.useRef(null), u = n.useRef(null), d = n.useRef(!1), f = n.useRef(o);
	return f.current = o, n.useEffect(() => {
		if (typeof document > "u" || !l.current) return;
		let t = a ?? i ?? "";
		return u.current = new e({
			...c,
			container: l.current,
			value: t,
			onChange: (e) => {
				d.current || f.current?.(e);
			}
		}), () => {
			u.current?.destroy(), u.current = null;
		};
	}, []), n.useEffect(() => {
		let e = u.current;
		!e || a === void 0 || e.getValue() !== a && (d.current = !0, e.setValue(a), d.current = !1);
	}, [a]), /* @__PURE__ */ r("div", {
		ref: l,
		"data-slot": "yaml-editor",
		className: t("w-full", s)
	});
}
i.displayName = "YamlEditor";
//#endregion
export { i as YamlEditor };

//# sourceMappingURL=yaml-editor.js.map