import { t as AdminLayout_default } from "./AdminLayout-DcKfAlG1.js";
import { Head, router, useForm } from "@inertiajs/vue3";
import { Fragment, computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, renderList, resolveComponent, toDisplayString, unref, useSSRContext, vModelCheckbox, vModelSelect, vModelText, withCtx, withDirectives, withKeys, withModifiers } from "vue";
import { ssrIncludeBooleanAttr, ssrInterpolate, ssrLooseContain, ssrLooseEqual, ssrRenderAttr, ssrRenderClass, ssrRenderComponent, ssrRenderList } from "vue/server-renderer";
import { Coffee, Layers, Pencil, Plus, PlusCircle, Search, Sliders, Tag, Trash2, X } from "lucide-vue-next";
//#region resources/js/Pages/CafePOS/Modifiers/Index.vue?vue&type=script&setup=true&lang.ts
var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
	__name: "Index",
	__ssrInlineRender: true,
	props: {
		modifiers: {},
		ingredients: {},
		products: {},
		filters: {}
	},
	setup(__props) {
		const props = __props;
		const searchQuery = ref(props.filters.search || "");
		const handleSearch = () => {
			router.get(route("modifiers.index"), { search: searchQuery.value }, {
				preserveState: true,
				replace: true
			});
		};
		const isModalOpen = ref(false);
		const modalTitle = ref("");
		const isEditMode = ref(false);
		const editingModifierId = ref(null);
		const form = useForm({
			name: "",
			price: 0,
			ingredient_id: null,
			usage_qty: null,
			is_active: true,
			product_ids: []
		});
		const groupedProducts = computed(() => {
			const groups = {};
			props.products.forEach((p) => {
				if (!groups[p.category]) groups[p.category] = [];
				groups[p.category].push(p);
			});
			return groups;
		});
		const openAddModal = () => {
			isEditMode.value = false;
			modalTitle.value = "Tambah Add-on Baru";
			editingModifierId.value = null;
			form.reset();
			form.clearErrors();
			isModalOpen.value = true;
		};
		const openEditModal = (modifier) => {
			isEditMode.value = true;
			modalTitle.value = "Ubah Pengaturan Add-on";
			editingModifierId.value = modifier.id;
			form.clearErrors();
			form.name = modifier.name;
			form.price = Number(modifier.price);
			form.ingredient_id = modifier.ingredient_id;
			form.usage_qty = modifier.usage_qty ? Number(modifier.usage_qty) : null;
			form.is_active = modifier.is_active;
			form.product_ids = modifier.products ? modifier.products.map((p) => p.id) : [];
			isModalOpen.value = true;
		};
		const toggleCategoryProducts = (category, checked) => {
			const pIds = groupedProducts.value[category].map((p) => p.id);
			if (checked) pIds.forEach((id) => {
				if (!form.product_ids.includes(id)) form.product_ids.push(id);
			});
			else form.product_ids = form.product_ids.filter((id) => !pIds.includes(id));
		};
		const isCategoryFullySelected = (category) => {
			return groupedProducts.value[category].map((p) => p.id).every((id) => form.product_ids.includes(id));
		};
		const handleSubmit = () => {
			if (isEditMode.value && editingModifierId.value) form.put(route("modifiers.update", editingModifierId.value), { onSuccess: () => {
				isModalOpen.value = false;
			} });
			else form.post(route("modifiers.store"), { onSuccess: () => {
				isModalOpen.value = false;
			} });
		};
		const deleteModifier = (modifier) => {
			if (confirm(`Apakah Anda yakin ingin menghapus add-on "${modifier.name}"? Relasi ke produk akan dihapus otomatis.`)) router.delete(route("modifiers.destroy", modifier.id));
		};
		return (_ctx, _push, _parent, _attrs) => {
			const _component_Link = resolveComponent("Link");
			_push(`<!--[-->`);
			_push(ssrRenderComponent(unref(Head), { title: "Manajemen Add-ons" }, null, _parent));
			_push(ssrRenderComponent(AdminLayout_default, null, {
				default: withCtx((_, _push, _parent, _scopeId) => {
					if (_push) {
						_push(`<div class="space-y-6 font-sans select-none"${_scopeId}><div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4"${_scopeId}><div class="space-y-1"${_scopeId}><h1 class="text-xl font-extrabold tracking-tight text-slate-900 dark:text-slate-100 flex items-center gap-2"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Sliders), { class: "h-5 w-5 text-[#8c5a3c]" }, null, _parent, _scopeId));
						_push(`<span${_scopeId}>Manajemen Add-ons (Modifiers)</span></h1><p class="text-xs text-slate-500 dark:text-slate-400"${_scopeId}> Atur pilihan tambahan makanan/minuman (extra shot, cheese, topping) serta hubungkan ke stok bahan baku secara dinamis. </p></div><button class="px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl flex items-center justify-center gap-1.5 transition-all shadow-md shadow-[#8c5a3c]/10 cursor-pointer"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Plus), { class: "h-4 w-4" }, null, _parent, _scopeId));
						_push(`<span${_scopeId}>Tambah Add-on</span></button></div><div class="bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-2xl overflow-hidden shadow-sm"${_scopeId}><div class="p-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between gap-4"${_scopeId}><div class="relative flex-1 max-w-sm"${_scopeId}><span class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none text-slate-400"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Search), { class: "h-4 w-4" }, null, _parent, _scopeId));
						_push(`</span><input${ssrRenderAttr("value", searchQuery.value)} type="text" placeholder="Cari add-on..." class="w-full pl-9 pr-4 py-2 border border-slate-200 dark:border-slate-800 rounded-xl text-xs bg-slate-50 dark:bg-slate-900/30 focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-800 dark:text-slate-200"${_scopeId}></div></div><div class="overflow-x-auto"${_scopeId}><table class="w-full text-left border-collapse"${_scopeId}><thead${_scopeId}><tr class="bg-slate-50 dark:bg-slate-900/20 text-slate-500 dark:text-slate-400 text-[10px] font-extrabold uppercase tracking-wider border-b border-slate-200 dark:border-slate-800"${_scopeId}><th class="p-4"${_scopeId}>Nama Add-on</th><th class="p-4"${_scopeId}>Harga Tambahan</th><th class="p-4"${_scopeId}>Stok Pengurang</th><th class="p-4"${_scopeId}>Produk Relevan</th><th class="p-4"${_scopeId}>Status</th><th class="p-4 text-center"${_scopeId}>Aksi</th></tr></thead><tbody class="divide-y divide-slate-100 dark:divide-slate-900/50 text-xs font-semibold text-slate-700 dark:text-slate-300"${_scopeId}>`);
						if (__props.modifiers.data.length === 0) _push(`<tr${_scopeId}><td colspan="6" class="p-8 text-center text-slate-400 font-medium"${_scopeId}> Tidak ada data add-ons ditemukan. </td></tr>`);
						else _push(`<!---->`);
						_push(`<!--[-->`);
						ssrRenderList(__props.modifiers.data, (mod) => {
							_push(`<tr class="hover:bg-slate-50/50 dark:hover:bg-slate-900/10 transition-colors"${_scopeId}><td class="p-4 font-bold text-slate-900 dark:text-slate-100"${_scopeId}>${ssrInterpolate(mod.name)}</td><td class="p-4 text-slate-800 dark:text-slate-200 font-bold"${_scopeId}> Rp ${ssrInterpolate(Number(mod.price).toLocaleString("id-ID"))}</td><td class="p-4"${_scopeId}>`);
							if (mod.ingredient) {
								_push(`<span class="inline-flex items-center gap-1.5 px-2 py-1 bg-amber-50 dark:bg-amber-950/20 border border-amber-200/50 dark:border-amber-900/30 text-amber-700 dark:text-amber-400 rounded-lg text-[10px] font-bold"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Layers), { class: "h-3 w-3" }, null, _parent, _scopeId));
								_push(` ${ssrInterpolate(mod.ingredient.name)} (${ssrInterpolate(Number(mod.usage_qty))} ${ssrInterpolate(mod.ingredient.unit)}) </span>`);
							} else _push(`<span class="text-slate-400 text-[10px] font-bold"${_scopeId}> - </span>`);
							_push(`</td><td class="p-4 max-w-xs"${_scopeId}><div class="flex flex-wrap gap-1"${_scopeId}><!--[-->`);
							ssrRenderList(mod.products, (p) => {
								_push(`<span class="inline-block px-1.5 py-0.5 bg-slate-100 dark:bg-slate-800 text-slate-650 dark:text-slate-350 rounded text-[9px] font-bold"${_scopeId}>${ssrInterpolate(p.name)}</span>`);
							});
							_push(`<!--]-->`);
							if (!mod.products || mod.products.length === 0) _push(`<span class="text-rose-500 text-[10px] font-extrabold"${_scopeId}> Belum dikaitkan produk </span>`);
							else _push(`<!---->`);
							_push(`</div></td><td class="p-4"${_scopeId}><span class="${ssrRenderClass(["px-2 py-0.5 rounded-full text-[9px] font-extrabold uppercase", mod.is_active ? "bg-emerald-50 dark:bg-emerald-950/20 border border-emerald-200/30 text-emerald-700 dark:text-emerald-450" : "bg-slate-100 dark:bg-slate-800 text-slate-400 dark:text-slate-500"])}"${_scopeId}>${ssrInterpolate(mod.is_active ? "Aktif" : "Nonaktif")}</span></td><td class="p-4"${_scopeId}><div class="flex items-center justify-center gap-2"${_scopeId}><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-[#8c5a3c] rounded-lg transition-colors cursor-pointer" title="Ubah"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Pencil), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
							_push(`</button><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-400 hover:text-rose-600 rounded-lg transition-colors cursor-pointer" title="Hapus"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Trash2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
							_push(`</button></div></td></tr>`);
						});
						_push(`<!--]--></tbody></table></div>`);
						if (__props.modifiers.last_page > 1) {
							_push(`<div class="p-4 border-t border-slate-200 dark:border-slate-800 flex items-center justify-between"${_scopeId}><span class="text-xs text-slate-500"${_scopeId}> Menampilkan Halaman ${ssrInterpolate(__props.modifiers.current_page)} dari ${ssrInterpolate(__props.modifiers.last_page)} (Total ${ssrInterpolate(__props.modifiers.total)} data) </span><div class="flex items-center gap-1"${_scopeId}><!--[-->`);
							ssrRenderList(__props.modifiers.links, (link) => {
								_push(ssrRenderComponent(_component_Link, {
									key: link.label,
									href: link.url || "#",
									class: [
										"px-3 py-1 text-xs border rounded-lg transition-colors font-bold",
										link.active ? "bg-[#8c5a3c] border-[#8c5a3c] text-white" : "border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900 text-slate-600 dark:text-slate-400",
										!link.url ? "opacity-50 pointer-events-none" : "cursor-pointer"
									]
								}, null, _parent, _scopeId));
							});
							_push(`<!--]--></div></div>`);
						} else _push(`<!---->`);
						_push(`</div></div>`);
						if (isModalOpen.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/65 backdrop-blur-sm animate-in fade-in duration-150"${_scopeId}><div class="bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-2xl overflow-hidden flex flex-col transform transition-all font-sans"${_scopeId}><div class="px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between"${_scopeId}><h3 class="text-sm font-extrabold text-slate-900 dark:text-slate-100 flex items-center gap-2"${_scopeId}>`);
							_push(ssrRenderComponent(unref(PlusCircle), { class: "h-4 w-4 text-[#8c5a3c]" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>${ssrInterpolate(modalTitle.value)}</span></h3><button class="p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"${_scopeId}>`);
							_push(ssrRenderComponent(unref(X), { class: "h-4 w-4" }, null, _parent, _scopeId));
							_push(`</button></div><form class="flex-1 overflow-y-auto max-h-[70vh] p-6 space-y-5"${_scopeId}><div class="grid grid-cols-1 md:grid-cols-2 gap-5"${_scopeId}><div class="space-y-4"${_scopeId}><div class="space-y-1.5"${_scopeId}><label class="block text-xs font-bold text-slate-650 dark:text-slate-350"${_scopeId}>Nama Add-on</label><input${ssrRenderAttr("value", unref(form).name)} type="text" required placeholder="Contoh: Extra Cheese, Oat Milk" class="w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-850 dark:text-slate-150"${_scopeId}>`);
							if (unref(form).errors.name) _push(`<span class="text-[10px] text-rose-500 font-bold block"${_scopeId}>${ssrInterpolate(unref(form).errors.name)}</span>`);
							else _push(`<!---->`);
							_push(`</div><div class="space-y-1.5"${_scopeId}><label class="block text-xs font-bold text-slate-650 dark:text-slate-350"${_scopeId}>Harga Tambahan (Rp)</label><input${ssrRenderAttr("value", unref(form).price)} type="number" required min="0" placeholder="0" class="w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-850 dark:text-slate-150 font-bold"${_scopeId}>`);
							if (unref(form).errors.price) _push(`<span class="text-[10px] text-rose-500 font-bold block"${_scopeId}>${ssrInterpolate(unref(form).errors.price)}</span>`);
							else _push(`<!---->`);
							_push(`</div><div class="p-4 bg-slate-50 dark:bg-slate-900/30 border border-slate-200 dark:border-slate-800 rounded-xl space-y-3"${_scopeId}><h4 class="text-[10px] font-extrabold uppercase tracking-wider text-slate-400 flex items-center gap-1.5"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Layers), { class: "h-3.5 w-3.5 text-amber-500" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>Hubungkan ke Bahan Baku (Opsional)</span></h4><p class="text-[10px] text-slate-500 dark:text-slate-400"${_scopeId}> Jika dihubungkan, stok bahan baku ini akan berkurang otomatis setiap kali add-on ini terjual. </p><div class="space-y-1.5"${_scopeId}><label class="block text-[10px] font-bold text-slate-500"${_scopeId}>Pilih Bahan Baku</label><select class="w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-800 dark:text-slate-200"${_scopeId}><option${ssrRenderAttr("value", null)}${ssrIncludeBooleanAttr(Array.isArray(unref(form).ingredient_id) ? ssrLooseContain(unref(form).ingredient_id, null) : ssrLooseEqual(unref(form).ingredient_id, null)) ? " selected" : ""}${_scopeId}>-- Tidak Ada Pengurangan Stok --</option><!--[-->`);
							ssrRenderList(__props.ingredients, (ing) => {
								_push(`<option${ssrRenderAttr("value", ing.id)}${ssrIncludeBooleanAttr(Array.isArray(unref(form).ingredient_id) ? ssrLooseContain(unref(form).ingredient_id, ing.id) : ssrLooseEqual(unref(form).ingredient_id, ing.id)) ? " selected" : ""}${_scopeId}>${ssrInterpolate(ing.name)} (${ssrInterpolate(ing.unit)})</option>`);
							});
							_push(`<!--]--></select></div>`);
							if (unref(form).ingredient_id) {
								_push(`<div class="space-y-1.5"${_scopeId}><label class="block text-[10px] font-bold text-slate-500"${_scopeId}>Jumlah Pemakaian per Porsi</label><div class="flex items-center gap-2"${_scopeId}><input${ssrRenderAttr("value", unref(form).usage_qty)} type="number" step="0.0001" required min="0.0001" placeholder="Jumlah" class="w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-850 dark:text-slate-150"${_scopeId}><span class="text-xs text-slate-400 font-bold"${_scopeId}>${ssrInterpolate(__props.ingredients.find((i) => i.id === unref(form).ingredient_id)?.unit)}</span></div>`);
								if (unref(form).errors.usage_qty) _push(`<span class="text-[10px] text-rose-500 font-bold block"${_scopeId}>${ssrInterpolate(unref(form).errors.usage_qty)}</span>`);
								else _push(`<!---->`);
								_push(`</div>`);
							} else _push(`<!---->`);
							_push(`</div><div class="flex items-center justify-between p-3 bg-slate-50 dark:bg-slate-900/30 border border-slate-200 dark:border-slate-800 rounded-xl"${_scopeId}><div class="space-y-0.5"${_scopeId}><label class="block text-xs font-bold text-slate-850 dark:text-slate-150"${_scopeId}>Status Add-on</label><span class="text-[10px] text-slate-400"${_scopeId}>Aktifkan agar dapat dipilih saat transaksi.</span></div><label class="relative inline-flex items-center cursor-pointer select-none"${_scopeId}><input type="checkbox"${ssrIncludeBooleanAttr(Array.isArray(unref(form).is_active) ? ssrLooseContain(unref(form).is_active, null) : unref(form).is_active) ? " checked" : ""} class="sr-only peer"${_scopeId}><div class="w-10 h-5 bg-slate-200 dark:bg-slate-800 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[&#39;&#39;] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-slate-600 peer-checked:bg-[#8c5a3c]"${_scopeId}></div></label></div></div><div class="flex flex-col border border-slate-200 dark:border-slate-800 rounded-xl overflow-hidden bg-slate-50/50 dark:bg-slate-900/10"${_scopeId}><div class="p-3.5 border-b border-slate-200 dark:border-slate-800 bg-slate-50 dark:bg-slate-900/20 flex items-center justify-between"${_scopeId}><div class="flex items-center gap-2"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Coffee), { class: "h-4 w-4 text-[#8c5a3c]" }, null, _parent, _scopeId));
							_push(`<span class="text-xs font-extrabold text-slate-900 dark:text-slate-100"${_scopeId}>Kaitkan ke Produk</span></div><span class="text-[10px] font-bold text-slate-450"${_scopeId}>${ssrInterpolate(unref(form).product_ids.length)} produk dipilih </span></div><div class="p-4 space-y-4 flex-1 overflow-y-auto max-h-[360px]"${_scopeId}>`);
							if (__props.products.length === 0) _push(`<div class="text-center py-8 text-slate-400 text-xs font-medium"${_scopeId}> Belum ada data produk tersedia. </div>`);
							else _push(`<!---->`);
							_push(`<!--[-->`);
							ssrRenderList(groupedProducts.value, (prods, cat) => {
								_push(`<div class="space-y-2 border-b border-slate-200/50 dark:border-slate-800/40 pb-3 last:border-0 last:pb-0"${_scopeId}><div class="flex items-center justify-between"${_scopeId}><span class="text-[10px] font-black uppercase tracking-wider text-slate-400 flex items-center gap-1"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Tag), { class: "h-3 w-3" }, null, _parent, _scopeId));
								_push(` ${ssrInterpolate(cat)}</span><button type="button" class="text-[9px] font-bold text-[#8c5a3c] hover:underline cursor-pointer"${_scopeId}>${ssrInterpolate(isCategoryFullySelected(cat) ? "Pilih Semua" : "Batal Semua")}</button></div><div class="grid grid-cols-1 gap-2 pt-1"${_scopeId}><!--[-->`);
								ssrRenderList(prods, (prod) => {
									_push(`<label class="flex items-center gap-2.5 p-2 rounded-lg hover:bg-slate-100 dark:hover:bg-slate-900 border border-slate-200/40 dark:border-slate-800/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none transition-colors"${_scopeId}><input type="checkbox"${ssrIncludeBooleanAttr(Array.isArray(unref(form).product_ids) ? ssrLooseContain(unref(form).product_ids, prod.id) : unref(form).product_ids) ? " checked" : ""}${ssrRenderAttr("value", prod.id)} class="h-3.5 w-3.5 rounded border-slate-300 text-[#8c5a3c] focus:ring-[#8c5a3c]"${_scopeId}><div class="flex-1 flex items-center justify-between"${_scopeId}><span${_scopeId}>${ssrInterpolate(prod.name)}</span><span class="text-[10px] text-slate-400"${_scopeId}>Rp${ssrInterpolate(Number(prod.price).toLocaleString("id-ID"))}</span></div></label>`);
								});
								_push(`<!--]--></div></div>`);
							});
							_push(`<!--]--></div></div></div><div class="pt-4 border-t border-slate-200 dark:border-slate-800 flex items-center justify-end gap-3"${_scopeId}><button type="button" class="px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-300 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors cursor-pointer"${_scopeId}> Batal </button><button type="submit"${ssrIncludeBooleanAttr(unref(form).processing) ? " disabled" : ""} class="px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] disabled:opacity-50 text-white text-xs font-bold rounded-xl shadow-md cursor-pointer transition-colors"${_scopeId}>${ssrInterpolate(unref(form).processing ? "Menyimpan..." : "Simpan")}</button></div></form></div></div>`);
						} else _push(`<!---->`);
					} else return [createVNode("div", { class: "space-y-6 font-sans select-none" }, [createVNode("div", { class: "flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4" }, [createVNode("div", { class: "space-y-1" }, [createVNode("h1", { class: "text-xl font-extrabold tracking-tight text-slate-900 dark:text-slate-100 flex items-center gap-2" }, [createVNode(unref(Sliders), { class: "h-5 w-5 text-[#8c5a3c]" }), createVNode("span", null, "Manajemen Add-ons (Modifiers)")]), createVNode("p", { class: "text-xs text-slate-500 dark:text-slate-400" }, " Atur pilihan tambahan makanan/minuman (extra shot, cheese, topping) serta hubungkan ke stok bahan baku secara dinamis. ")]), createVNode("button", {
						onClick: openAddModal,
						class: "px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] text-white text-xs font-bold rounded-xl flex items-center justify-center gap-1.5 transition-all shadow-md shadow-[#8c5a3c]/10 cursor-pointer"
					}, [createVNode(unref(Plus), { class: "h-4 w-4" }), createVNode("span", null, "Tambah Add-on")])]), createVNode("div", { class: "bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-2xl overflow-hidden shadow-sm" }, [
						createVNode("div", { class: "p-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between gap-4" }, [createVNode("div", { class: "relative flex-1 max-w-sm" }, [createVNode("span", { class: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none text-slate-400" }, [createVNode(unref(Search), { class: "h-4 w-4" })]), withDirectives(createVNode("input", {
							"onUpdate:modelValue": ($event) => searchQuery.value = $event,
							onKeyup: withKeys(handleSearch, ["enter"]),
							type: "text",
							placeholder: "Cari add-on...",
							class: "w-full pl-9 pr-4 py-2 border border-slate-200 dark:border-slate-800 rounded-xl text-xs bg-slate-50 dark:bg-slate-900/30 focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-800 dark:text-slate-200"
						}, null, 40, ["onUpdate:modelValue"]), [[vModelText, searchQuery.value]])])]),
						createVNode("div", { class: "overflow-x-auto" }, [createVNode("table", { class: "w-full text-left border-collapse" }, [createVNode("thead", null, [createVNode("tr", { class: "bg-slate-50 dark:bg-slate-900/20 text-slate-500 dark:text-slate-400 text-[10px] font-extrabold uppercase tracking-wider border-b border-slate-200 dark:border-slate-800" }, [
							createVNode("th", { class: "p-4" }, "Nama Add-on"),
							createVNode("th", { class: "p-4" }, "Harga Tambahan"),
							createVNode("th", { class: "p-4" }, "Stok Pengurang"),
							createVNode("th", { class: "p-4" }, "Produk Relevan"),
							createVNode("th", { class: "p-4" }, "Status"),
							createVNode("th", { class: "p-4 text-center" }, "Aksi")
						])]), createVNode("tbody", { class: "divide-y divide-slate-100 dark:divide-slate-900/50 text-xs font-semibold text-slate-700 dark:text-slate-300" }, [__props.modifiers.data.length === 0 ? (openBlock(), createBlock("tr", { key: 0 }, [createVNode("td", {
							colspan: "6",
							class: "p-8 text-center text-slate-400 font-medium"
						}, " Tidak ada data add-ons ditemukan. ")])) : createCommentVNode("", true), (openBlock(true), createBlock(Fragment, null, renderList(__props.modifiers.data, (mod) => {
							return openBlock(), createBlock("tr", {
								key: mod.id,
								class: "hover:bg-slate-50/50 dark:hover:bg-slate-900/10 transition-colors"
							}, [
								createVNode("td", { class: "p-4 font-bold text-slate-900 dark:text-slate-100" }, toDisplayString(mod.name), 1),
								createVNode("td", { class: "p-4 text-slate-800 dark:text-slate-200 font-bold" }, " Rp " + toDisplayString(Number(mod.price).toLocaleString("id-ID")), 1),
								createVNode("td", { class: "p-4" }, [mod.ingredient ? (openBlock(), createBlock("span", {
									key: 0,
									class: "inline-flex items-center gap-1.5 px-2 py-1 bg-amber-50 dark:bg-amber-950/20 border border-amber-200/50 dark:border-amber-900/30 text-amber-700 dark:text-amber-400 rounded-lg text-[10px] font-bold"
								}, [createVNode(unref(Layers), { class: "h-3 w-3" }), createTextVNode(" " + toDisplayString(mod.ingredient.name) + " (" + toDisplayString(Number(mod.usage_qty)) + " " + toDisplayString(mod.ingredient.unit) + ") ", 1)])) : (openBlock(), createBlock("span", {
									key: 1,
									class: "text-slate-400 text-[10px] font-bold"
								}, " - "))]),
								createVNode("td", { class: "p-4 max-w-xs" }, [createVNode("div", { class: "flex flex-wrap gap-1" }, [(openBlock(true), createBlock(Fragment, null, renderList(mod.products, (p) => {
									return openBlock(), createBlock("span", {
										key: p.id,
										class: "inline-block px-1.5 py-0.5 bg-slate-100 dark:bg-slate-800 text-slate-650 dark:text-slate-350 rounded text-[9px] font-bold"
									}, toDisplayString(p.name), 1);
								}), 128)), !mod.products || mod.products.length === 0 ? (openBlock(), createBlock("span", {
									key: 0,
									class: "text-rose-500 text-[10px] font-extrabold"
								}, " Belum dikaitkan produk ")) : createCommentVNode("", true)])]),
								createVNode("td", { class: "p-4" }, [createVNode("span", { class: ["px-2 py-0.5 rounded-full text-[9px] font-extrabold uppercase", mod.is_active ? "bg-emerald-50 dark:bg-emerald-950/20 border border-emerald-200/30 text-emerald-700 dark:text-emerald-450" : "bg-slate-100 dark:bg-slate-800 text-slate-400 dark:text-slate-500"] }, toDisplayString(mod.is_active ? "Aktif" : "Nonaktif"), 3)]),
								createVNode("td", { class: "p-4" }, [createVNode("div", { class: "flex items-center justify-center gap-2" }, [createVNode("button", {
									onClick: ($event) => openEditModal(mod),
									class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-500 hover:text-[#8c5a3c] rounded-lg transition-colors cursor-pointer",
									title: "Ubah"
								}, [createVNode(unref(Pencil), { class: "h-3.5 w-3.5" })], 8, ["onClick"]), createVNode("button", {
									onClick: ($event) => deleteModifier(mod),
									class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-800 text-slate-400 hover:text-rose-600 rounded-lg transition-colors cursor-pointer",
									title: "Hapus"
								}, [createVNode(unref(Trash2), { class: "h-3.5 w-3.5" })], 8, ["onClick"])])])
							]);
						}), 128))])])]),
						__props.modifiers.last_page > 1 ? (openBlock(), createBlock("div", {
							key: 0,
							class: "p-4 border-t border-slate-200 dark:border-slate-800 flex items-center justify-between"
						}, [createVNode("span", { class: "text-xs text-slate-500" }, " Menampilkan Halaman " + toDisplayString(__props.modifiers.current_page) + " dari " + toDisplayString(__props.modifiers.last_page) + " (Total " + toDisplayString(__props.modifiers.total) + " data) ", 1), createVNode("div", { class: "flex items-center gap-1" }, [(openBlock(true), createBlock(Fragment, null, renderList(__props.modifiers.links, (link) => {
							return openBlock(), createBlock(_component_Link, {
								key: link.label,
								href: link.url || "#",
								class: [
									"px-3 py-1 text-xs border rounded-lg transition-colors font-bold",
									link.active ? "bg-[#8c5a3c] border-[#8c5a3c] text-white" : "border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900 text-slate-600 dark:text-slate-400",
									!link.url ? "opacity-50 pointer-events-none" : "cursor-pointer"
								],
								innerHTML: link.label
							}, null, 8, [
								"href",
								"class",
								"innerHTML"
							]);
						}), 128))])])) : createCommentVNode("", true)
					])]), isModalOpen.value ? (openBlock(), createBlock("div", {
						key: 0,
						class: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-950/65 backdrop-blur-sm animate-in fade-in duration-150"
					}, [createVNode("div", { class: "bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-2xl w-full max-w-2xl overflow-hidden flex flex-col transform transition-all font-sans" }, [createVNode("div", { class: "px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between" }, [createVNode("h3", { class: "text-sm font-extrabold text-slate-900 dark:text-slate-100 flex items-center gap-2" }, [createVNode(unref(PlusCircle), { class: "h-4 w-4 text-[#8c5a3c]" }), createVNode("span", null, toDisplayString(modalTitle.value), 1)]), createVNode("button", {
						onClick: ($event) => isModalOpen.value = false,
						class: "p-1.5 hover:bg-slate-100 dark:hover:bg-slate-900 rounded-lg text-slate-400 cursor-pointer"
					}, [createVNode(unref(X), { class: "h-4 w-4" })], 8, ["onClick"])]), createVNode("form", {
						onSubmit: withModifiers(handleSubmit, ["prevent"]),
						class: "flex-1 overflow-y-auto max-h-[70vh] p-6 space-y-5"
					}, [createVNode("div", { class: "grid grid-cols-1 md:grid-cols-2 gap-5" }, [createVNode("div", { class: "space-y-4" }, [
						createVNode("div", { class: "space-y-1.5" }, [
							createVNode("label", { class: "block text-xs font-bold text-slate-650 dark:text-slate-350" }, "Nama Add-on"),
							withDirectives(createVNode("input", {
								"onUpdate:modelValue": ($event) => unref(form).name = $event,
								type: "text",
								required: "",
								placeholder: "Contoh: Extra Cheese, Oat Milk",
								class: "w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-850 dark:text-slate-150"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(form).name]]),
							unref(form).errors.name ? (openBlock(), createBlock("span", {
								key: 0,
								class: "text-[10px] text-rose-500 font-bold block"
							}, toDisplayString(unref(form).errors.name), 1)) : createCommentVNode("", true)
						]),
						createVNode("div", { class: "space-y-1.5" }, [
							createVNode("label", { class: "block text-xs font-bold text-slate-650 dark:text-slate-350" }, "Harga Tambahan (Rp)"),
							withDirectives(createVNode("input", {
								"onUpdate:modelValue": ($event) => unref(form).price = $event,
								type: "number",
								required: "",
								min: "0",
								placeholder: "0",
								class: "w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-850 dark:text-slate-150 font-bold"
							}, null, 8, ["onUpdate:modelValue"]), [[
								vModelText,
								unref(form).price,
								void 0,
								{ number: true }
							]]),
							unref(form).errors.price ? (openBlock(), createBlock("span", {
								key: 0,
								class: "text-[10px] text-rose-500 font-bold block"
							}, toDisplayString(unref(form).errors.price), 1)) : createCommentVNode("", true)
						]),
						createVNode("div", { class: "p-4 bg-slate-50 dark:bg-slate-900/30 border border-slate-200 dark:border-slate-800 rounded-xl space-y-3" }, [
							createVNode("h4", { class: "text-[10px] font-extrabold uppercase tracking-wider text-slate-400 flex items-center gap-1.5" }, [createVNode(unref(Layers), { class: "h-3.5 w-3.5 text-amber-500" }), createVNode("span", null, "Hubungkan ke Bahan Baku (Opsional)")]),
							createVNode("p", { class: "text-[10px] text-slate-500 dark:text-slate-400" }, " Jika dihubungkan, stok bahan baku ini akan berkurang otomatis setiap kali add-on ini terjual. "),
							createVNode("div", { class: "space-y-1.5" }, [createVNode("label", { class: "block text-[10px] font-bold text-slate-500" }, "Pilih Bahan Baku"), withDirectives(createVNode("select", {
								"onUpdate:modelValue": ($event) => unref(form).ingredient_id = $event,
								class: "w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-800 dark:text-slate-200"
							}, [createVNode("option", { value: null }, "-- Tidak Ada Pengurangan Stok --"), (openBlock(true), createBlock(Fragment, null, renderList(__props.ingredients, (ing) => {
								return openBlock(), createBlock("option", {
									key: ing.id,
									value: ing.id
								}, toDisplayString(ing.name) + " (" + toDisplayString(ing.unit) + ")", 9, ["value"]);
							}), 128))], 8, ["onUpdate:modelValue"]), [[vModelSelect, unref(form).ingredient_id]])]),
							unref(form).ingredient_id ? (openBlock(), createBlock("div", {
								key: 0,
								class: "space-y-1.5"
							}, [
								createVNode("label", { class: "block text-[10px] font-bold text-slate-500" }, "Jumlah Pemakaian per Porsi"),
								createVNode("div", { class: "flex items-center gap-2" }, [withDirectives(createVNode("input", {
									"onUpdate:modelValue": ($event) => unref(form).usage_qty = $event,
									type: "number",
									step: "0.0001",
									required: "",
									min: "0.0001",
									placeholder: "Jumlah",
									class: "w-full px-3 py-2 text-xs border border-slate-200 dark:border-slate-800 rounded-lg bg-transparent focus:outline-none focus:ring-1 focus:ring-[#8c5a3c] text-slate-850 dark:text-slate-150"
								}, null, 8, ["onUpdate:modelValue"]), [[
									vModelText,
									unref(form).usage_qty,
									void 0,
									{ number: true }
								]]), createVNode("span", { class: "text-xs text-slate-400 font-bold" }, toDisplayString(__props.ingredients.find((i) => i.id === unref(form).ingredient_id)?.unit), 1)]),
								unref(form).errors.usage_qty ? (openBlock(), createBlock("span", {
									key: 0,
									class: "text-[10px] text-rose-500 font-bold block"
								}, toDisplayString(unref(form).errors.usage_qty), 1)) : createCommentVNode("", true)
							])) : createCommentVNode("", true)
						]),
						createVNode("div", { class: "flex items-center justify-between p-3 bg-slate-50 dark:bg-slate-900/30 border border-slate-200 dark:border-slate-800 rounded-xl" }, [createVNode("div", { class: "space-y-0.5" }, [createVNode("label", { class: "block text-xs font-bold text-slate-850 dark:text-slate-150" }, "Status Add-on"), createVNode("span", { class: "text-[10px] text-slate-400" }, "Aktifkan agar dapat dipilih saat transaksi.")]), createVNode("label", { class: "relative inline-flex items-center cursor-pointer select-none" }, [withDirectives(createVNode("input", {
							type: "checkbox",
							"onUpdate:modelValue": ($event) => unref(form).is_active = $event,
							class: "sr-only peer"
						}, null, 8, ["onUpdate:modelValue"]), [[vModelCheckbox, unref(form).is_active]]), createVNode("div", { class: "w-10 h-5 bg-slate-200 dark:bg-slate-800 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-slate-600 peer-checked:bg-[#8c5a3c]" })])])
					]), createVNode("div", { class: "flex flex-col border border-slate-200 dark:border-slate-800 rounded-xl overflow-hidden bg-slate-50/50 dark:bg-slate-900/10" }, [createVNode("div", { class: "p-3.5 border-b border-slate-200 dark:border-slate-800 bg-slate-50 dark:bg-slate-900/20 flex items-center justify-between" }, [createVNode("div", { class: "flex items-center gap-2" }, [createVNode(unref(Coffee), { class: "h-4 w-4 text-[#8c5a3c]" }), createVNode("span", { class: "text-xs font-extrabold text-slate-900 dark:text-slate-100" }, "Kaitkan ke Produk")]), createVNode("span", { class: "text-[10px] font-bold text-slate-450" }, toDisplayString(unref(form).product_ids.length) + " produk dipilih ", 1)]), createVNode("div", { class: "p-4 space-y-4 flex-1 overflow-y-auto max-h-[360px]" }, [__props.products.length === 0 ? (openBlock(), createBlock("div", {
						key: 0,
						class: "text-center py-8 text-slate-400 text-xs font-medium"
					}, " Belum ada data produk tersedia. ")) : createCommentVNode("", true), (openBlock(true), createBlock(Fragment, null, renderList(groupedProducts.value, (prods, cat) => {
						return openBlock(), createBlock("div", {
							key: cat,
							class: "space-y-2 border-b border-slate-200/50 dark:border-slate-800/40 pb-3 last:border-0 last:pb-0"
						}, [createVNode("div", { class: "flex items-center justify-between" }, [createVNode("span", { class: "text-[10px] font-black uppercase tracking-wider text-slate-400 flex items-center gap-1" }, [createVNode(unref(Tag), { class: "h-3 w-3" }), createTextVNode(" " + toDisplayString(cat), 1)]), createVNode("button", {
							type: "button",
							onClick: ($event) => toggleCategoryProducts(cat, !isCategoryFullySelected(cat)),
							class: "text-[9px] font-bold text-[#8c5a3c] hover:underline cursor-pointer"
						}, toDisplayString(isCategoryFullySelected(cat) ? "Pilih Semua" : "Batal Semua"), 9, ["onClick"])]), createVNode("div", { class: "grid grid-cols-1 gap-2 pt-1" }, [(openBlock(true), createBlock(Fragment, null, renderList(prods, (prod) => {
							return openBlock(), createBlock("label", {
								key: prod.id,
								class: "flex items-center gap-2.5 p-2 rounded-lg hover:bg-slate-100 dark:hover:bg-slate-900 border border-slate-200/40 dark:border-slate-800/30 text-xs font-bold text-slate-700 dark:text-slate-300 cursor-pointer select-none transition-colors"
							}, [withDirectives(createVNode("input", {
								type: "checkbox",
								"onUpdate:modelValue": ($event) => unref(form).product_ids = $event,
								value: prod.id,
								class: "h-3.5 w-3.5 rounded border-slate-300 text-[#8c5a3c] focus:ring-[#8c5a3c]"
							}, null, 8, ["onUpdate:modelValue", "value"]), [[vModelCheckbox, unref(form).product_ids]]), createVNode("div", { class: "flex-1 flex items-center justify-between" }, [createVNode("span", null, toDisplayString(prod.name), 1), createVNode("span", { class: "text-[10px] text-slate-400" }, "Rp" + toDisplayString(Number(prod.price).toLocaleString("id-ID")), 1)])]);
						}), 128))])]);
					}), 128))])])]), createVNode("div", { class: "pt-4 border-t border-slate-200 dark:border-slate-800 flex items-center justify-end gap-3" }, [createVNode("button", {
						type: "button",
						onClick: ($event) => isModalOpen.value = false,
						class: "px-4 py-2 border border-slate-200 dark:border-slate-800 text-slate-700 dark:text-slate-300 text-xs font-bold rounded-xl hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors cursor-pointer"
					}, " Batal ", 8, ["onClick"]), createVNode("button", {
						type: "submit",
						disabled: unref(form).processing,
						class: "px-4 py-2 bg-[#8c5a3c] hover:bg-[#734a31] disabled:opacity-50 text-white text-xs font-bold rounded-xl shadow-md cursor-pointer transition-colors"
					}, toDisplayString(unref(form).processing ? "Menyimpan..." : "Simpan"), 9, ["disabled"])])], 32)])])) : createCommentVNode("", true)];
				}),
				_: 1
			}, _parent));
			_push(`<!--]-->`);
		};
	}
});
//#endregion
//#region resources/js/Pages/CafePOS/Modifiers/Index.vue
var _sfc_setup = Index_vue_vue_type_script_setup_true_lang_default.setup;
Index_vue_vue_type_script_setup_true_lang_default.setup = (props, ctx) => {
	const ssrContext = useSSRContext();
	(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/Pages/CafePOS/Modifiers/Index.vue");
	return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
var Index_default = Index_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { Index_default as default };
