import { computed, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, unref } from "vue";
import { ScalarIcon, ScalarToggle } from "@scalar/components";
var WatchModeToggle_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
	__name: "WatchModeToggle",
	props: {
		modelValue: { type: Boolean },
		disabled: {
			type: Boolean,
			default: false
		}
	},
	emits: ["update:modelValue"],
	setup(__props, { emit: __emit }) {
		const emit = __emit;
		/** Two-way binding computed property for v-model support */
		const model = computed({
			get: () => __props.modelValue,
			set: (value) => emit("update:modelValue", value)
		});
		return (_ctx, _cache) => {
			return openBlock(), createElementBlock("label", {
				class: normalizeClass(["text-c-2 flex items-center gap-2 rounded p-3 py-1.5 text-sm select-none", __props.disabled ? "cursor-default" : "cursor-pointer"]),
				for: "watch-toggle"
			}, [createElementVNode("span", { class: normalizeClass(["text-c-1 flex items-center gap-1 text-xs font-medium", { "text-c-3": !__props.modelValue }]) }, [createVNode(unref(ScalarIcon), {
				icon: "Watch",
				size: "sm"
			}), _cache[1] || (_cache[1] = createTextVNode(" Watch Mode ", -1))], 2), createVNode(unref(ScalarToggle), {
				id: "watch-toggle",
				modelValue: model.value,
				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
				disabled: __props.disabled
			}, null, 8, ["modelValue", "disabled"])], 2);
		};
	}
});
//#endregion
export { WatchModeToggle_vue_vue_type_script_setup_true_lang_default as default };

//# sourceMappingURL=WatchModeToggle.vue.script.js.map