@gravitee/graphene-core 2.56.0 → 2.57.0

package/dist/CodeEditor-izUXIn0I.js

@@ -0,0 +1,260 @@
+import { n as e, r as t, t as n } from "./Skeleton-DYPFDpYt.js";
+import * as r from "react";
+import { jsx as i } from "react/jsx-runtime";
+import { Editor as a, loader as o } from "@monaco-editor/react";
+//#region src/composed/CodeEditor/setupCodeEditor.ts
+var s = !1;
+function c({ baseUrl: e, monaco: t } = {}) {
+	if (!s) {
+		if (t !== void 0) {
+			o.config({ monaco: t }), s = !0;
+			return;
+		}
+		e !== void 0 && (o.config({ paths: { vs: e.replace(/\/+$/, "") } }), s = !0);
+	}
+}
+async function l() {
+	if (s) return;
+	let e = await import("monaco-editor");
+	s ||= (o.config({ monaco: e }), !0);
+}
+function u() {
+	return s;
+}
+//#endregion
+//#region src/composed/CodeEditor/theme/buildTheme.ts
+var d = "graphene";
+function f(e) {
+	let t = {}, n = [], r = document.createElement("div");
+	document.body.appendChild(r);
+	let i = getComputedStyle(r), a = document.createElement("canvas");
+	a.width = 1, a.height = 1;
+	let o = a.getContext("2d");
+	for (let a of e) {
+		if (!o) {
+			t[a] = "#000000";
+			continue;
+		}
+		r.style.backgroundColor = `var(${a})`;
+		let e = i.backgroundColor;
+		(e === "" || e === "rgba(0, 0, 0, 0)") && n.push(a), o.clearRect(0, 0, 1, 1), o.fillStyle = e, o.fillRect(0, 0, 1, 1);
+		let [s, c, l] = o.getImageData(0, 0, 1, 1).data;
+		t[a] = "#" + [
+			s,
+			c,
+			l
+		].map((e) => e.toString(16).padStart(2, "0")).join("");
+	}
+	return document.body.removeChild(r), t;
+}
+function p() {
+	let e = document.documentElement.classList.contains("dark"), t = f([
+		"--background",
+		"--foreground",
+		"--border",
+		"--muted",
+		"--muted-foreground",
+		"--primary",
+		"--code-editor-string",
+		"--code-editor-keyword",
+		"--code-editor-number",
+		"--code-editor-type",
+		"--code-editor-special"
+	]), n = t["--background"], r = t["--foreground"], i = t["--border"], a = t["--muted"], o = t["--muted-foreground"], s = t["--primary"], c = t["--code-editor-string"], l = t["--code-editor-keyword"], u = t["--code-editor-number"], d = t["--code-editor-type"], p = t["--code-editor-special"], m = (e) => e.slice(1);
+	return {
+		base: e ? "vs-dark" : "vs",
+		inherit: !0,
+		rules: [
+			{
+				token: "string",
+				foreground: m(c)
+			},
+			{
+				token: "string.key.json",
+				foreground: m(d)
+			},
+			{
+				token: "keyword",
+				foreground: m(l)
+			},
+			{
+				token: "keyword.json",
+				foreground: m(p)
+			},
+			{
+				token: "number",
+				foreground: m(u)
+			},
+			{
+				token: "type",
+				foreground: m(d)
+			},
+			{
+				token: "tag",
+				foreground: m(l)
+			},
+			{
+				token: "attribute.name",
+				foreground: m(d)
+			},
+			{
+				token: "attribute.value",
+				foreground: m(c)
+			},
+			{
+				token: "comment",
+				foreground: m(o),
+				fontStyle: "italic"
+			},
+			{
+				token: "comment.line",
+				foreground: m(o),
+				fontStyle: "italic"
+			},
+			{
+				token: "comment.block",
+				foreground: m(o),
+				fontStyle: "italic"
+			},
+			{
+				token: "identifier",
+				foreground: m(r)
+			},
+			{
+				token: "variable",
+				foreground: m(r)
+			},
+			{
+				token: "delimiter",
+				foreground: m(r)
+			}
+		],
+		colors: {
+			"editor.background": n,
+			"editor.foreground": r,
+			"editor.lineHighlightBackground": r + "08",
+			"editor.lineHighlightBorder": "#00000000",
+			"editor.selectionBackground": s + "4d",
+			"editor.inactiveSelectionBackground": s + "26",
+			"editorCursor.foreground": s,
+			"editorLineNumber.foreground": o,
+			"editorLineNumber.activeForeground": r,
+			"editorGutter.background": n,
+			"editorIndentGuide.background1": i,
+			"editorIndentGuide.activeBackground1": o,
+			"editorWidget.background": a,
+			"editorWidget.foreground": r,
+			"editorWidget.border": i,
+			"editorWidget.resizeBorder": i,
+			"widget.shadow": r + "1a",
+			"input.background": n,
+			"input.border": i,
+			"input.foreground": r,
+			"input.placeholderForeground": o,
+			"inputOption.activeBorder": s,
+			"inputOption.activeBackground": s + "26",
+			"inputOption.activeForeground": s,
+			"button.background": s,
+			"button.foreground": "#ffffff",
+			"editorSuggestWidget.background": n,
+			"editorSuggestWidget.border": i,
+			"editorSuggestWidget.selectedBackground": s + "26",
+			"scrollbarSlider.background": i + "80",
+			"scrollbarSlider.hoverBackground": i,
+			"scrollbarSlider.activeBackground": o + "80"
+		}
+	};
+}
+//#endregion
+//#region src/composed/CodeEditor/CodeEditor.tsx
+function m(e) {
+	e.editor.defineTheme(d, p()), e.editor.setTheme(d);
+}
+var h = (e) => {
+	m(e);
+};
+function g() {
+	let [e, t] = r.useState(typeof document < "u" && document.documentElement.classList.contains("dark"));
+	return r.useEffect(() => {
+		let e = new MutationObserver(() => {
+			t(document.documentElement.classList.contains("dark"));
+		});
+		return e.observe(document.documentElement, {
+			attributes: !0,
+			attributeFilter: ["class"]
+		}), () => e.disconnect();
+	}, []), e;
+}
+function _({ value: o, defaultValue: s, onChange: c, language: f = "plaintext", readOnly: p = !1, disabled: _ = !1, height: v, className: y, options: b, onMount: x }) {
+	let [S, C] = r.useState(() => u() ? { status: "ready" } : { status: "loading" });
+	r.useEffect(() => {
+		if (S.status !== "loading") return;
+		let e = !1;
+		return l().then(() => {
+			e || C({ status: "ready" });
+		}, (t) => {
+			if (e) return;
+			let n = t instanceof Error ? t.message : "Unknown error";
+			console.error("[CodeEditor] Failed to configure Monaco loader:", t), C({
+				status: "error",
+				message: n
+			});
+		}), () => {
+			e = !0;
+		};
+	}, [S.status]);
+	let w = g(), T = r.useRef(null), E = r.useRef(null);
+	r.useEffect(() => {
+		T.current && m(T.current);
+	}, [w]);
+	let D = r.useCallback((e, t) => {
+		T.current = t, E.current = e, x?.(e, t);
+	}, [x]), O = typeof v == "number" ? `${v}px` : v ?? "300px", k = /* @__PURE__ */ i(n, { className: "size-full" });
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "code-editor",
+		"data-disabled": _ ? "" : void 0,
+		"data-readonly": p && !_ ? "" : void 0,
+		className: t("overflow-hidden rounded-lg border border-input bg-background", "data-disabled:pointer-events-none data-disabled:opacity-50", "data-readonly:bg-muted/30", y),
+		style: { height: O },
+		children: S.status === "error" ? /* @__PURE__ */ i(e, {
+			value: o ?? "",
+			onChange: (e) => c?.(e.target.value),
+			readOnly: p || _,
+			spellCheck: !1,
+			className: "size-full resize-none rounded-none border-0 p-3 font-mono text-xs focus-visible:ring-0"
+		}) : S.status === "ready" ? /* @__PURE__ */ i(a, {
+			height: "100%",
+			language: f,
+			value: o,
+			defaultValue: s,
+			theme: d,
+			onChange: c,
+			onMount: D,
+			beforeMount: h,
+			loading: k,
+			options: {
+				readOnly: p || _,
+				minimap: { enabled: !1 },
+				scrollBeyondLastLine: !1,
+				automaticLayout: !0,
+				fontFamily: "ui-monospace, Menlo, Consolas, \"Cascadia Code\", \"Liberation Mono\", monospace",
+				fontSize: 13,
+				lineHeight: 20,
+				padding: {
+					top: 8,
+					bottom: 8
+				},
+				glyphMargin: !1,
+				renderLineHighlight: "line",
+				scrollbar: {
+					verticalScrollbarSize: 6,
+					horizontalScrollbarSize: 6
+				},
+				overviewRulerLanes: 0,
+				...b
+			}
+		}) : k
+	});
+}
+//#endregion
+export { c as n, _ as t };

package/dist/CodeEditorField-2Ph093QR.js

@@ -0,0 +1,52 @@
+import { f as e, h as t, i as n, o as r, p as i, r as a, s as o, t as s, u as c } from "./SchemaBanner-lrLehIB4.js";
+import { t as l } from "./CodeEditor-izUXIn0I.js";
+import { useEffect as u, useRef as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/composed/JsonSchemaForm/fields/code-editor/CodeEditorField.tsx
+var h = 250;
+function g(e) {
+	if (typeof e != "string" || e.trim() === "") return !1;
+	try {
+		return JSON.parse(e), !0;
+	} catch {
+		return !1;
+	}
+}
+function _({ node: _, name: v }) {
+	let { control: y, basePath: b, disabled: x } = r(), { schema: S } = _, C = v ? b ? `${b}.${v}` : v : b, { field: w, fieldState: T } = o({
+		control: y,
+		name: C
+	}), E = a(S, v), D = T.invalid, O = typeof w.value == "string" ? w.value : "", [k] = f(() => O), A = S.gioConfig?.monacoEditorConfig?.language ?? (g(k) ? "json" : "plaintext"), j = d(w.onBlur);
+	u(() => {
+		j.current = w.onBlur;
+	});
+	let M = d(null);
+	return u(() => () => {
+		M.current?.dispose(), M.current = null;
+	}, []), /* @__PURE__ */ m(c, {
+		"data-invalid": D,
+		children: [
+			/* @__PURE__ */ p(t, {
+				htmlFor: C,
+				required: S.isRequired,
+				children: E
+			}),
+			S.gioConfig?.banner && /* @__PURE__ */ p(s, { banner: S.gioConfig.banner }),
+			/* @__PURE__ */ p(l, {
+				value: O,
+				language: A,
+				height: S.gioConfig?.monacoEditorConfig?.height ?? h,
+				onChange: (e) => w.onChange(e ?? ""),
+				readOnly: S.readOnly === !0,
+				disabled: x,
+				onMount: (e) => {
+					M.current?.dispose(), M.current = e.onDidBlurEditorText(() => j.current());
+				}
+			}),
+			S.description && /* @__PURE__ */ p(e, { children: S.description }),
+			/* @__PURE__ */ p(i, { errors: n(T.error) })
+		]
+	});
+}
+//#endregion
+export { _ as CodeEditorField };