import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BmmBcIzD.js";
import { n as DataTableInputSelect_default, t as CodeInput_default } from "./code-input-iq-moLxi.js";
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeClass, normalizeProps, normalizeStyle, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useTemplateRef, withCtx } from "vue";
import { ScalarIcon, ScalarIconButton, cva, useBindCx } from "@scalar/components";
import { ScalarIconEye, ScalarIconEyeSlash, ScalarIconX } from "@scalar/icons";
//#region src/v2/components/data-table/DataTable.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1$4 = ["role"];
var _hoisted_2$1 = {
	key: 0,
	class: "sr-only"
};
//#endregion
//#region src/v2/components/data-table/DataTable.vue
var DataTable_default = /* @__PURE__ */ defineComponent({
	__name: "DataTable",
	props: {
		columns: {},
		scroll: { type: Boolean },
		presentational: { type: Boolean }
	},
	setup(__props) {
		const { cx } = useBindCx();
		return (_ctx, _cache) => {
			return openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(unref(cx)(__props.scroll ? "overflow-x-auto custom-scroll" : "overflow-visible", "scalar-data-table"))), [createElementVNode("table", {
				class: normalizeClass(["mb-0 grid min-h-8 auto-rows-auto", { "w-max min-w-full": __props.scroll }]),
				role: __props.presentational ? "presentation" : "table",
				style: normalizeStyle({ gridTemplateColumns: __props.columns.map((col) => col || "1fr").join(" ") })
			}, [_ctx.$slots.caption ? (openBlock(), createElementBlock("caption", _hoisted_2$1, [renderSlot(_ctx.$slots, "caption")])) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")], 14, _hoisted_1$4)], 16);
		};
	}
});
//#endregion
//#region src/v2/components/data-table/DataTableCell.vue
var DataTableCell_default = /* @__PURE__ */ defineComponent({
	inheritAttrs: false,
	__name: "DataTableCell",
	props: { is: { default: "td" } },
	setup(__props) {
		const { cx } = useBindCx();
		return (_ctx, _cache) => {
			return openBlock(), createBlock(resolveDynamicComponent(__props.is), mergeProps(unref(cx)("box-content max-h-8 min-h-8 min-w-8 border-l-0 border-t border-b-0 border-r flex text-base/5 last:border-r-0 group-last:border-b-transparent p-0 m-0 relative"), { class: "group-[.alert]:bg-b-alert group-[.error]:bg-b-danger" }), {
				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
				_: 3
			}, 16);
		};
	}
});
//#endregion
//#region src/v2/components/data-table/DataTableCheckbox.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1$3 = ["checked", "disabled"];
//#endregion
//#region src/v2/components/data-table/DataTableCheckbox.vue
var DataTableCheckbox_default = /* @__PURE__ */ defineComponent({
	__name: "DataTableCheckbox",
	props: {
		modelValue: { type: Boolean },
		disabled: { type: Boolean },
		align: { default: "center" }
	},
	emits: ["update:modelValue"],
	setup(__props) {
		const variants = cva({
			base: "w-8 h-8 flex items-center justify-center text-b-2 peer-checked:text-c-1 pointer-events-none absolute",
			variants: { align: {
				left: "left-0",
				center: "centered"
			} }
		});
		return (_ctx, _cache) => {
			return openBlock(), createBlock(DataTableCell_default, { class: "group/cell relative flex min-w-8" }, {
				default: withCtx(() => [createElementVNode("input", {
					checked: __props.modelValue,
					class: "peer absolute inset-0 size-full cursor-pointer opacity-0 disabled:cursor-default",
					disabled: Boolean(__props.disabled),
					type: "checkbox",
					onChange: _cache[0] || (_cache[0] = (e) => _ctx.$emit("update:modelValue", e.target.checked))
				}, null, 40, _hoisted_1$3), createElementVNode("div", { class: normalizeClass(unref(variants)({ align: __props.align })) }, [createElementVNode("div", { class: normalizeClass(["absolute m-auto size-3/4 rounded border-[1px] opacity-0", !__props.disabled && "group-has-[:focus-visible]/cell:border-c-accent group-hover:opacity-100 group-has-[:focus-visible]/cell:opacity-100"]) }, null, 2), createVNode(unref(ScalarIcon), {
					icon: "Checkmark",
					size: "xs",
					thickness: "2.5"
				})], 2)]),
				_: 1
			});
		};
	}
});
//#endregion
//#region src/v2/components/data-table/DataTableHeader.vue
var DataTableHeader_default = /* @__PURE__ */ defineComponent({
	__name: "DataTableHeader",
	setup(__props) {
		const { cx } = useBindCx();
		return (_ctx, _cache) => {
			return openBlock(), createBlock(DataTableCell_default, mergeProps({ is: "th" }, unref(cx)("items-center font-medium px-2 min-w-0 -outline-offset-1")), {
				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
				_: 3
			}, 16);
		};
	}
});
//#endregion
//#region src/v2/components/data-table/DataTableInput.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1$2 = ["for"];
var _hoisted_2 = { class: "relative flex min-w-0 flex-1" };
var _hoisted_3 = [
	"readOnly",
	"type",
	"value"
];
var _hoisted_4 = {
	key: 1,
	class: "centered-y text-orange absolute right-7 text-xs"
};
//#endregion
//#region src/v2/components/data-table/DataTableInput.vue
var DataTableInput_default = /* @__PURE__ */ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
	inheritAttrs: false,
	__name: "DataTableInput",
	props: {
		id: {},
		type: {},
		containerClass: {},
		required: {
			type: Boolean,
			default: false
		},
		modelValue: {},
		canAddCustomEnumValue: {
			type: Boolean,
			default: true
		},
		readOnly: {
			type: Boolean,
			default: false
		},
		enum: {},
		min: {},
		max: {},
		environment: {},
		description: {},
		lineWrapping: {
			type: Boolean,
			default: false
		}
	},
	emits: [
		"update:modelValue",
		"inputFocus",
		"inputBlur",
		"selectVariable"
	],
	setup(__props, { emit: __emit }) {
		const props = __props;
		const emit = __emit;
		const mask = ref(true);
		const interactingWithDropdown = ref(false);
		const codeInput = useTemplateRef("codeInput");
		const handleBlur = () => !interactingWithDropdown.value && emit("inputBlur");
		const inputType = computed(() => props.type === "password" ? "text" : props.type ?? "text");
		const handleLabelClick = () => {
			if (!props.enum?.length && !props.readOnly) codeInput.value?.focus();
		};
		return (_ctx, _cache) => {
			return openBlock(), createBlock(DataTableCell_default, { class: normalizeClass(["relative flex", __props.containerClass]) }, {
				default: withCtx(() => [
					_ctx.$slots.default ? (openBlock(), createElementBlock("div", {
						key: 0,
						class: "text-c-1 flex items-center pr-0 pl-3",
						for: __props.id ?? "",
						onClick: handleLabelClick
					}, [renderSlot(_ctx.$slots, "default", {}, void 0, true), _cache[6] || (_cache[6] = createTextVNode(": ", -1))], 8, _hoisted_1$2)) : createCommentVNode("", true),
					createElementVNode("div", _hoisted_2, [props.enum && props.enum.length ? (openBlock(), createBlock(DataTableInputSelect_default, {
						key: 0,
						canAddCustomValue: props.canAddCustomEnumValue,
						modelValue: props.modelValue,
						value: props.enum,
						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", $event))
					}, null, 8, [
						"canAddCustomValue",
						"modelValue",
						"value"
					])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [mask.value && __props.type === "password" ? (openBlock(), createElementBlock("input", mergeProps({ key: 0 }, __props.id ? {
						..._ctx.$attrs,
						id: __props.id
					} : _ctx.$attrs, {
						autocomplete: "off",
						class: ["text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none px-2 py-1.25 -outline-offset-1", { "scalar-password-input": __props.type === "password" }],
						"data-1p-ignore": "",
						readOnly: __props.readOnly,
						spellcheck: "false",
						type: inputType.value,
						value: __props.modelValue,
						onInput: _cache[1] || (_cache[1] = ($event) => emit("update:modelValue", $event.target.value ?? ""))
					}), null, 16, _hoisted_3)) : (openBlock(), createBlock(unref(CodeInput_default), mergeProps({ key: 1 }, _ctx.$attrs, {
						id: __props.id,
						ref_key: "codeInput",
						ref: codeInput,
						class: ["text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none -outline-offset-1", [
							__props.type === "password" && __props.description && "pr-12",
							__props.description && "pr-8",
							__props.type === "password" && "scalar-password-input"
						]],
						description: __props.description,
						disableCloseBrackets: "",
						disableTabIndent: "",
						environment: __props.environment,
						lineWrapping: Boolean(__props.lineWrapping),
						max: __props.max,
						min: __props.min,
						modelValue: __props.modelValue ?? "",
						readOnly: __props.readOnly,
						required: Boolean(__props.required),
						spellcheck: "false",
						type: inputType.value,
						onBlur: handleBlur,
						onFocus: _cache[2] || (_cache[2] = ($event) => emit("inputFocus")),
						"onUpdate:modelValue": _cache[3] || (_cache[3] = (value) => emit("update:modelValue", value))
					}), null, 16, [
						"id",
						"class",
						"description",
						"environment",
						"lineWrapping",
						"max",
						"min",
						"modelValue",
						"readOnly",
						"required",
						"type"
					]))], 64))]),
					_ctx.$slots.warning ? (openBlock(), createElementBlock("div", _hoisted_4, [renderSlot(_ctx.$slots, "warning", {}, void 0, true)])) : createCommentVNode("", true),
					renderSlot(_ctx.$slots, "icon", {}, void 0, true),
					__props.modelValue ? (openBlock(), createBlock(unref(ScalarIconButton), {
						key: 2,
						class: "-ml-.25 h-6 w-6 self-center p-1.25",
						icon: unref(ScalarIconX),
						label: "Clear Value",
						onClick: _cache[4] || (_cache[4] = ($event) => emit("update:modelValue", ""))
					}, null, 8, ["icon"])) : createCommentVNode("", true),
					__props.type === "password" ? (openBlock(), createBlock(unref(ScalarIconButton), {
						key: 3,
						class: "-ml-.5 mr-1.25 h-6 w-6 self-center p-1.25",
						"data-testid": "data-table-password-toggle",
						icon: mask.value ? unref(ScalarIconEye) : unref(ScalarIconEyeSlash),
						label: mask.value ? "Show Password" : "Hide Password",
						onClick: _cache[5] || (_cache[5] = ($event) => mask.value = !mask.value)
					}, null, 8, ["icon", "label"])) : createCommentVNode("", true)
				]),
				_: 3
			}, 8, ["class"]);
		};
	}
}), [["__scopeId", "data-v-3157c3c7"]]);
//#endregion
//#region src/v2/components/data-table/DataTableRow.vue
var _sfc_main = {};
var _hoisted_1$1 = { class: "group contents" };
function _sfc_render(_ctx, _cache) {
	return openBlock(), createElementBlock("tr", _hoisted_1$1, [renderSlot(_ctx.$slots, "default")]);
}
var DataTableRow_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
//#endregion
//#region src/v2/components/data-table/DataTableText.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = { class: "flex-1 px-2 py-1.5 whitespace-nowrap" };
//#endregion
//#region src/v2/components/data-table/DataTableText.vue
var DataTableText_default = /* @__PURE__ */ defineComponent({
	__name: "DataTableText",
	props: { text: {} },
	setup(__props) {
		return (_ctx, _cache) => {
			return openBlock(), createBlock(DataTableCell_default, { class: "relative flex" }, {
				default: withCtx(() => [createElementVNode("span", _hoisted_1, [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(__props.text), 1)])])]),
				_: 3
			});
		};
	}
});
//#endregion
export { DataTableCheckbox_default as a, DataTableHeader_default as i, DataTableRow_default as n, DataTableCell_default as o, DataTableInput_default as r, DataTable_default as s, DataTableText_default as t };

//# sourceMappingURL=data-table-PL7e8NRO.js.map