import { w as useActiveEntities } from "./store-DpSUVhjp.js";
import { r as DataTable_default, t as DataTableRow_default } from "./DataTableRow-c3XveEUO.js";
import { t as DataTableInput_default } from "./DataTableInput-yaU5g-kP.js";
import { t as ViewLayoutSection_default } from "./ViewLayoutSection-mUqKbQry.js";
import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, unref, useId, withCtx } from "vue";
import { ScalarIcon } from "@scalar/components";
//#region src/components/Form/Form.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = { key: 0 };
var _hoisted_2 = { class: "flex flex-1 flex-col gap-1.5" };
var _hoisted_3 = ["for"];
var _hoisted_4 = { class: "centered-y bg-b-2 flex-center absolute right-1 z-1 rounded px-1 py-0.5" };
//#endregion
//#region src/components/Form/Form.vue
var Form_default = /* @__PURE__ */ defineComponent({
	__name: "Form",
	props: {
		title: {},
		options: {},
		data: {},
		onUpdate: { type: Function }
	},
	setup(__props) {
		const { activeEnvVariables, activeEnvironment, activeWorkspace } = useActiveEntities();
		const id = useId();
		return (_ctx, _cache) => {
			return openBlock(), createBlock(ViewLayoutSection_default, { class: "last:rounded-b-lg" }, createSlots({
				default: withCtx(() => [createElementVNode("div", _hoisted_2, [Object.keys(__props.data).length > 0 && unref(activeWorkspace) ? (openBlock(), createBlock(DataTable_default, {
					key: 0,
					columns: [""],
					class: "rounded-b-lg"
				}, {
					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option, index) => {
						return openBlock(), createBlock(DataTableRow_default, {
							key: index,
							class: normalizeClass({ "border-t": index === 0 })
						}, {
							default: withCtx(() => [createVNode(DataTableInput_default, {
								class: "pr-9",
								lineWrapping: "",
								id: unref(id),
								envVariables: unref(activeEnvVariables),
								environment: unref(activeEnvironment),
								modelValue: __props.data[option.key] ?? "",
								placeholder: option.placeholder,
								workspace: unref(activeWorkspace),
								"onUpdate:modelValue": ($event) => __props.onUpdate(option.key, $event)
							}, createSlots({
								default: withCtx(() => [createElementVNode("label", { for: unref(id) }, toDisplayString(option.label), 9, _hoisted_3)]),
								_: 2
							}, [option.key === "description" ? {
								name: "icon",
								fn: withCtx(() => [createElementVNode("div", _hoisted_4, [createVNode(unref(ScalarIcon), {
									icon: "Markdown",
									size: "lg"
								})])]),
								key: "0"
							} : void 0]), 1032, [
								"id",
								"envVariables",
								"environment",
								"modelValue",
								"placeholder",
								"workspace",
								"onUpdate:modelValue"
							])]),
							_: 2
						}, 1032, ["class"]);
					}), 128))]),
					_: 1
				})) : createCommentVNode("", true)])]),
				_: 2
			}, [__props.title || _ctx.$slots.title ? {
				name: "title",
				fn: withCtx(() => [__props.title ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(__props.title), 1)) : renderSlot(_ctx.$slots, "title", { key: 1 })]),
				key: "0"
			} : void 0]), 1024);
		};
	}
});
//#endregion
export { Form_default as t };

//# sourceMappingURL=Form-CSKzyHGO.js.map