@loopstack/loopstack-studio 0.23.0 → 0.24.0

package/dist/api/index.js

@@ -5,20 +5,22 @@ import { createDocumentsApi } from "./documents.js";
 import { createNamespacesApi } from "./namespaces.js";
 import { createPipelinesApi } from "./pipelines.js";
 import { createProcessorApi } from "./processor.js";
+import { createSecretsApi } from "./secrets.js";
 import { createWorkflowsApi } from "./workflows.js";
 import { createWorkspacesApi } from "./workspaces.js";
 import { createAxiosClient } from "./client.js";
-function createApi(u) {
+function createApi(d) {
 	return {
-		auth: createAuthApi(u),
-		config: createConfigApi(u),
-		dashboard: createDashboardApi(u),
-		documents: createDocumentsApi(u),
-		namespaces: createNamespacesApi(u),
-		pipelines: createPipelinesApi(u),
-		processor: createProcessorApi(u),
-		workflows: createWorkflowsApi(u),
-		workspaces: createWorkspacesApi(u)
+		auth: createAuthApi(d),
+		config: createConfigApi(d),
+		dashboard: createDashboardApi(d),
+		documents: createDocumentsApi(d),
+		namespaces: createNamespacesApi(d),
+		pipelines: createPipelinesApi(d),
+		processor: createProcessorApi(d),
+		secrets: createSecretsApi(d),
+		workflows: createWorkflowsApi(d),
+		workspaces: createWorkspacesApi(d)
 	};
 }
 export { createApi };

package/dist/api/secrets.js

@@ -0,0 +1,16 @@
+function createSecretsApi(e) {
+	return {
+		getByWorkspaceId: (t) => e.get(`/api/v1/workspaces/${t.workspaceId}/secrets`).then((e) => e.data),
+		create: (t) => e.post(`/api/v1/workspaces/${t.workspaceId}/secrets`, {
+			key: t.key,
+			value: t.value
+		}).then((e) => e.data),
+		upsert: (t) => e.put(`/api/v1/workspaces/${t.workspaceId}/secrets/upsert`, {
+			key: t.key,
+			value: t.value
+		}).then((e) => e.data),
+		update: (t) => e.put(`/api/v1/workspaces/${t.workspaceId}/secrets/${t.id}`, { value: t.value }).then((e) => e.data),
+		delete: (t) => e.delete(`/api/v1/workspaces/${t.workspaceId}/secrets/${t.id}`).then((e) => e.data)
+	};
+}
+export { createSecretsApi };

package/dist/components/dynamic-form/ArrayController.js

@@ -1,4 +1,5 @@
 import { Button } from "../ui/button.js";
+import { Card, CardContent } from "../ui/card.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../ui/collapsible.js";
 import { useArrayDefaultValue } from "./hooks/useArrayDefaultValue.js";
 import { useMergeParentKey } from "./hooks/useMergeParentKey.js";
@@ -8,93 +9,96 @@ import React, { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown, ChevronRight, Plus, Trash2 } from "lucide-react";
 import { useFieldArray } from "react-hook-form";
-const ArrayController = (_) => {
-	let v = c(45), { name: y, schema: b, ui: x, form: S, disabled: C, parentKey: w, viewOnly: T } = _, E = useMergeParentKey(w, y), [D, O] = useState(!(x?.collapsed ?? !1)), k = E ?? "", A;
-	v[0] !== S.control || v[1] !== k ? (A = {
-		control: S.control,
-		name: k
-	}, v[0] = S.control, v[1] = k, v[2] = A) : A = v[2];
-	let { fields: j, append: M, remove: N } = useFieldArray(A), P = useArrayDefaultValue(b.items), F;
-	v[3] === D ? F = v[4] : (F = jsx(D ? ChevronDown : ChevronRight, { className: "h-4 w-4" }), v[3] = D, v[4] = F);
-	let I = x?.title ?? b.title ?? y, L;
-	v[5] !== j.length || v[6] !== D ? (L = !D && /* @__PURE__ */ jsxs("span", {
+const ArrayController = (y) => {
+	let b = c(48), { name: x, schema: S, ui: C, form: w, disabled: T, parentKey: E, viewOnly: D } = y, O = useMergeParentKey(E, x), k = C?.collapsed ?? !1, A = C?.fixed ?? !1, [j, M] = useState(!k), N = O ?? "", P;
+	b[0] !== w.control || b[1] !== N ? (P = {
+		control: w.control,
+		name: N
+	}, b[0] = w.control, b[1] = N, b[2] = P) : P = b[2];
+	let { fields: F, append: I, remove: L } = useFieldArray(P), R = useArrayDefaultValue(S.items), z;
+	b[3] === j ? z = b[4] : (z = jsx(j ? ChevronDown : ChevronRight, { className: "h-4 w-4" }), b[3] = j, b[4] = z);
+	let B = C?.title ?? S.title ?? x, V;
+	b[5] !== F.length || b[6] !== j ? (V = !j && /* @__PURE__ */ jsxs("span", {
 		className: "ml-2 text-sm text-gray-500",
 		children: [
 			"(",
-			j.length,
+			F.length,
 			" ",
-			j.length === 1 ? "item" : "items",
+			F.length === 1 ? "item" : "items",
 			")"
 		]
-	}), v[5] = j.length, v[6] = D, v[7] = L) : L = v[7];
-	let R;
-	v[8] !== I || v[9] !== L ? (R = /* @__PURE__ */ jsxs("span", {
+	}), b[5] = F.length, b[6] = j, b[7] = V) : V = b[7];
+	let H;
+	b[8] !== B || b[9] !== V ? (H = /* @__PURE__ */ jsxs("span", {
 		className: "font-medium",
-		children: [I, L]
-	}), v[8] = I, v[9] = L, v[10] = R) : R = v[10];
-	let z;
-	v[11] !== F || v[12] !== R ? (z = /* @__PURE__ */ jsx(CollapsibleTrigger, {
+		children: [B, V]
+	}), b[8] = B, b[9] = V, b[10] = H) : H = b[10];
+	let U;
+	b[11] !== z || b[12] !== H ? (U = /* @__PURE__ */ jsx(CollapsibleTrigger, {
 		asChild: !0,
 		children: /* @__PURE__ */ jsxs(Button, {
 			variant: "ghost",
 			size: "sm",
 			className: "mb-2 flex items-center gap-2 p-2 hover:bg-gray-100",
 			type: "button",
-			children: [F, R]
+			children: [z, H]
 		})
-	}), v[11] = F, v[12] = R, v[13] = z) : z = v[13];
-	let B;
-	if (v[14] !== C || v[15] !== j || v[16] !== S || v[17] !== E || v[18] !== N || v[19] !== b.items || v[20] !== x?.items || v[21] !== T) {
-		let h;
-		v[23] !== C || v[24] !== S || v[25] !== E || v[26] !== N || v[27] !== b.items || v[28] !== x?.items || v[29] !== T ? (h = (h, g) => /* @__PURE__ */ jsxs("div", {
-			className: `mb-2 flex items-start border-l border-gray-300 pt-2 pr-0 pl-4 ${g === 0 ? "mt-2" : "mt-5"}`,
-			children: [/* @__PURE__ */ jsx("div", {
-				className: "mr-1 min-w-0 flex-1",
-				children: b.items && /* @__PURE__ */ jsx(FormElement, {
-					name: g.toString(),
-					parentKey: E,
+	}), b[11] = z, b[12] = H, b[13] = U) : U = b[13];
+	let W;
+	if (b[14] !== T || b[15] !== F || b[16] !== A || b[17] !== w || b[18] !== O || b[19] !== L || b[20] !== S.items || b[21] !== C?.items || b[22] !== D) {
+		let _;
+		b[24] !== T || b[25] !== A || b[26] !== w || b[27] !== O || b[28] !== L || b[29] !== S.items || b[30] !== C?.items || b[31] !== D ? (_ = (_, v) => /* @__PURE__ */ jsxs(Card, {
+			className: "gap-0 rounded-lg py-0 shadow-none",
+			children: [!D && !A && /* @__PURE__ */ jsx("div", {
+				className: "flex justify-end px-4 pt-2 pb-0",
+				children: /* @__PURE__ */ jsx(Button, {
+					type: "button",
+					onClick: () => L(v),
+					variant: "ghost",
+					size: "sm",
+					disabled: T,
+					className: "h-7 w-7 p-1.5",
+					children: /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5" })
+				})
+			}), /* @__PURE__ */ jsx(CardContent, {
+				className: `px-4 pb-2 ${!D && !A ? "pt-0" : "pt-3"}`,
+				children: S.items && /* @__PURE__ */ jsx(FormElement, {
+					name: v.toString(),
+					parentKey: O,
 					required: !1,
-					schema: b.items,
-					ui: x?.items,
-					form: S,
-					disabled: C,
-					viewOnly: T
+					schema: S.items,
+					ui: C?.items,
+					form: w,
+					disabled: T,
+					viewOnly: D
 				})
-			}), T ? "" : /* @__PURE__ */ jsx(Button, {
-				type: "button",
-				onClick: () => N(g),
-				variant: "ghost",
-				size: "sm",
-				disabled: C,
-				className: "mt-1 h-8 w-8 p-2",
-				children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
 			})]
-		}, h.id), v[23] = C, v[24] = S, v[25] = E, v[26] = N, v[27] = b.items, v[28] = x?.items, v[29] = T, v[30] = h) : h = v[30], B = j.map(h), v[14] = C, v[15] = j, v[16] = S, v[17] = E, v[18] = N, v[19] = b.items, v[20] = x?.items, v[21] = T, v[22] = B;
-	} else B = v[22];
-	let V;
-	v[31] !== M || v[32] !== P || v[33] !== C || v[34] !== b.items?.title || v[35] !== x?.items?.title || v[36] !== T ? (V = T ? "" : /* @__PURE__ */ jsxs(Button, {
+		}, _.id), b[24] = T, b[25] = A, b[26] = w, b[27] = O, b[28] = L, b[29] = S.items, b[30] = C?.items, b[31] = D, b[32] = _) : _ = b[32], W = F.map(_), b[14] = T, b[15] = F, b[16] = A, b[17] = w, b[18] = O, b[19] = L, b[20] = S.items, b[21] = C?.items, b[22] = D, b[23] = W;
+	} else W = b[23];
+	let G;
+	b[33] !== I || b[34] !== R || b[35] !== T || b[36] !== A || b[37] !== S.items?.title || b[38] !== C?.items?.title || b[39] !== D ? (G = !D && !A ? /* @__PURE__ */ jsxs(Button, {
 		type: "button",
-		onClick: () => M(P),
+		onClick: () => I(R),
 		variant: "outline",
 		size: "sm",
-		disabled: C,
-		className: "mt-4",
+		disabled: T,
+		className: "mt-2",
 		children: [
 			/* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
 			"Add ",
-			x?.items?.title ?? b.items?.title ?? "Item"
+			C?.items?.title ?? S.items?.title ?? "Item"
 		]
-	}), v[31] = M, v[32] = P, v[33] = C, v[34] = b.items?.title, v[35] = x?.items?.title, v[36] = T, v[37] = V) : V = v[37];
-	let H;
-	v[38] !== B || v[39] !== V ? (H = /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsxs("div", {
-		className: "pl-4",
-		children: [B, V]
-	}) }), v[38] = B, v[39] = V, v[40] = H) : H = v[40];
-	let U;
-	return v[41] !== D || v[42] !== H || v[43] !== z ? (U = /* @__PURE__ */ jsxs(Collapsible, {
-		open: D,
-		onOpenChange: O,
-		children: [z, H]
-	}), v[41] = D, v[42] = H, v[43] = z, v[44] = U) : U = v[44], U;
+	}) : "", b[33] = I, b[34] = R, b[35] = T, b[36] = A, b[37] = S.items?.title, b[38] = C?.items?.title, b[39] = D, b[40] = G) : G = b[40];
+	let K;
+	b[41] !== W || b[42] !== G ? (K = /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsxs("div", {
+		className: "space-y-2",
+		children: [W, G]
+	}) }), b[41] = W, b[42] = G, b[43] = K) : K = b[43];
+	let q;
+	return b[44] !== j || b[45] !== K || b[46] !== U ? (q = /* @__PURE__ */ jsxs(Collapsible, {
+		open: j,
+		onOpenChange: M,
+		children: [U, K]
+	}), b[44] = j, b[45] = K, b[46] = U, b[47] = q) : q = b[47], q;
 };
 export { ArrayController };

package/dist/components/dynamic-form/Form.js

@@ -1,35 +1,64 @@
 import { FormElementHeader } from "./FormElementHeader.js";
 import FormBody_default from "./FormBody.js";
 import { c } from "react/compiler-runtime";
-import React from "react";
+import React, { useEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-var Form_default = (a) => {
-	let o = c(20), { form: s, schema: l, ui: u, mimeType: d, disabled: f, viewOnly: p, actions: m } = a, h = u, g = h?.form?.title, _ = h?.form?.description, v;
-	o[0] !== f || o[1] !== g || o[2] !== _ ? (v = /* @__PURE__ */ jsx(FormElementHeader, {
-		title: g,
-		description: _,
-		disabled: f
-	}), o[0] = f, o[1] = g, o[2] = _, o[3] = v) : v = o[3];
-	let y = l, b = u?.form, x;
-	o[4] !== f || o[5] !== s || o[6] !== d || o[7] !== y || o[8] !== b || o[9] !== p ? (x = /* @__PURE__ */ jsx(FormBody_default, {
-		form: s,
-		mimeType: d,
-		schema: y,
-		ui: b,
-		disabled: f,
-		viewOnly: p
-	}), o[4] = f, o[5] = s, o[6] = d, o[7] = y, o[8] = b, o[9] = p, o[10] = x) : x = o[10];
-	let S;
-	o[11] !== m || o[12] !== p ? (S = !p && !!m && /* @__PURE__ */ jsx("div", {
+import { FormProvider } from "react-hook-form";
+function extractSchemaDefaults(e) {
+	if (e.default !== void 0) return e.default;
+	if (e.properties) {
+		let a = {}, o = !1;
+		for (let [s, l] of Object.entries(e.properties)) if (l.default !== void 0) a[s] = l.default, o = !0;
+		else if (l.type === "object" && l.properties) {
+			let e = extractSchemaDefaults(l);
+			e !== void 0 && (a[s] = e, o = !0);
+		}
+		return o ? a : void 0;
+	}
+}
+var Form_default = (s) => {
+	let u = c(28), { form: d, schema: f, ui: p, mimeType: m, disabled: h, viewOnly: g, actions: _ } = s, v = p, y = f, b;
+	u[0] !== d || u[1] !== y ? (b = () => {
+		let e = extractSchemaDefaults(y);
+		if (e) {
+			let a = d.getValues(), o = { ...e };
+			for (let [e, s] of Object.entries(a)) s !== void 0 && s !== "" && s !== null && (o[e] = s);
+			d.reset(o);
+		}
+	}, u[0] = d, u[1] = y, u[2] = b) : b = u[2];
+	let x;
+	u[3] === f ? x = u[4] : (x = [f], u[3] = f, u[4] = x), useEffect(b, x);
+	let S = v?.form?.title, C = v?.form?.description, w;
+	u[5] !== h || u[6] !== S || u[7] !== C ? (w = /* @__PURE__ */ jsx(FormElementHeader, {
+		title: S,
+		description: C,
+		disabled: h
+	}), u[5] = h, u[6] = S, u[7] = C, u[8] = w) : w = u[8];
+	let T = f, E = p?.form, D;
+	u[9] !== h || u[10] !== d || u[11] !== m || u[12] !== T || u[13] !== E || u[14] !== g ? (D = /* @__PURE__ */ jsx(FormBody_default, {
+		form: d,
+		mimeType: m,
+		schema: T,
+		ui: E,
+		disabled: h,
+		viewOnly: g
+	}), u[9] = h, u[10] = d, u[11] = m, u[12] = T, u[13] = E, u[14] = g, u[15] = D) : D = u[15];
+	let O;
+	u[16] !== _ || u[17] !== g ? (O = !g && !!_ && /* @__PURE__ */ jsx("div", {
 		className: "mt-4 flex w-full justify-end",
-		children: m
-	}), o[11] = m, o[12] = p, o[13] = S) : S = o[13];
-	let C;
-	o[14] !== x || o[15] !== S ? (C = /* @__PURE__ */ jsxs("form", { children: [x, S] }), o[14] = x, o[15] = S, o[16] = C) : C = o[16];
-	let w;
-	return o[17] !== v || o[18] !== C ? (w = /* @__PURE__ */ jsxs("div", {
+		children: _
+	}), u[16] = _, u[17] = g, u[18] = O) : O = u[18];
+	let k;
+	u[19] !== D || u[20] !== O ? (k = /* @__PURE__ */ jsxs("form", { children: [D, O] }), u[19] = D, u[20] = O, u[21] = k) : k = u[21];
+	let A;
+	u[22] !== k || u[23] !== w ? (A = /* @__PURE__ */ jsxs("div", {
 		className: "container mx-auto",
-		children: [v, C]
-	}), o[17] = v, o[18] = C, o[19] = w) : w = o[19], w;
+		children: [w, k]
+	}), u[22] = k, u[23] = w, u[24] = A) : A = u[24];
+	let j;
+	return u[25] !== d || u[26] !== A ? (j = /* @__PURE__ */ jsx(FormProvider, {
+		...d,
+		children: A
+	}), u[25] = d, u[26] = A, u[27] = j) : j = u[27], j;
 };
 export { Form_default as default };

package/dist/components/dynamic-form/FormElement.js

@@ -17,7 +17,7 @@ const FormElement = (d) => {
 				disabled: m
 			}), /* @__PURE__ */ jsx(ObjectController, { ...d })] });
 			case "array": return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx("div", {
-				className: "mt-3",
+				className: "mt-1",
 				children: /* @__PURE__ */ jsx(ArrayController, { ...d })
 			}) });
 			default: return /* @__PURE__ */ jsx(InputController, {

package/dist/components/dynamic-form/FormElementHeader.js

@@ -5,8 +5,8 @@ const FormElementHeader = (i) => {
 	let a = c(7), { title: o, description: s } = i;
 	if (!o && !s) return null;
 	let l;
-	a[0] === o ? l = a[1] : (l = o && /* @__PURE__ */ jsx("h1", {
-		className: "mb-2 text-xl font-semibold",
+	a[0] === o ? l = a[1] : (l = o && /* @__PURE__ */ jsx("h3", {
+		className: "mb-1.5 text-base font-semibold",
 		children: o
 	}), a[0] = o, a[1] = l);
 	let u;

package/dist/components/dynamic-form/InputController.js

@@ -2,6 +2,7 @@ import { InputField } from "./fields/InputField.js";
 import { TextareaField } from "./fields/TextareaField.js";
 import { CheckboxField } from "./fields/CheckboxField.js";
 import { CodeViewField } from "./fields/CodeViewField.js";
+import { MarkdownViewField } from "./fields/MarkdownViewField.js";
 import { RadioField } from "./fields/RadioField.js";
 import { SelectField } from "./fields/SelectField.js";
 import { SliderField } from "./fields/SliderField.js";
@@ -17,7 +18,8 @@ var WIDGET_REGISTRY = {
 	slider: SliderField,
 	text: InputField,
 	textarea: TextareaField,
-	"code-view": CodeViewField
+	"code-view": CodeViewField,
+	"markdown-view": MarkdownViewField
 }, WIDGET_NAMES = Object.keys(WIDGET_REGISTRY), resolveWidgetType = (e, o) => {
 	if (o && WIDGET_NAMES.includes(o)) return o;
 	let s = e;

package/dist/components/dynamic-form/ObjectController.js

@@ -3,30 +3,33 @@ import { FormElement } from "./FormElement.js";
 import { useSortedPropertyNames } from "./hooks/useSortPropertyNames.js";
 import { c } from "react/compiler-runtime";
 import React from "react";
-import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
-const ObjectController = (o) => {
-	let s = c(23), { name: l, schema: u, ui: d, form: f, disabled: p, parentKey: m, viewOnly: h } = o, g = u, _ = d, v;
-	s[0] === g.properties ? v = s[1] : (v = g.properties ?? {}, s[0] = g.properties, s[1] = v);
-	let y = useSortedPropertyNames(v, _?.order), b = useMergeParentKey(m, l), x;
-	s[2] === g.required ? x = s[3] : (x = g.required ?? [], s[2] = g.required, s[3] = x);
-	let S = x, C;
-	if (s[4] !== p || s[5] !== f || s[6] !== b || s[7] !== g.properties || s[8] !== _?.properties || s[9] !== y || s[10] !== S || s[11] !== h) {
+import { jsx } from "react/jsx-runtime";
+const ObjectController = (a) => {
+	let o = c(24), { name: s, schema: l, ui: u, form: d, disabled: f, parentKey: p, viewOnly: m } = a, h = l, g = u, _;
+	o[0] === h.properties ? _ = o[1] : (_ = h.properties ?? {}, o[0] = h.properties, o[1] = _);
+	let v = useSortedPropertyNames(_, g?.order), y = useMergeParentKey(p, s), b;
+	o[2] === h.required ? b = o[3] : (b = h.required ?? [], o[2] = h.required, o[3] = b);
+	let x = b, S = v.length === 2 ? "grid grid-cols-2 gap-x-4" : void 0, C;
+	if (o[4] !== f || o[5] !== d || o[6] !== y || o[7] !== h.properties || o[8] !== g?.properties || o[9] !== v || o[10] !== x || o[11] !== m) {
 		let e;
-		s[13] !== p || s[14] !== f || s[15] !== b || s[16] !== g.properties || s[17] !== _?.properties || s[18] !== S || s[19] !== h ? (e = (e) => {
-			let a = g.properties?.[e];
-			return a ? /* @__PURE__ */ jsx(FormElement, {
-				form: f,
-				disabled: p,
-				viewOnly: h,
-				parentKey: b,
+		o[13] !== f || o[14] !== d || o[15] !== y || o[16] !== h.properties || o[17] !== g?.properties || o[18] !== x || o[19] !== m ? (e = (e) => {
+			let i = h.properties?.[e];
+			return i ? /* @__PURE__ */ jsx(FormElement, {
+				form: d,
+				disabled: f,
+				viewOnly: m,
+				parentKey: y,
 				name: e,
-				schema: a,
-				ui: _?.properties?.[e],
-				required: S.includes(e)
+				schema: i,
+				ui: g?.properties?.[e],
+				required: x.includes(e)
 			}, `el-${e}`) : null;
-		}, s[13] = p, s[14] = f, s[15] = b, s[16] = g.properties, s[17] = _?.properties, s[18] = S, s[19] = h, s[20] = e) : e = s[20], C = y.map(e), s[4] = p, s[5] = f, s[6] = b, s[7] = g.properties, s[8] = _?.properties, s[9] = y, s[10] = S, s[11] = h, s[12] = C;
-	} else C = s[12];
+		}, o[13] = f, o[14] = d, o[15] = y, o[16] = h.properties, o[17] = g?.properties, o[18] = x, o[19] = m, o[20] = e) : e = o[20], C = v.map(e), o[4] = f, o[5] = d, o[6] = y, o[7] = h.properties, o[8] = g?.properties, o[9] = v, o[10] = x, o[11] = m, o[12] = C;
+	} else C = o[12];
 	let w;
-	return s[21] === C ? w = s[22] : (w = /* @__PURE__ */ jsx(Fragment$1, { children: C }), s[21] = C, s[22] = w), w;
+	return o[21] !== S || o[22] !== C ? (w = /* @__PURE__ */ jsx("div", {
+		className: S,
+		children: C
+	}), o[21] = S, o[22] = C, o[23] = w) : w = o[23], w;
 };
 export { ObjectController };

package/dist/components/dynamic-form/fields/BaseFieldWrapper.js

@@ -33,7 +33,7 @@ const BaseFieldWrapper = (i) => {
 	}), a[18] = u, a[19] = w);
 	let T;
 	return a[20] !== p || a[21] !== b || a[22] !== x || a[23] !== S || a[24] !== C || a[25] !== w ? (T = /* @__PURE__ */ jsxs("div", {
-		className: "mt-4 mb-8 block space-y-2",
+		className: "mb-4 block space-y-1.5",
 		children: [
 			b,
 			x,

package/dist/components/dynamic-form/fields/InputField.js

@@ -15,6 +15,7 @@ const getInputType = (t) => {
 		case "time": return "time";
 		case "datetime": return "datetime-local";
 		case "phone": return "tel";
+		case "password": return "password";
 	}
 	switch (t.type) {
 		case "integer":
@@ -27,13 +28,13 @@ var isNumericType = (t) => t.type === "number" || t.type === "integer";
 const InputField = (p) => {
 	let m = c(36), { name: h, schema: g, ui: _, required: v, form: y, disabled: b, viewOnly: x } = p, S = useFieldConfig(h, g, _, b), C;
 	m[0] === g ? C = m[1] : (C = getInputType(g), m[0] = g, m[1] = C);
-	let w = C, T;
-	m[2] !== g.examples?.[0] || m[3] !== g.placeholder ? (T = g.placeholder || g.examples?.[0]?.toString() || "", m[2] = g.examples?.[0], m[3] = g.placeholder, m[4] = T) : T = m[4];
-	let E = T, D;
-	m[5] !== v || m[6] !== g ? (D = buildTextValidationRules(g, v), m[5] = v, m[6] = g, m[7] = D) : D = m[7];
-	let O = D, k;
-	m[8] === g ? k = m[9] : (k = isNumericType(g), m[8] = g, m[9] = k);
-	let A = k;
+	let w = C, T = _, E;
+	m[2] !== g || m[3] !== T?.placeholder ? (E = T?.placeholder || g.placeholder || g.examples?.[0]?.toString() || "", m[2] = g, m[3] = T?.placeholder, m[4] = E) : E = m[4];
+	let D = E, O;
+	m[5] !== v || m[6] !== g ? (O = buildTextValidationRules(g, v), m[5] = v, m[6] = g, m[7] = O) : O = m[7];
+	let k = O, A;
+	m[8] === g ? A = m[9] : (A = isNumericType(g), m[8] = g, m[9] = A);
+	let j = A;
 	if (x) {
 		let t;
 		m[10] === S.fieldLabel ? t = m[11] : (t = /* @__PURE__ */ jsx(Label, {
@@ -49,12 +50,12 @@ const InputField = (p) => {
 		}), m[12] = y.control, m[13] = h, m[14] = u, m[15] = d) : d = m[15];
 		let f;
 		return m[16] !== t || m[17] !== d ? (f = /* @__PURE__ */ jsxs("div", {
-			className: "mt-4 mb-8 block",
+			className: "mb-4 block",
 			children: [t, d]
 		}), m[16] = t, m[17] = d, m[18] = f) : f = m[18], f;
 	}
-	let j = S.defaultValue ?? (A ? void 0 : ""), M;
-	m[19] !== S || m[20] !== w || m[21] !== A || m[22] !== h || m[23] !== E || m[24] !== v || m[25] !== g.maxLength || m[26] !== g.maximum || m[27] !== g.minimum || m[28] !== g.multipleOf ? (M = (l) => {
+	let M = S.defaultValue ?? (j ? void 0 : ""), N;
+	m[19] !== S || m[20] !== w || m[21] !== j || m[22] !== h || m[23] !== D || m[24] !== v || m[25] !== g.maxLength || m[26] !== g.maximum || m[27] !== g.minimum || m[28] !== g.multipleOf ? (N = (l) => {
 		let { field: u } = l;
 		return /* @__PURE__ */ jsx(BaseFieldWrapper, {
 			name: h,
@@ -67,14 +68,14 @@ const InputField = (p) => {
 				...u,
 				id: h,
 				onChange: (t) => {
-					if (!S.isReadOnly) if (A) {
+					if (!S.isReadOnly) if (j) {
 						let l = t.target.value;
 						u.onChange(l === "" ? void 0 : Number(l));
 					} else u.onChange(t);
 				},
 				value: u.value ?? "",
 				type: w,
-				placeholder: E,
+				placeholder: D,
 				disabled: S.isDisabled,
 				readOnly: S.isReadOnly,
 				min: g.minimum,
@@ -85,15 +86,15 @@ const InputField = (p) => {
 				...S.getAriaProps()
 			})
 		});
-	}, m[19] = S, m[20] = w, m[21] = A, m[22] = h, m[23] = E, m[24] = v, m[25] = g.maxLength, m[26] = g.maximum, m[27] = g.minimum, m[28] = g.multipleOf, m[29] = M) : M = m[29];
-	let N;
-	return m[30] !== y.control || m[31] !== h || m[32] !== j || m[33] !== M || m[34] !== O ? (N = /* @__PURE__ */ jsx(Controller, {
+	}, m[19] = S, m[20] = w, m[21] = j, m[22] = h, m[23] = D, m[24] = v, m[25] = g.maxLength, m[26] = g.maximum, m[27] = g.minimum, m[28] = g.multipleOf, m[29] = N) : N = m[29];
+	let P;
+	return m[30] !== y.control || m[31] !== h || m[32] !== M || m[33] !== N || m[34] !== k ? (P = /* @__PURE__ */ jsx(Controller, {
 		name: h,
 		control: y.control,
-		defaultValue: j,
-		rules: O,
-		render: M
-	}), m[30] = y.control, m[31] = h, m[32] = j, m[33] = M, m[34] = O, m[35] = N) : N = m[35], N;
+		defaultValue: M,
+		rules: k,
+		render: N
+	}), m[30] = y.control, m[31] = h, m[32] = M, m[33] = N, m[34] = k, m[35] = P) : P = m[35], P;
 };
 function _temp(t) {
 	let { field: l } = t;

package/dist/components/dynamic-form/fields/MarkdownViewField.js

@@ -0,0 +1,20 @@
+import MarkdownContent_default from "../MarkdownContent.js";
+import { useFieldConfig } from "../hooks/useFieldConfig.js";
+import { c } from "react/compiler-runtime";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+import { Controller } from "react-hook-form";
+const MarkdownViewField = (e) => {
+	let o = c(4), { name: s, schema: l, ui: u, form: d, disabled: f } = e, p = useFieldConfig(s, l, u, f).defaultValue || "", m;
+	return o[0] !== d.control || o[1] !== s || o[2] !== p ? (m = /* @__PURE__ */ jsx(Controller, {
+		name: s,
+		control: d.control,
+		defaultValue: p,
+		render: _temp
+	}), o[0] = d.control, o[1] = s, o[2] = p, o[3] = m) : m = o[3], m;
+};
+function _temp(i) {
+	let { field: a } = i;
+	return /* @__PURE__ */ jsx(MarkdownContent_default, { content: String(a.value ?? "") });
+}
+export { MarkdownViewField };

package/dist/components/dynamic-form/fields/RadioField.js

@@ -8,14 +8,14 @@ import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Controller } from "react-hook-form";
 const RadioField = (p) => {
-	let m = c(21), { name: h, schema: g, ui: _, required: v, form: y, disabled: b } = p, x = useFieldConfig(h, g, _, b), S = g.enumOptions, C;
-	m[0] !== S || m[1] !== g.enum ? (C = S ? S.map(_temp) : g.enum, m[0] = S, m[1] = g.enum, m[2] = C) : C = m[2];
-	let w = C, T;
-	m[3] !== S || m[4] !== g.enum ? (T = S ? S.map(_temp2) : g.enum, m[3] = S, m[4] = g.enum, m[5] = T) : T = m[5];
-	let E = T, D = x.defaultValue || "", O = v ? "This field is required" : void 0, k;
-	m[6] === O ? k = m[7] : (k = { required: O }, m[6] = O, m[7] = k);
-	let A;
-	m[8] !== x || m[9] !== w || m[10] !== E || m[11] !== h || m[12] !== v || m[13] !== g.inline ? (A = (d) => {
+	let m = c(22), { name: h, schema: g, ui: _, required: v, form: y, disabled: b } = p, x = useFieldConfig(h, g, _, b), S = _, C = S?.enumOptions ?? g.enumOptions, w;
+	m[0] !== C || m[1] !== g ? (w = C ? C.map(_temp) : g.enum, m[0] = C, m[1] = g, m[2] = w) : w = m[2];
+	let T = w, E;
+	m[3] !== C || m[4] !== g ? (E = C ? C.map(_temp2) : g.enum, m[3] = C, m[4] = g, m[5] = E) : E = m[5];
+	let D = E, O = x.defaultValue || "", k = v ? "This field is required" : void 0, A;
+	m[6] === k ? A = m[7] : (A = { required: k }, m[6] = k, m[7] = A);
+	let j;
+	m[8] !== x || m[9] !== T || m[10] !== D || m[11] !== h || m[12] !== v || m[13] !== g || m[14] !== S?.inline ? (j = (d) => {
 		let { field: f } = d;
 		return /* @__PURE__ */ jsx(BaseFieldWrapper, {
 			name: h,
@@ -31,9 +31,9 @@ const RadioField = (p) => {
 				disabled: x.isDisabled,
 				required: v,
 				"aria-label": x.fieldLabel,
-				className: cn(g.inline && "flex flex-row space-y-0 space-x-4"),
+				className: cn((S?.inline ?? g.inline) && "flex flex-row space-y-0 space-x-4"),
 				...x.getAriaProps(),
-				children: E?.map((u, d) => /* @__PURE__ */ jsxs("div", {
+				children: D?.map((u, d) => /* @__PURE__ */ jsxs("div", {
 					className: "flex items-center space-x-2",
 					children: [/* @__PURE__ */ jsx(RadioGroupItem, {
 						value: u,
@@ -43,20 +43,20 @@ const RadioField = (p) => {
 					}), /* @__PURE__ */ jsx(Label, {
 						htmlFor: `${h}-${u}`,
 						className: cn("cursor-pointer text-sm font-normal", x.isDisabled && "cursor-not-allowed opacity-70"),
-						children: w?.[d] || u
+						children: T?.[d] || u
 					})]
 				}, u))
 			})
 		});
-	}, m[8] = x, m[9] = w, m[10] = E, m[11] = h, m[12] = v, m[13] = g.inline, m[14] = A) : A = m[14];
-	let j;
-	return m[15] !== y.control || m[16] !== h || m[17] !== D || m[18] !== k || m[19] !== A ? (j = /* @__PURE__ */ jsx(Controller, {
+	}, m[8] = x, m[9] = T, m[10] = D, m[11] = h, m[12] = v, m[13] = g, m[14] = S?.inline, m[15] = j) : j = m[15];
+	let M;
+	return m[16] !== y.control || m[17] !== h || m[18] !== O || m[19] !== A || m[20] !== j ? (M = /* @__PURE__ */ jsx(Controller, {
 		name: h,
 		control: y.control,
-		defaultValue: D,
-		rules: k,
-		render: A
-	}), m[15] = y.control, m[16] = h, m[17] = D, m[18] = k, m[19] = A, m[20] = j) : j = m[20], j;
+		defaultValue: O,
+		rules: A,
+		render: j
+	}), m[16] = y.control, m[17] = h, m[18] = O, m[19] = A, m[20] = j, m[21] = M) : M = m[21], M;
 };
 function _temp(n) {
 	return n.label;