@lodashventure/medusa-parcel-shipping 0.2.11 → 0.2.18

package/.medusa/server/src/admin/index.js

@@ -1,1542 +1,2047 @@
 "use strict";
 const jsxRuntime = require("react/jsx-runtime");
 const adminSdk = require("@medusajs/admin-sdk");
-const icons = require("@medusajs/icons");
-const react = require("react");
 const ui = require("@medusajs/ui");
-const requestJson$1 = async (url, method = "GET", body) => {
-  const response = await fetch(url, {
-    method,
-    headers: {
-      "Content-Type": "application/json"
-    },
-    body: body ? JSON.stringify(body) : void 0,
-    credentials: "include"
-  });
-  if (!response.ok) {
-    let message = response.statusText;
-    try {
-      const payload = await response.json();
-      message = (payload == null ? void 0 : payload.code) ?? (payload == null ? void 0 : payload.error) ?? message;
-    } catch (_) {
-    }
-    throw new Error(message);
-  }
-  if (response.status === 204) {
-    return void 0;
-  }
-  return await response.json();
-};
-const toNumber$1 = (value) => {
-  if (value.trim().length === 0) {
-    return null;
-  }
-  const parsed = Number(value);
-  return Number.isFinite(parsed) ? parsed : null;
-};
-function ParcelBoxesPage() {
-  const [boxes, setBoxes] = react.useState([]);
-  const [loading, setLoading] = react.useState(true);
-  const [formState, setFormState] = react.useState({
-    id: null,
-    name: "",
-    width_cm: "",
-    length_cm: "",
-    height_cm: "",
-    max_weight_kg: "",
-    price_thb: "",
-    active: true
-  });
-  const [saving, setSaving] = react.useState(false);
-  const [deletingId, setDeletingId] = react.useState(null);
-  const refresh = react.useCallback(async () => {
+const react = require("react");
+const lucideReact = require("lucide-react");
+const icons = require("@medusajs/icons");
+const OrderShippingQuoteWidget = ({ data }) => {
+  const [quote, setQuote] = react.useState(null);
+  const [loading, setLoading] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const order = data;
+  const fetchShippingQuote = async () => {
     setLoading(true);
+    setError(null);
     try {
-      const data = await requestJson$1(
-        "/admin/parcel-boxes"
-      );
-      setBoxes(data.boxes ?? []);
-    } catch (error) {
-      ui.toast.error(error.message ?? "Failed to load boxes", {
-        dismissable: true
+      const items = order.items.map((item) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
+        return {
+          sku: ((_a = item.variant) == null ? void 0 : _a.sku) || item.title,
+          width: ((_b = item.variant) == null ? void 0 : _b.width) || ((_d = (_c = item.variant) == null ? void 0 : _c.product) == null ? void 0 : _d.width) || 10,
+          length: ((_e = item.variant) == null ? void 0 : _e.length) || ((_g = (_f = item.variant) == null ? void 0 : _f.product) == null ? void 0 : _g.length) || 10,
+          height: ((_h = item.variant) == null ? void 0 : _h.height) || ((_j = (_i = item.variant) == null ? void 0 : _i.product) == null ? void 0 : _j.height) || 10,
+          weight: ((_k = item.variant) == null ? void 0 : _k.weight) || ((_m = (_l = item.variant) == null ? void 0 : _l.product) == null ? void 0 : _m.weight) || 0.1,
+          quantity: item.quantity,
+          attributes: {
+            fragile: ((_o = (_n = item.variant) == null ? void 0 : _n.metadata) == null ? void 0 : _o.fragile) || false,
+            noStack: ((_q = (_p = item.variant) == null ? void 0 : _p.metadata) == null ? void 0 : _q.noStack) || false,
+            stackable: (_s = (_r = item.variant) == null ? void 0 : _r.metadata) == null ? void 0 : _s.stackable
+          }
+        };
+      });
+      const shippingAddress = order.shipping_address;
+      const payload = {
+        items,
+        shipping_address: {
+          address_line_1: (shippingAddress == null ? void 0 : shippingAddress.address_1) || "",
+          address_line_2: (shippingAddress == null ? void 0 : shippingAddress.address_2) || "",
+          city: (shippingAddress == null ? void 0 : shippingAddress.city) || "",
+          province: (shippingAddress == null ? void 0 : shippingAddress.province) || "",
+          postcode: (shippingAddress == null ? void 0 : shippingAddress.postal_code) || "",
+          country: (shippingAddress == null ? void 0 : shippingAddress.country_code) || "TH"
+        },
+        allow_split_boxes: true
+      };
+      const response = await fetch("/store/quote", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-publishable-api-key": "pk_99d0d47048eaf52697f42d149a7f58c1661652292b9e1ea1445f519cd16dc071"
+        },
+        body: JSON.stringify(payload)
       });
+      if (!response.ok) {
+        const errorData = await response.json();
+        throw new Error(errorData.message || "Failed to fetch quote");
+      }
+      const data2 = await response.json();
+      setQuote(data2);
+    } catch (err) {
+      setError(err.message);
     } finally {
       setLoading(false);
     }
-  }, []);
-  react.useEffect(() => {
-    refresh();
-  }, [refresh]);
-  const resetForm = () => setFormState({
-    id: null,
-    name: "",
-    width_cm: "",
-    length_cm: "",
-    height_cm: "",
-    max_weight_kg: "",
-    price_thb: "",
+  };
+  const getServiceName = (carrierType, serviceCode) => {
+    const serviceNames = {
+      COMPANY_FLEET_MESSENGER_3H: "ส่งด่วน 3 ชั่วโมง",
+      COMPANY_TRUCK_SAME_DAY: "ส่งด่วนภายในวัน",
+      PRIVATE_CARRIER_STANDARD_3_5D: "EMS ไปรษณีย์ (3-5 วัน)",
+      PRIVATE_CARRIER_EXPRESS_1_2D: "Express (1-2 วัน)"
+    };
+    return serviceNames[`${carrierType}_${serviceCode}`] || `${carrierType} - ${serviceCode}`;
+  };
+  const formatETA = (option) => {
+    if (option.eta_hours_min && option.eta_hours_max) {
+      return `${option.eta_hours_min}-${option.eta_hours_max} ชั่วโมง`;
+    }
+    if (option.eta_days_min && option.eta_days_max) {
+      return `${option.eta_days_min}-${option.eta_days_max} วัน`;
+    }
+    return "N/A";
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Package, { className: "text-ui-fg-subtle" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", children: "ตัวเลือกการจัดส่ง" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ui.Button,
+        {
+          size: "small",
+          onClick: fetchShippingQuote,
+          isLoading: loading,
+          disabled: !order.shipping_address,
+          children: "คำนวณค่าจัดส่ง"
+        }
+      )
+    ] }),
+    !order.shipping_address && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-ui-fg-subtle", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", children: "กรุณาเพิ่มที่อยู่จัดส่งก่อนคำนวณค่าจัดส่ง" })
+    ] }) }),
+    error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-red-500", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", children: error })
+    ] }) }),
+    quote && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 py-4 space-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg border p-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Package, { className: "text-ui-fg-subtle", size: 20 }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { weight: "plus", size: "small", children: [
+            "กล่องที่แนะนำ: ",
+            quote.best_box.name
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-2 text-sm text-ui-fg-subtle", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            "ขนาด: ",
+            quote.best_box.width_cm,
+            " × ",
+            quote.best_box.length_cm,
+            " ×",
+            " ",
+            quote.best_box.height_cm,
+            " cm"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            "น้ำหนักรวม: ",
+            quote.packing.totalWeightKg.toFixed(2),
+            " kg"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            "ความสูงที่ใช้: ",
+            quote.packing.usedHeight,
+            " cm"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            "ว่างเหลือ: ",
+            quote.packing.headroom,
+            " cm"
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "plus", size: "small", children: "ตัวเลือกการจัดส่ง" }),
+        quote.shipping_options.map((option, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: `rounded-lg border p-4 ${!option.available ? "opacity-50 bg-ui-bg-subtle" : "bg-ui-bg-base"}`,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between mb-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Truck, { className: "text-ui-fg-subtle", size: 20 }),
+                  /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "plus", children: getServiceName(option.carrier_type, option.service_code) }),
+                  option.available ? /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: "green", size: "small", children: "พร้อมใช้งาน" }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: "red", size: "small", children: "ไม่พร้อมใช้งาน" })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { weight: "plus", size: "large", children: [
+                  "฿",
+                  option.price.toFixed(2)
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-2 text-sm text-ui-fg-subtle mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { size: 16 }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                  "เวลาจัดส่ง: ",
+                  formatETA(option)
+                ] })
+              ] }) }),
+              !option.available && option.reason && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-sm text-red-500 mb-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { size: 16 }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: option.reason })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 pt-3 border-t space-y-1 text-sm", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between text-ui-fg-subtle", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "ค่ากล่อง:" }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                    "฿",
+                    option.price_breakdown.box_cost.toFixed(2)
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between text-ui-fg-subtle", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "ค่าวัสดุห่อหุ้ม:" }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                    "฿",
+                    option.price_breakdown.packaging_materials_cost.toFixed(
+                      2
+                    )
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between text-ui-fg-subtle", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "ค่าจัดส่ง:" }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                    "฿",
+                    option.price_breakdown.shipping_cost.toFixed(2)
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between font-semibold pt-1 border-t", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "รวมทั้งหมด:" }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                    "฿",
+                    option.price_breakdown.total.toFixed(2)
+                  ] })
+                ] })
+              ] })
+            ]
+          },
+          index
+        ))
+      ] })
+    ] })
+  ] });
+};
+adminSdk.defineWidgetConfig({
+  zone: "order.details.after"
+});
+const TH_PROVINCES = [
+  "กรุงเทพมหานคร",
+  "กระบี่",
+  "กาญจนบุรี",
+  "กาฬสินธุ์",
+  "กำแพงเพชร",
+  "ขอนแก่น",
+  "จันทบุรี",
+  "ฉะเชิงเทรา",
+  "ชลบุรี",
+  "ชัยนาท",
+  "ชัยภูมิ",
+  "ชุมพร",
+  "เชียงราย",
+  "เชียงใหม่",
+  "ตรัง",
+  "ตราด",
+  "ตาก",
+  "นครนายก",
+  "นครปฐม",
+  "นครพนม",
+  "นครราชสีมา",
+  "นครศรีธรรมราช",
+  "นครสวรรค์",
+  "นนทบุรี",
+  "นราธิวาส",
+  "น่าน",
+  "บึงกาฬ",
+  "บุรีรัมย์",
+  "ปทุมธานี",
+  "ประจวบคีรีขันธ์",
+  "ปราจีนบุรี",
+  "ปัตตานี",
+  "พระนครศรีอยุธยา",
+  "พะเยา",
+  "พังงา",
+  "พัทลุง",
+  "พิจิตร",
+  "พิษณุโลก",
+  "เพชรบุรี",
+  "เพชรบูรณ์",
+  "แพร่",
+  "ภูเก็ต",
+  "มหาสารคาม",
+  "มุกดาหาร",
+  "แม่ฮ่องสอน",
+  "ยโสธร",
+  "ยะลา",
+  "ร้อยเอ็ด",
+  "ระนอง",
+  "ระยอง",
+  "ราชบุรี",
+  "ลพบุรี",
+  "ลำปาง",
+  "ลำพูน",
+  "เลย",
+  "ศรีสะเกษ",
+  "สกลนคร",
+  "สงขลา",
+  "สตูล",
+  "สมุทรปราการ",
+  "สมุทรสงคราม",
+  "สมุทรสาคร",
+  "สระแก้ว",
+  "สระบุรี",
+  "สิงห์บุรี",
+  "สุโขทัย",
+  "สุพรรณบุรี",
+  "สุราษฎร์ธานี",
+  "สุรินทร์",
+  "หนองคาย",
+  "หนองบัวลำภู",
+  "อ่างทอง",
+  "อำนาจเจริญ",
+  "อุดรธานี",
+  "อุตรดิตถ์",
+  "อุทัยธานี",
+  "อุบลราชธานี"
+];
+const ServiceAreaModal = ({ area, onClose }) => {
+  const [formData, setFormData] = react.useState({
+    kind: "PROVINCE",
+    value: "",
     active: true
   });
-  const handleSubmit = async () => {
-    const width = toNumber$1(formState.width_cm);
-    const length = toNumber$1(formState.length_cm);
-    const height = toNumber$1(formState.height_cm);
-    const maxWeight = toNumber$1(formState.max_weight_kg);
-    const price = toNumber$1(formState.price_thb);
-    if (!formState.name.trim() || width === null || length === null || height === null || maxWeight === null || price === null) {
-      ui.toast.error("Fill all fields with valid numeric values", {
-        dismissable: true
+  const [isSaving, setIsSaving] = react.useState(false);
+  react.useEffect(() => {
+    if (area) {
+      setFormData({
+        kind: area.kind,
+        value: area.value,
+        active: area.active
+      });
+    }
+  }, [area]);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    const errors = [];
+    const trimmedValue = formData.value.trim();
+    if (!trimmedValue) {
+      errors.push("กรุณากรอกค่า");
+    }
+    if (formData.kind === "PROVINCE") {
+      if (!TH_PROVINCES.includes(trimmedValue)) {
+        errors.push("จังหวัดไม่ถูกต้อง กรุณาตรวจสอบการสะกดชื่อจังหวัด");
+      }
+    } else if (formData.kind === "POSTCODE_PREFIX") {
+      if (!/^\d{1,5}$/.test(trimmedValue)) {
+        errors.push("รหัสไปรษณีย์ต้องเป็นตัวเลข 1-5 หลัก");
+      }
+    }
+    if (errors.length > 0) {
+      ui.toast.error("ข้อมูลไม่ถูกต้อง", {
+        description: errors.join(", ")
       });
       return;
     }
-    const payload = {
-      name: formState.name.trim(),
-      width_cm: width,
-      length_cm: length,
-      height_cm: height,
-      max_weight_kg: maxWeight,
-      price_thb: price,
-      active: formState.active
-    };
-    setSaving(true);
+    setIsSaving(true);
     try {
-      if (formState.id) {
-        await requestJson$1(
-          `/admin/parcel-boxes/${formState.id}`,
-          "PUT",
-          payload
-        );
-        ui.toast.success("Box updated", { dismissable: true });
+      const payload = {
+        kind: formData.kind,
+        value: trimmedValue,
+        active: formData.active
+      };
+      const url = area ? `/admin/service-areas/${area.id}` : "/admin/service-areas";
+      const method = area ? "PUT" : "POST";
+      const response = await fetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(payload)
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: area ? "แก้ไขพื้นที่บริการแล้ว" : "สร้างพื้นที่บริการใหม่แล้ว"
+        });
+        onClose();
       } else {
-        await requestJson$1("/admin/parcel-boxes", "POST", payload);
-        ui.toast.success("Box created", { dismissable: true });
+        const error = await response.json();
+        throw new Error(error.message || "Failed to save");
       }
-      await refresh();
-      resetForm();
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to save box", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: error instanceof Error ? error.message : "ไม่สามารถบันทึกข้อมูลได้"
       });
     } finally {
-      setSaving(false);
+      setIsSaving(false);
     }
   };
-  const handleDelete = async (id) => {
-    setDeletingId(id);
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer, { open: true, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Content, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Title, { children: area ? "แก้ไขพื้นที่บริการ" : "สร้างพื้นที่บริการใหม่" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "kind", children: "ประเภท *" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.Select,
+          {
+            value: formData.kind,
+            onValueChange: (value) => setFormData({ ...formData, kind: value, value: "" }),
+            required: true,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "เลือกประเภท" }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs(ui.Select.Content, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: "PROVINCE", children: "จังหวัด" }),
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: "POSTCODE_PREFIX", children: "รหัสไปรษณีย์" })
+              ] })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "value", children: formData.kind === "PROVINCE" ? "ชื่อจังหวัด *" : "รหัสไปรษณีย์ (1-5 หลัก) *" }),
+        formData.kind === "PROVINCE" ? /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.Select,
+          {
+            value: formData.value,
+            onValueChange: (value) => setFormData({ ...formData, value }),
+            required: true,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "เลือกจังหวัด" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: TH_PROVINCES.map((province) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: province, children: province }, province)) })
+            ]
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "value",
+            type: "text",
+            value: formData.value,
+            onChange: (e) => setFormData({ ...formData, value: e.target.value }),
+            placeholder: "เช่น 10, 102, 10200",
+            maxLength: 5,
+            pattern: "\\d{1,5}",
+            required: true
+          }
+        ),
+        formData.kind === "POSTCODE_PREFIX" && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-ui-fg-subtle mt-1", children: 'ใส่รหัส 1-5 หลักเพื่อครอบคลุมหลายพื้นที่ เช่น "10" = กรุงเทพฯ ทั้งหมด' })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Switch,
+          {
+            id: "active",
+            checked: formData.active,
+            onCheckedChange: (checked) => setFormData({ ...formData, active: checked })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "active", children: "เปิดใช้งาน" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Footer, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Button,
+          {
+            type: "button",
+            variant: "secondary",
+            onClick: onClose,
+            disabled: isSaving,
+            children: "ยกเลิก"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", disabled: isSaving, children: isSaving ? "กำลังบันทึก..." : "บันทึก" })
+      ] })
+    ] }) })
+  ] }) });
+};
+const AREA_KINDS = [
+  { value: "ALL", label: "ทั้งหมด" },
+  { value: "PROVINCE", label: "จังหวัด" },
+  { value: "POSTCODE_PREFIX", label: "รหัสไปรษณีย์" }
+];
+const ServiceAreasTable = () => {
+  const [areas, setAreas] = react.useState([]);
+  const [filteredAreas, setFilteredAreas] = react.useState([]);
+  const [searchTerm, setSearchTerm] = react.useState("");
+  const [kindFilter, setKindFilter] = react.useState("ALL");
+  const [isModalOpen, setIsModalOpen] = react.useState(false);
+  const [editingArea, setEditingArea] = react.useState(null);
+  const [isLoading, setIsLoading] = react.useState(false);
+  const [deleteAreaId, setDeleteAreaId] = react.useState(null);
+  const [deleteAreaValue, setDeleteAreaValue] = react.useState("");
+  react.useEffect(() => {
+    fetchAreas();
+  }, []);
+  react.useEffect(() => {
+    let filtered = areas;
+    if (kindFilter !== "ALL") {
+      filtered = filtered.filter((area) => area.kind === kindFilter);
+    }
+    if (searchTerm) {
+      filtered = filtered.filter(
+        (area) => area.value.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+    setFilteredAreas(filtered);
+  }, [searchTerm, kindFilter, areas]);
+  const fetchAreas = async () => {
+    setIsLoading(true);
     try {
-      await requestJson$1(`/admin/parcel-boxes/${id}`, "DELETE");
-      ui.toast.success("Box removed", { dismissable: true });
-      await refresh();
+      const response = await fetch("/admin/service-areas", {
+        credentials: "include"
+      });
+      const data = await response.json();
+      console.log("Fetched service areas:", data);
+      setAreas(data.service_areas || []);
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to delete box", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถโหลดข้อมูลพื้นที่บริการได้"
       });
     } finally {
-      setDeletingId(null);
+      setIsLoading(false);
     }
   };
-  const handleToggle = async (box) => {
+  const handleToggleActive = async (area) => {
     try {
-      await requestJson$1(`/admin/parcel-boxes/${box.id}`, "PUT", {
-        active: !box.active
+      const response = await fetch(`/admin/service-areas/${area.id}`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ ...area, active: !area.active })
       });
-      await refresh();
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: `${area.active ? "ปิดใช้งาน" : "เปิดใช้งาน"}พื้นที่ ${area.value} แล้ว`
+        });
+        fetchAreas();
+      } else {
+        throw new Error("Failed to update");
+      }
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to update box status", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถอัพเดทสถานะได้"
       });
     }
   };
-  const tableRows = react.useMemo(() => {
-    if (loading) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 6, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "Loading boxes..." }) }) });
-    }
-    if (boxes.length === 0) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 6, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "No boxes configured yet." }) }) });
+  const handleDelete = async () => {
+    if (!deleteAreaId) return;
+    try {
+      const response = await fetch(`/admin/service-areas/${deleteAreaId}`, {
+        method: "DELETE",
+        credentials: "include"
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: `ลบพื้นที่ ${deleteAreaValue} แล้ว`
+        });
+        fetchAreas();
+      } else {
+        throw new Error("Failed to delete");
+      }
+    } catch (error) {
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถลบพื้นที่ได้"
+      });
+    } finally {
+      setDeleteAreaId(null);
+      setDeleteAreaValue("");
     }
-    return boxes.map((box) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "font-medium", children: box.name }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "text-sm text-ui-fg-subtle", children: [
-        box.width_cm,
-        " × ",
-        box.length_cm,
-        " × ",
-        box.height_cm
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.max_weight_kg }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.price_thb }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: box.active ? "green" : "grey", children: box.active ? "Active" : "Inactive" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Switch,
-          {
-            checked: box.active,
-            onCheckedChange: () => handleToggle(box)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            variant: "secondary",
-            size: "small",
-            onClick: () => setFormState({
-              id: box.id,
-              name: box.name,
-              width_cm: String(box.width_cm),
-              length_cm: String(box.length_cm),
-              height_cm: String(box.height_cm),
-              max_weight_kg: String(box.max_weight_kg),
-              price_thb: String(box.price_thb),
-              active: box.active
-            }),
-            children: "Edit"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            variant: "danger",
-            size: "small",
-            onClick: () => handleDelete(box.id),
-            disabled: deletingId === box.id,
-            children: "Delete"
-          }
-        )
-      ] }) })
-    ] }, box.id));
-  }, [boxes, deletingId, loading]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "space-y-6 p-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "Parcel Boxes" }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-ui-fg-subtle", children: "Configure and manage parcel box sizes and pricing." })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 rounded-md border p-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", children: formState.id ? "Edit Box" : "Create Box" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-name",
-              children: "Name"
-            }
-          ),
+  };
+  const handleEdit = (area) => {
+    setEditingArea(area);
+    setIsModalOpen(true);
+  };
+  const handleCreateNew = () => {
+    setEditingArea(null);
+    setIsModalOpen(true);
+  };
+  const handleModalClose = () => {
+    setIsModalOpen(false);
+    setEditingArea(null);
+    fetchAreas();
+  };
+  const openDeletePrompt = (id, value) => {
+    setDeleteAreaId(id);
+    setDeleteAreaValue(value);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-x-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-x-4 flex-1", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-box-name",
-              placeholder: "Enter box name",
-              value: formState.name,
-              onChange: (event) => setFormState((prev) => ({ ...prev, name: event.target.value }))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-width",
-              children: "Width (cm)"
+              type: "search",
+              placeholder: "ค้นหาจังหวัดหรือรหัสไปรษณีย์...",
+              value: searchTerm,
+              onChange: (e) => setSearchTerm(e.target.value),
+              className: "max-w-md"
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-box-width",
-              placeholder: "e.g. 20",
-              type: "number",
-              value: formState.width_cm,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                width_cm: event.target.value
-              }))
-            }
-          )
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { value: kindFilter, onValueChange: setKindFilter, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "ประเภท" }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: AREA_KINDS.map((kind) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: kind.value, children: kind.label }, kind.value)) })
+          ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-length",
-              children: "Length (cm)"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-box-length",
-              placeholder: "e.g. 30",
-              type: "number",
-              value: formState.length_cm,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                length_cm: event.target.value
-              }))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { onClick: handleCreateNew, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, {}),
+          "สร้างพื้นที่ใหม่"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ประเภท" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ค่า" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "สถานะ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "การจัดการ" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "กำลังโหลด..." }) }) : filteredAreas.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "ไม่พบข้อมูลพื้นที่บริการ" }) }) : filteredAreas.map((area) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: area.kind === "PROVINCE" ? "blue" : "purple", children: area.kind === "PROVINCE" ? "จังหวัด" : "รหัสไปรษณีย์" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: area.value }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Badge,
             {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-height",
-              children: "Height (cm)"
+              color: area.active ? "green" : "grey",
+              className: "cursor-pointer",
+              onClick: () => handleToggleActive(area),
+              children: area.active ? "เปิดใช้งาน" : "ปิดใช้งาน"
             }
-          ),
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => handleEdit(area),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Edit, {})
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => openDeletePrompt(area.id, area.value),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash, {})
+              }
+            )
+          ] }) })
+        ] }, area.id)) })
+      ] })
+    ] }),
+    isModalOpen && /* @__PURE__ */ jsxRuntime.jsx(ServiceAreaModal, { area: editingArea, onClose: handleModalClose }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Prompt,
+      {
+        variant: "confirmation",
+        open: !!deleteAreaId,
+        onOpenChange: () => {
+          setDeleteAreaId(null);
+          setDeleteAreaValue("");
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Content, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Header, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Title, { children: "ลบพื้นที่บริการ" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Description, { children: [
+              'คุณต้องการลบพื้นที่ "',
+              deleteAreaValue,
+              '" ใช่หรือไม่? การดำเนินการนี้ไม่สามารถย้อนกลับได้'
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Footer, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Cancel, { children: "ยกเลิก" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Action, { onClick: handleDelete, children: "ลบ" })
+          ] })
+        ] })
+      }
+    )
+  ] });
+};
+const AreasPage = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "พื้นที่บริการ" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ServiceAreasTable, {})
+  ] }) });
+};
+const config$3 = adminSdk.defineRouteConfig({
+  icon: icons.MapPin,
+  label: "พื้นที่บริการ"
+});
+const ParcelBoxModal = ({ box, onClose }) => {
+  const [formData, setFormData] = react.useState({
+    name: "",
+    width_cm: "",
+    length_cm: "",
+    height_cm: "",
+    max_weight_kg: "",
+    price_thb: "",
+    active: true
+  });
+  const [isSaving, setIsSaving] = react.useState(false);
+  react.useEffect(() => {
+    if (box) {
+      setFormData({
+        name: box.name,
+        width_cm: box.width_cm.toString(),
+        length_cm: box.length_cm.toString(),
+        height_cm: box.height_cm.toString(),
+        max_weight_kg: box.max_weight_kg.toString(),
+        price_thb: box.price_thb.toString(),
+        active: box.active
+      });
+    }
+  }, [box]);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    const errors = [];
+    if (!formData.name.trim()) {
+      errors.push("กรุณากรอกชื่อกล่อง");
+    }
+    const width = parseFloat(formData.width_cm);
+    const length = parseFloat(formData.length_cm);
+    const height = parseFloat(formData.height_cm);
+    const maxWeight = parseFloat(formData.max_weight_kg);
+    const price = parseFloat(formData.price_thb);
+    if (isNaN(width) || width <= 0) {
+      errors.push("ความกว้างต้องเป็นตัวเลขมากกว่า 0");
+    }
+    if (isNaN(length) || length <= 0) {
+      errors.push("ความยาวต้องเป็นตัวเลขมากกว่า 0");
+    }
+    if (isNaN(height) || height <= 0) {
+      errors.push("ความสูงต้องเป็นตัวเลขมากกว่า 0");
+    }
+    if (isNaN(maxWeight) || maxWeight <= 0) {
+      errors.push("น้ำหนักสูงสุดต้องเป็นตัวเลขมากกว่า 0");
+    }
+    if (isNaN(price) || price < 0) {
+      errors.push("ราคาต้องเป็นตัวเลขไม่ติดลบ");
+    }
+    if (errors.length > 0) {
+      ui.toast.error("ข้อมูลไม่ถูกต้อง", {
+        description: errors.join(", ")
+      });
+      return;
+    }
+    setIsSaving(true);
+    try {
+      const payload = {
+        name: formData.name.trim(),
+        width_cm: width,
+        length_cm: length,
+        height_cm: height,
+        max_weight_kg: maxWeight,
+        price_thb: price,
+        active: formData.active
+      };
+      const url = box ? `/admin/boxes/${box.id}` : "/admin/boxes";
+      const method = box ? "PUT" : "POST";
+      const response = await fetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(payload)
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: box ? "แก้ไขกล่องพัสดุแล้ว" : "สร้างกล่องพัสดุใหม่แล้ว"
+        });
+        onClose();
+      } else {
+        const error = await response.json();
+        throw new Error(error.message || "Failed to save");
+      }
+    } catch (error) {
+      ui.toast.error("ข้อผิดพลาด", {
+        description: error instanceof Error ? error.message : "ไม่สามารถบันทึกข้อมูลได้"
+      });
+    } finally {
+      setIsSaving(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer, { open: true, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Content, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Title, { children: box ? "แก้ไขกล่องพัสดุ" : "สร้างกล่องพัสดุใหม่" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "name", children: "ชื่อกล่อง *" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "name",
+            value: formData.name,
+            onChange: (e) => setFormData({ ...formData, name: e.target.value }),
+            placeholder: "เช่น กล่อง S, กล่อง M",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-3 gap-x-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "width", children: "ความกว้าง (cm) *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-box-height",
-              placeholder: "e.g. 15",
+              id: "width",
               type: "number",
-              value: formState.height_cm,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                height_cm: event.target.value
-              }))
+              step: "0.1",
+              value: formData.width_cm,
+              onChange: (e) => setFormData({ ...formData, width_cm: e.target.value }),
+              placeholder: "20",
+              required: true
             }
           )
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-max-weight",
-              children: "Max Weight (kg)"
-            }
-          ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "length", children: "ความยาว (cm) *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-box-max-weight",
-              placeholder: "e.g. 0.5",
+              id: "length",
               type: "number",
-              value: formState.max_weight_kg,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                max_weight_kg: event.target.value
-              }))
+              step: "0.1",
+              value: formData.length_cm,
+              onChange: (e) => setFormData({ ...formData, length_cm: e.target.value }),
+              placeholder: "30",
+              required: true
             }
           )
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-price",
-              children: "Box Price (THB)"
-            }
-          ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "height", children: "ความสูง (cm) *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-box-price",
-              placeholder: "e.g. 10",
+              id: "height",
               type: "number",
-              value: formState.price_thb,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                price_thb: event.target.value
-              }))
+              step: "0.1",
+              value: formData.height_cm,
+              onChange: (e) => setFormData({ ...formData, height_cm: e.target.value }),
+              placeholder: "15",
+              required: true
             }
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "maxWeight", children: "น้ำหนักสูงสุด (kg) *" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "maxWeight",
+            type: "number",
+            step: "0.1",
+            value: formData.max_weight_kg,
+            onChange: (e) => setFormData({ ...formData, max_weight_kg: e.target.value }),
+            placeholder: "0.5",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "price", children: "ราคา (THB) *" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "price",
+            type: "number",
+            step: "0.01",
+            value: formData.price_thb,
+            onChange: (e) => setFormData({ ...formData, price_thb: e.target.value }),
+            placeholder: "10.00",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           ui.Switch,
           {
-            checked: formState.active,
-            onCheckedChange: (active) => setFormState((prev) => ({ ...prev, active }))
+            id: "active",
+            checked: formData.active,
+            onCheckedChange: (checked) => setFormData({ ...formData, active: checked })
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-sm text-ui-fg-subtle", children: "Active" })
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "active", children: "เปิดใช้งาน" })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: handleSubmit, disabled: saving, children: formState.id ? "Update" : "Create" }),
-        formState.id && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", onClick: resetForm, children: "Cancel" })
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Footer, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "button", variant: "secondary", onClick: onClose, disabled: isSaving, children: "ยกเลิก" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", disabled: isSaving, children: isSaving ? "กำลังบันทึก..." : "บันทึก" })
       ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Name" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Dimensions (cm)" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Max Weight (kg)" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Price" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Status" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "Actions" })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: tableRows })
     ] }) })
-  ] });
-}
-const ParcelBoxesRoute = () => {
-  return /* @__PURE__ */ jsxRuntime.jsx(ParcelBoxesPage, {});
+  ] }) });
 };
-const config$1 = adminSdk.defineRouteConfig({
-  label: "Parcel Boxes",
-  icon: icons.FlyingBox
-});
-const requestJson = async (url, method = "GET", body) => {
-  const response = await fetch(url, {
-    method,
-    headers: {
-      "Content-Type": "application/json"
-    },
-    body: body ? JSON.stringify(body) : void 0,
-    credentials: "include"
-  });
-  if (!response.ok) {
-    let message = response.statusText;
-    try {
-      const payload = await response.json();
-      message = (payload == null ? void 0 : payload.code) ?? (payload == null ? void 0 : payload.error) ?? message;
-    } catch (_) {
-    }
-    throw new Error(message);
-  }
-  if (response.status === 204) {
-    return void 0;
-  }
-  return await response.json();
-};
-const toNumber = (value) => {
-  if (value.trim().length === 0) {
-    return null;
-  }
-  const parsed = Number(value);
-  return Number.isFinite(parsed) ? parsed : null;
-};
-const getThaiAddressComponents = () => null;
-function ParcelShippingPage() {
-  const [tab, setTab] = react.useState("boxes");
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "space-y-6 p-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "Parcel Shipping" }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-ui-fg-subtle", children: "Configure parcel boxes, shipping rates, and supported service areas." })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ui.Button,
-        {
-          variant: tab === "boxes" ? "primary" : "secondary",
-          size: "small",
-          onClick: () => setTab("boxes"),
-          children: "Boxes"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ui.Button,
-        {
-          variant: tab === "rates" ? "primary" : "secondary",
-          size: "small",
-          onClick: () => setTab("rates"),
-          children: "Shipping Rates"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ui.Button,
-        {
-          variant: tab === "areas" ? "primary" : "secondary",
-          size: "small",
-          onClick: () => setTab("areas"),
-          children: "Service Areas"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-6", children: [
-      tab === "boxes" && /* @__PURE__ */ jsxRuntime.jsx(BoxesSection, {}),
-      tab === "rates" && /* @__PURE__ */ jsxRuntime.jsx(RatesSection, {}),
-      tab === "areas" && /* @__PURE__ */ jsxRuntime.jsx(AreasSection, {})
-    ] })
-  ] });
-}
-const BoxesSection = () => {
+const ParcelBoxesTable = () => {
   const [boxes, setBoxes] = react.useState([]);
-  const [loading, setLoading] = react.useState(true);
-  const [formState, setFormState] = react.useState({
-    id: null,
-    name: "",
-    width_cm: "",
-    length_cm: "",
-    height_cm: "",
-    max_weight_kg: "",
-    price_thb: "",
-    active: true
-  });
-  const [saving, setSaving] = react.useState(false);
-  const [deletingId, setDeletingId] = react.useState(null);
-  const refresh = react.useCallback(async () => {
-    setLoading(true);
+  const [filteredBoxes, setFilteredBoxes] = react.useState([]);
+  const [searchTerm, setSearchTerm] = react.useState("");
+  const [isModalOpen, setIsModalOpen] = react.useState(false);
+  const [editingBox, setEditingBox] = react.useState(null);
+  const [isLoading, setIsLoading] = react.useState(false);
+  const [deleteBoxId, setDeleteBoxId] = react.useState(null);
+  const [deleteBoxName, setDeleteBoxName] = react.useState("");
+  react.useEffect(() => {
+    fetchBoxes();
+  }, []);
+  react.useEffect(() => {
+    const filtered = boxes.filter(
+      (box) => box.name.toLowerCase().includes(searchTerm.toLowerCase())
+    );
+    setFilteredBoxes(filtered);
+  }, [searchTerm, boxes]);
+  const fetchBoxes = async () => {
+    setIsLoading(true);
     try {
-      const data = await requestJson(
-        "/admin/parcel-boxes"
-      );
-      setBoxes(data.boxes ?? []);
+      const response = await fetch("/admin/boxes", {
+        credentials: "include"
+      });
+      const data = await response.json();
+      setBoxes(data.boxes || []);
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to load boxes", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถโหลดข้อมูลกล่องพัสดุได้"
       });
     } finally {
-      setLoading(false);
-    }
-  }, []);
-  react.useEffect(() => {
-    refresh();
-  }, [refresh]);
-  const resetForm = () => setFormState({
-    id: null,
-    name: "",
-    width_cm: "",
-    length_cm: "",
-    height_cm: "",
-    max_weight_kg: "",
-    price_thb: "",
-    active: true
-  });
-  const handleSubmit = async () => {
-    const width = toNumber(formState.width_cm);
-    const length = toNumber(formState.length_cm);
-    const height = toNumber(formState.height_cm);
-    const maxWeight = toNumber(formState.max_weight_kg);
-    const price = toNumber(formState.price_thb);
-    if (!formState.name.trim() || width === null || length === null || height === null || maxWeight === null || price === null) {
-      ui.toast.error("Fill all fields with valid numeric values", {
-        dismissable: true
-      });
-      return;
+      setIsLoading(false);
     }
-    const payload = {
-      name: formState.name.trim(),
-      width_cm: width,
-      length_cm: length,
-      height_cm: height,
-      max_weight_kg: maxWeight,
-      price_thb: price,
-      active: formState.active
-    };
-    setSaving(true);
+  };
+  const handleToggleActive = async (box) => {
     try {
-      if (formState.id) {
-        await requestJson(
-          `/admin/parcel-boxes/${formState.id}`,
-          "PUT",
-          payload
-        );
-        ui.toast.success("Box updated", { dismissable: true });
+      const response = await fetch(`/admin/boxes/${box.id}`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ ...box, active: !box.active })
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: `${box.active ? "ปิดใช้งาน" : "เปิดใช้งาน"}กล่อง ${box.name} แล้ว`
+        });
+        fetchBoxes();
       } else {
-        await requestJson("/admin/parcel-boxes", "POST", payload);
-        ui.toast.success("Box created", { dismissable: true });
+        throw new Error("Failed to update");
       }
-      await refresh();
-      resetForm();
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to save box", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถอัพเดทสถานะได้"
       });
-    } finally {
-      setSaving(false);
     }
   };
-  const handleDelete = async (id) => {
-    setDeletingId(id);
+  const handleDelete = async () => {
+    if (!deleteBoxId) return;
     try {
-      await requestJson(`/admin/parcel-boxes/${id}`, "DELETE");
-      ui.toast.success("Box removed", { dismissable: true });
-      await refresh();
+      const response = await fetch(`/admin/boxes/${deleteBoxId}`, {
+        method: "DELETE",
+        credentials: "include"
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: `ลบกล่อง ${deleteBoxName} แล้ว`
+        });
+        fetchBoxes();
+      } else {
+        throw new Error("Failed to delete");
+      }
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to delete box", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถลบกล่องได้"
       });
     } finally {
-      setDeletingId(null);
+      setDeleteBoxId(null);
+      setDeleteBoxName("");
     }
   };
-  const handleToggle = async (box) => {
+  const handleEdit = (box) => {
+    setEditingBox(box);
+    setIsModalOpen(true);
+  };
+  const handleCreateNew = () => {
+    setEditingBox(null);
+    setIsModalOpen(true);
+  };
+  const handleModalClose = () => {
+    setIsModalOpen(false);
+    setEditingBox(null);
+    fetchBoxes();
+  };
+  const openDeletePrompt = (id, name) => {
+    setDeleteBoxId(id);
+    setDeleteBoxName(name);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-x-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            type: "search",
+            placeholder: "ค้นหาชื่อกล่อง...",
+            value: searchTerm,
+            onChange: (e) => setSearchTerm(e.target.value),
+            className: "max-w-md"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { onClick: handleCreateNew, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, {}),
+          "สร้างกล่องใหม่"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ชื่อ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ขนาด (กว้าง×ยาว×สูง cm)" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "น้ำหนักสูงสุด (kg)" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ราคา (THB)" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "สถานะ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "การจัดการ" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "กำลังโหลด..." }) }) : filteredBoxes.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "ไม่พบข้อมูลกล่องพัสดุ" }) }) : filteredBoxes.map((box) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.name }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Cell, { children: [
+            box.width_cm,
+            " × ",
+            box.length_cm,
+            " × ",
+            box.height_cm
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.max_weight_kg }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.price_thb.toFixed(2) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Badge,
+            {
+              color: box.active ? "green" : "grey",
+              className: "cursor-pointer",
+              onClick: () => handleToggleActive(box),
+              children: box.active ? "เปิดใช้งาน" : "ปิดใช้งาน"
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => handleEdit(box),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Edit, {})
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => openDeletePrompt(box.id, box.name),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash, {})
+              }
+            )
+          ] }) })
+        ] }, box.id)) })
+      ] })
+    ] }),
+    isModalOpen && /* @__PURE__ */ jsxRuntime.jsx(ParcelBoxModal, { box: editingBox, onClose: handleModalClose }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Prompt,
+      {
+        variant: "confirmation",
+        open: !!deleteBoxId,
+        onOpenChange: () => {
+          setDeleteBoxId(null);
+          setDeleteBoxName("");
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Content, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Header, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Title, { children: "ลบกล่องพัสดุ" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Description, { children: [
+              'คุณต้องการลบกล่อง "',
+              deleteBoxName,
+              '" ใช่หรือไม่? การดำเนินการนี้ไม่สามารถย้อนกลับได้'
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Footer, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Cancel, { children: "ยกเลิก" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Action, { onClick: handleDelete, children: "ลบ" })
+          ] })
+        ] })
+      }
+    )
+  ] });
+};
+const BoxesPage = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "กล่องพัสดุ" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ParcelBoxesTable, {})
+  ] }) });
+};
+const config$2 = adminSdk.defineRouteConfig({
+  icon: icons.ArchiveBox,
+  label: "กล่องพัสดุ"
+});
+const CATEGORIES$1 = [
+  { value: "PACKAGING", label: "วัสดุหีบห่อ" },
+  { value: "PROTECTION", label: "วัสดุป้องกัน" },
+  { value: "FILLING", label: "วัสดุเติมช่องว่าง" },
+  { value: "TAPE", label: "เทป/กาว" },
+  { value: "LABEL", label: "ฉลาก/สติกเกอร์" },
+  { value: "OTHER", label: "อื่นๆ" }
+];
+const MaterialCostModal = ({
+  materialCost,
+  onClose
+}) => {
+  const [formData, setFormData] = react.useState({
+    name: "",
+    unit: "",
+    cost_per_unit: "",
+    currency: "THB",
+    category: "",
+    description: "",
+    active: true
+  });
+  const [isSaving, setIsSaving] = react.useState(false);
+  react.useEffect(() => {
+    if (materialCost) {
+      setFormData({
+        name: materialCost.name,
+        unit: materialCost.unit,
+        cost_per_unit: materialCost.cost_per_unit.toString(),
+        currency: materialCost.currency,
+        category: materialCost.category || "",
+        description: materialCost.description || "",
+        active: materialCost.active
+      });
+    }
+  }, [materialCost]);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    const errors = [];
+    if (!formData.name.trim()) {
+      errors.push("กรุณากรอกชื่อวัสดุ");
+    }
+    if (!formData.unit.trim()) {
+      errors.push("กรุณากรอกหน่วย");
+    }
+    const costPerUnit = parseFloat(formData.cost_per_unit);
+    if (isNaN(costPerUnit) || costPerUnit < 0) {
+      errors.push("ต้นทุนต่อหน่วยต้องเป็นตัวเลขไม่ติดลบ");
+    }
+    if (errors.length > 0) {
+      ui.toast.error("ข้อมูลไม่ถูกต้อง", {
+        description: errors.join(", ")
+      });
+      return;
+    }
+    setIsSaving(true);
     try {
-      await requestJson(`/admin/parcel-boxes/${box.id}`, "PUT", {
-        active: !box.active
+      const payload = {
+        name: formData.name.trim(),
+        unit: formData.unit.trim(),
+        cost_per_unit: costPerUnit,
+        currency: formData.currency,
+        category: formData.category || void 0,
+        description: formData.description.trim() || void 0,
+        active: formData.active
+      };
+      const url = materialCost ? `/admin/material-costs/${materialCost.id}` : "/admin/material-costs";
+      const method = materialCost ? "PUT" : "POST";
+      const response = await fetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(payload)
       });
-      await refresh();
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: materialCost ? "แก้ไขรายการต้นทุนวัสดุแล้ว" : "สร้างรายการต้นทุนวัสดุใหม่แล้ว"
+        });
+        onClose();
+      } else {
+        const error = await response.json();
+        throw new Error(error.message || "Failed to save");
+      }
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to update box status", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: error instanceof Error ? error.message : "ไม่สามารถบันทึกข้อมูลได้"
       });
+    } finally {
+      setIsSaving(false);
     }
   };
-  const tableRows = react.useMemo(() => {
-    if (loading) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 6, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "Loading boxes..." }) }) });
-    }
-    if (boxes.length === 0) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 6, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "No boxes configured yet." }) }) });
-    }
-    return boxes.map((box) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "font-medium", children: box.name }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "text-sm text-ui-fg-subtle", children: [
-        box.width_cm,
-        " × ",
-        box.length_cm,
-        " × ",
-        box.height_cm
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.max_weight_kg }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: box.price_thb }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: box.active ? "green" : "grey", children: box.active ? "Active" : "Inactive" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer, { open: true, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Content, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Title, { children: materialCost ? "แก้ไขรายการต้นทุนวัสดุ" : "สร้างรายการต้นทุนวัสดุใหม่" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "name", children: "ชื่อวัสดุ *" }),
         /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Switch,
+          ui.Input,
           {
-            checked: box.active,
-            onCheckedChange: () => handleToggle(box)
+            id: "name",
+            value: formData.name,
+            onChange: (e) => setFormData({ ...formData, name: e.target.value }),
+            placeholder: "เช่น พลาสติกกันกระแทก, กล่องกระดาษ",
+            required: true
           }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            variant: "secondary",
-            size: "small",
-            onClick: () => setFormState({
-              id: box.id,
-              name: box.name,
-              width_cm: String(box.width_cm),
-              length_cm: String(box.length_cm),
-              height_cm: String(box.height_cm),
-              max_weight_kg: String(box.max_weight_kg),
-              price_thb: String(box.price_thb),
-              active: box.active
-            }),
-            children: "Edit"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "category", children: "หมวดหมู่ (ไม่บังคับ)" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.Select,
           {
-            variant: "danger",
-            size: "small",
-            onClick: () => handleDelete(box.id),
-            disabled: deletingId === box.id,
-            children: "Delete"
+            value: formData.category || void 0,
+            onValueChange: (value) => setFormData({ ...formData, category: value }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "เลือกหมวดหมู่ (ไม่บังคับ)" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: CATEGORIES$1.map((category) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: category.value, children: category.label }, category.value)) })
+            ]
           }
         )
-      ] }) })
-    ] }, box.id));
-  }, [boxes, deletingId, loading]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "space-y-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 rounded-md border p-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", children: formState.id ? "Edit Box" : "Create Box" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-name",
-              children: "Name"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-box-name",
-              placeholder: "Enter box name",
-              value: formState.name,
-              onChange: (event) => setFormState((prev) => ({ ...prev, name: event.target.value }))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-width",
-              children: "Width (cm)"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-box-width",
-              placeholder: "e.g. 20",
-              type: "number",
-              value: formState.width_cm,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                width_cm: event.target.value
-              }))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-length",
-              children: "Length (cm)"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-box-length",
-              placeholder: "e.g. 30",
-              type: "number",
-              value: formState.length_cm,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                length_cm: event.target.value
-              }))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-height",
-              children: "Height (cm)"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-box-height",
-              placeholder: "e.g. 15",
-              type: "number",
-              value: formState.height_cm,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                height_cm: event.target.value
-              }))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-max-weight",
-              children: "Max Weight (kg)"
-            }
-          ),
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "unit", children: "หน่วย *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-box-max-weight",
-              placeholder: "e.g. 0.5",
-              type: "number",
-              value: formState.max_weight_kg,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                max_weight_kg: event.target.value
-              }))
+              id: "unit",
+              value: formData.unit,
+              onChange: (e) => setFormData({ ...formData, unit: e.target.value }),
+              placeholder: "เช่น ชิ้น, เมตร, กิโลกรัม",
+              required: true
             }
           )
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-box-price",
-              children: "Box Price (THB)"
-            }
-          ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "costPerUnit", children: "ต้นทุนต่อหน่วย *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-box-price",
-              placeholder: "e.g. 10",
+              id: "costPerUnit",
               type: "number",
-              value: formState.price_thb,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                price_thb: event.target.value
-              }))
+              step: "0.01",
+              value: formData.cost_per_unit,
+              onChange: (e) => setFormData({ ...formData, cost_per_unit: e.target.value }),
+              placeholder: "0.00",
+              required: true
             }
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "currency", children: "สกุลเงิน" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "currency",
+            value: formData.currency,
+            onChange: (e) => setFormData({ ...formData, currency: e.target.value }),
+            placeholder: "THB"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "description", children: "คำอธิบาย" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Textarea,
+          {
+            id: "description",
+            value: formData.description,
+            onChange: (e) => setFormData({ ...formData, description: e.target.value }),
+            placeholder: "คำอธิบายเพิ่มเติมเกี่ยวกับวัสดุนี้...",
+            rows: 3
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           ui.Switch,
           {
-            checked: formState.active,
-            onCheckedChange: (active) => setFormState((prev) => ({ ...prev, active }))
+            id: "active",
+            checked: formData.active,
+            onCheckedChange: (checked) => setFormData({ ...formData, active: checked })
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-sm text-ui-fg-subtle", children: "Active" })
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "active", children: "เปิดใช้งาน" })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: handleSubmit, disabled: saving, children: formState.id ? "Update" : "Create" }),
-        formState.id && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", onClick: resetForm, children: "Cancel" })
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Footer, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Button,
+          {
+            type: "button",
+            variant: "secondary",
+            onClick: onClose,
+            disabled: isSaving,
+            children: "ยกเลิก"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", disabled: isSaving, children: isSaving ? "กำลังบันทึก..." : "บันทึก" })
       ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Name" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Dimensions (cm)" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Max Weight (kg)" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Price" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Status" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "Actions" })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: tableRows })
     ] }) })
-  ] });
+  ] }) });
 };
-const RatesSection = () => {
-  const [rates, setRates] = react.useState([]);
-  const [loading, setLoading] = react.useState(true);
-  const [formState, setFormState] = react.useState({
-    id: null,
-    carrier: "COMPANY_TRUCK",
-    min_weight_kg: "0",
-    max_weight_kg: "",
-    price_thb: "",
-    currency: "THB",
-    active: true
-  });
-  const [currencyOptions, setCurrencyOptions] = react.useState([]);
-  const [defaultCurrency, setDefaultCurrency] = react.useState("THB");
-  const [currenciesLoading, setCurrenciesLoading] = react.useState(true);
-  const [saving, setSaving] = react.useState(false);
-  const [deletingId, setDeletingId] = react.useState(null);
-  const refresh = react.useCallback(async () => {
-    setLoading(true);
-    try {
-      const data = await requestJson(
-        "/admin/shipping-config/rates"
-      );
-      setRates(
-        (data.rates ?? []).map((rate) => ({
-          ...rate,
-          currency: (rate.currency ?? "").toUpperCase()
-        }))
+const CATEGORIES = [
+  { value: "ALL", label: "ทั้งหมด" },
+  { value: "PACKAGING", label: "วัสดุหีบห่อ" },
+  { value: "PROTECTION", label: "วัสดุป้องกัน" },
+  { value: "FILLING", label: "วัสดุเติมช่องว่าง" },
+  { value: "TAPE", label: "เทป/กาว" },
+  { value: "LABEL", label: "ฉลาก/สติกเกอร์" },
+  { value: "OTHER", label: "อื่นๆ" }
+];
+const MaterialCostsTable = () => {
+  const [materialCosts, setMaterialCosts] = react.useState([]);
+  const [filteredMaterialCosts, setFilteredMaterialCosts] = react.useState([]);
+  const [searchTerm, setSearchTerm] = react.useState("");
+  const [categoryFilter, setCategoryFilter] = react.useState("ALL");
+  const [isModalOpen, setIsModalOpen] = react.useState(false);
+  const [editingMaterialCost, setEditingMaterialCost] = react.useState(null);
+  const [isLoading, setIsLoading] = react.useState(false);
+  const [deleteMaterialCostId, setDeleteMaterialCostId] = react.useState(null);
+  const [deleteMaterialCostName, setDeleteMaterialCostName] = react.useState("");
+  react.useEffect(() => {
+    fetchMaterialCosts();
+  }, []);
+  react.useEffect(() => {
+    let filtered = materialCosts;
+    if (categoryFilter !== "ALL") {
+      filtered = filtered.filter((mc) => mc.category === categoryFilter);
+    }
+    if (searchTerm) {
+      filtered = filtered.filter(
+        (mc) => mc.name.toLowerCase().includes(searchTerm.toLowerCase())
       );
+    }
+    setFilteredMaterialCosts(filtered);
+  }, [searchTerm, categoryFilter, materialCosts]);
+  const fetchMaterialCosts = async () => {
+    setIsLoading(true);
+    try {
+      const response = await fetch("/admin/material-costs", {
+        credentials: "include"
+      });
+      const data = await response.json();
+      setMaterialCosts(data.material_costs || []);
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to load rates", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถโหลดข้อมูลต้นทุนวัสดุได้"
       });
     } finally {
-      setLoading(false);
+      setIsLoading(false);
     }
-  }, []);
-  const loadCurrencies = react.useCallback(async () => {
-    var _a, _b, _c;
-    setCurrenciesLoading(true);
+  };
+  const handleToggleActive = async (materialCost) => {
     try {
-      const data = await requestJson("/admin/currencies");
-      const supported = ((_b = (_a = data.store) == null ? void 0 : _a.supported_currencies) == null ? void 0 : _b.map(
-        (item) => item.code.toUpperCase()
-      )) ?? [];
-      const defaultCode = (((_c = data.store) == null ? void 0 : _c.default_currency_code) ?? supported[0] ?? "THB").toUpperCase();
-      const options = supported.length > 0 ? supported : [defaultCode];
-      setCurrencyOptions(options);
-      setDefaultCurrency(defaultCode);
-      setFormState((prev) => ({
-        ...prev,
-        currency: prev.currency && options.includes(prev.currency.toUpperCase()) ? prev.currency.toUpperCase() : defaultCode
-      }));
+      const response = await fetch(`/admin/material-costs/${materialCost.id}`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ ...materialCost, active: !materialCost.active })
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: `${materialCost.active ? "ปิดใช้งาน" : "เปิดใช้งาน"}วัสดุ ${materialCost.name} แล้ว`
+        });
+        fetchMaterialCosts();
+      } else {
+        throw new Error("Failed to update");
+      }
     } catch (error) {
-      ui.toast.error(
-        error.message ?? "Failed to load store currencies",
-        { dismissable: true }
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถอัพเดทสถานะได้"
+      });
+    }
+  };
+  const handleDelete = async () => {
+    if (!deleteMaterialCostId) return;
+    try {
+      const response = await fetch(
+        `/admin/material-costs/${deleteMaterialCostId}`,
+        {
+          method: "DELETE",
+          credentials: "include"
+        }
       );
-      setCurrencyOptions((prev) => prev.length > 0 ? prev : ["THB"]);
-      setDefaultCurrency((prev) => prev || "THB");
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: `ลบวัสดุ ${deleteMaterialCostName} แล้ว`
+        });
+        fetchMaterialCosts();
+      } else {
+        throw new Error("Failed to delete");
+      }
+    } catch (error) {
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถลบวัสดุได้"
+      });
     } finally {
-      setCurrenciesLoading(false);
+      setDeleteMaterialCostId(null);
+      setDeleteMaterialCostName("");
     }
-  }, []);
-  react.useEffect(() => {
-    refresh();
-  }, [refresh]);
+  };
+  const handleEdit = (materialCost) => {
+    setEditingMaterialCost(materialCost);
+    setIsModalOpen(true);
+  };
+  const handleCreateNew = () => {
+    setEditingMaterialCost(null);
+    setIsModalOpen(true);
+  };
+  const handleModalClose = () => {
+    setIsModalOpen(false);
+    setEditingMaterialCost(null);
+    fetchMaterialCosts();
+  };
+  const openDeletePrompt = (id, name) => {
+    setDeleteMaterialCostId(id);
+    setDeleteMaterialCostName(name);
+  };
+  const getCategoryLabel = (category) => {
+    var _a;
+    if (!category) return "-";
+    return ((_a = CATEGORIES.find((c) => c.value === category)) == null ? void 0 : _a.label) || category;
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-x-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-x-4 flex-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Input,
+            {
+              type: "search",
+              placeholder: "ค้นหาชื่อวัสดุ...",
+              value: searchTerm,
+              onChange: (e) => setSearchTerm(e.target.value),
+              className: "max-w-md"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { value: categoryFilter, onValueChange: setCategoryFilter, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "หมวดหมู่" }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: CATEGORIES.map((category) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: category.value, children: category.label }, category.value)) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { onClick: handleCreateNew, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, {}),
+          "สร้างรายการใหม่"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ชื่อ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "หมวดหมู่" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "หน่วย" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ต้นทุนต่อหน่วย" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "คำอธิบาย" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "สถานะ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "การจัดการ" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "กำลังโหลด..." }) }) : filteredMaterialCosts.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "ไม่พบข้อมูลต้นทุนวัสดุ" }) }) : filteredMaterialCosts.map((materialCost) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: materialCost.name }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: "blue", children: getCategoryLabel(materialCost.category) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: materialCost.unit }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Cell, { children: [
+            materialCost.cost_per_unit.toFixed(2),
+            " ",
+            materialCost.currency
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "max-w-xs truncate", children: materialCost.description || "-" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Badge,
+            {
+              color: materialCost.active ? "green" : "grey",
+              className: "cursor-pointer",
+              onClick: () => handleToggleActive(materialCost),
+              children: materialCost.active ? "เปิดใช้งาน" : "ปิดใช้งาน"
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => handleEdit(materialCost),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Edit, {})
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => openDeletePrompt(materialCost.id, materialCost.name),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash, {})
+              }
+            )
+          ] }) })
+        ] }, materialCost.id)) })
+      ] })
+    ] }),
+    isModalOpen && /* @__PURE__ */ jsxRuntime.jsx(
+      MaterialCostModal,
+      {
+        materialCost: editingMaterialCost,
+        onClose: handleModalClose
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Prompt,
+      {
+        variant: "confirmation",
+        open: !!deleteMaterialCostId,
+        onOpenChange: () => {
+          setDeleteMaterialCostId(null);
+          setDeleteMaterialCostName("");
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Content, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Header, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Title, { children: "ลบรายการต้นทุนวัสดุ" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Description, { children: [
+              'คุณต้องการลบวัสดุ "',
+              deleteMaterialCostName,
+              '" ใช่หรือไม่? การดำเนินการนี้ไม่สามารถย้อนกลับได้'
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Footer, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Cancel, { children: "ยกเลิก" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Action, { onClick: handleDelete, children: "ลบ" })
+          ] })
+        ] })
+      }
+    )
+  ] });
+};
+const MaterialCostsPage = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "ต้นทุนวัสดุ" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(MaterialCostsTable, {})
+  ] }) });
+};
+const config$1 = adminSdk.defineRouteConfig({
+  icon: icons.CurrencyDollarSolid,
+  label: "ต้นทุนวัสดุ"
+});
+const CARRIER_TYPES$1 = [
+  { value: "COMPANY_FLEET", label: "บริษัทรถส่งของ (Messenger)" },
+  { value: "COMPANY_TRUCK", label: "รถบริษัท (Same Day)" },
+  { value: "PRIVATE_CARRIER", label: "ขนส่งเอกชน (EMS/Express)" }
+];
+const SERVICE_CODES$1 = [
+  { value: "MESSENGER_3H", label: "ส่งด่วน 3 ชม.", usesHours: true },
+  { value: "SAME_DAY", label: "ส่งด่วนภายในวัน", usesHours: true },
+  { value: "STANDARD_3_5D", label: "EMS 3-5 วัน", usesHours: false },
+  { value: "EXPRESS_1_2D", label: "Express 1-2 วัน", usesHours: false }
+];
+const ShippingRateModal = ({ rate, onClose }) => {
+  const [formData, setFormData] = react.useState({
+    carrier_type: "COMPANY_FLEET",
+    service_code: "MESSENGER_3H",
+    max_weight_kg: "",
+    price: "",
+    currency: "THB",
+    priority: "0",
+    eta_hours_min: "",
+    eta_hours_max: "",
+    eta_days_min: "",
+    eta_days_max: "",
+    active: true
+  });
+  const [isSaving, setIsSaving] = react.useState(false);
+  const selectedService = SERVICE_CODES$1.find((s) => s.value === formData.service_code);
+  const usesHours = (selectedService == null ? void 0 : selectedService.usesHours) ?? false;
   react.useEffect(() => {
-    loadCurrencies();
-  }, [loadCurrencies]);
-  const getInitialCurrency = react.useCallback(() => {
-    if (currencyOptions.length === 0) {
-      return defaultCurrency || "THB";
+    var _a, _b, _c, _d;
+    if (rate) {
+      setFormData({
+        carrier_type: rate.carrier_type,
+        service_code: rate.service_code,
+        max_weight_kg: rate.max_weight_kg.toString(),
+        price: rate.price.toString(),
+        currency: rate.currency,
+        priority: (rate.priority ?? 0).toString(),
+        eta_hours_min: ((_a = rate.eta_hours_min) == null ? void 0 : _a.toString()) || "",
+        eta_hours_max: ((_b = rate.eta_hours_max) == null ? void 0 : _b.toString()) || "",
+        eta_days_min: ((_c = rate.eta_days_min) == null ? void 0 : _c.toString()) || "",
+        eta_days_max: ((_d = rate.eta_days_max) == null ? void 0 : _d.toString()) || "",
+        active: rate.active
+      });
     }
-    return currencyOptions.includes(defaultCurrency) ? defaultCurrency : currencyOptions[0];
-  }, [currencyOptions, defaultCurrency]);
-  const resetForm = react.useCallback(() => {
-    setFormState({
-      id: null,
-      carrier: "COMPANY_TRUCK",
-      min_weight_kg: "0",
-      max_weight_kg: "",
-      price_thb: "",
-      currency: getInitialCurrency(),
-      active: true
-    });
-  }, [getInitialCurrency]);
-  react.useEffect(() => {
-    if (!formState.id && !currencyOptions.includes(formState.currency)) {
-      setFormState((prev) => ({
-        ...prev,
-        currency: getInitialCurrency()
-      }));
+  }, [rate]);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    const errors = [];
+    const maxWeight = parseFloat(formData.max_weight_kg);
+    const price = parseFloat(formData.price);
+    const priority = parseInt(formData.priority);
+    if (isNaN(maxWeight) || maxWeight <= 0) {
+      errors.push("น้ำหนักสูงสุดต้องเป็นตัวเลขมากกว่า 0");
     }
-  }, [currencyOptions, formState.currency, formState.id, getInitialCurrency]);
-  const handleSubmit = async () => {
-    const min = toNumber(formState.min_weight_kg);
-    const max = toNumber(formState.max_weight_kg);
-    const price = toNumber(formState.price_thb);
-    if (max === null || price === null || max <= 0) {
-      ui.toast.error("Provide valid max weight and price", { dismissable: true });
-      return;
+    if (isNaN(price) || price < 0) {
+      errors.push("ราคาต้องเป็นตัวเลขไม่ติดลบ");
+    }
+    if (isNaN(priority)) {
+      errors.push("ลำดับความสำคัญต้องเป็นตัวเลข");
+    }
+    let etaHoursMin;
+    let etaHoursMax;
+    let etaDaysMin;
+    let etaDaysMax;
+    if (usesHours) {
+      etaHoursMin = formData.eta_hours_min ? parseFloat(formData.eta_hours_min) : void 0;
+      etaHoursMax = formData.eta_hours_max ? parseFloat(formData.eta_hours_max) : void 0;
+      if (etaHoursMin === void 0 || etaHoursMax === void 0) {
+        errors.push("กรุณากรอก ETA เป็นชั่วโมงให้ครบ");
+      } else if (etaHoursMin > etaHoursMax) {
+        errors.push("ETA ชั่วโมงต่ำสุดต้องน้อยกว่าหรือเท่ากับสูงสุด");
+      }
+    } else {
+      etaDaysMin = formData.eta_days_min ? parseFloat(formData.eta_days_min) : void 0;
+      etaDaysMax = formData.eta_days_max ? parseFloat(formData.eta_days_max) : void 0;
+      if (etaDaysMin === void 0 || etaDaysMax === void 0) {
+        errors.push("กรุณากรอก ETA เป็นวันให้ครบ");
+      } else if (etaDaysMin > etaDaysMax) {
+        errors.push("ETA วันต่ำสุดต้องน้อยกว่าหรือเท่ากับสูงสุด");
+      }
     }
-    if (min !== null && max <= min) {
-      ui.toast.error("Max weight must be greater than min weight", {
-        dismissable: true
+    if (errors.length > 0) {
+      ui.toast.error("ข้อมูลไม่ถูกต้อง", {
+        description: errors.join(", ")
       });
       return;
     }
-    const payload = {
-      carrier: formState.carrier,
-      min_weight_kg: min ?? 0,
-      max_weight_kg: max,
-      price_thb: price,
-      currency: (formState.currency || getInitialCurrency()).trim().toUpperCase(),
-      active: formState.active
-    };
-    setSaving(true);
+    setIsSaving(true);
     try {
-      if (formState.id) {
-        await requestJson(
-          `/admin/shipping-config/rates/${formState.id}`,
-          "PUT",
-          payload
-        );
-        ui.toast.success("Rate updated", { dismissable: true });
+      const payload = {
+        carrier_type: formData.carrier_type,
+        service_code: formData.service_code,
+        max_weight_kg: maxWeight,
+        price,
+        currency: formData.currency,
+        priority,
+        active: formData.active
+      };
+      if (usesHours) {
+        payload.eta_hours_min = etaHoursMin;
+        payload.eta_hours_max = etaHoursMax;
       } else {
-        await requestJson("/admin/shipping-config/rates", "POST", payload);
-        ui.toast.success("Rate created", { dismissable: true });
+        payload.eta_days_min = etaDaysMin;
+        payload.eta_days_max = etaDaysMax;
       }
-      await refresh();
-      resetForm();
-    } catch (error) {
-      ui.toast.error(error.message ?? "Failed to save rate", {
-        dismissable: true
+      const url = rate ? `/admin/shipping-rates/${rate.id}` : "/admin/shipping-rates";
+      const method = rate ? "PUT" : "POST";
+      const response = await fetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(payload)
       });
-    } finally {
-      setSaving(false);
-    }
-  };
-  const handleDelete = async (id) => {
-    setDeletingId(id);
-    try {
-      await requestJson(`/admin/shipping-config/rates/${id}`, "DELETE");
-      ui.toast.success("Rate removed", { dismissable: true });
-      await refresh();
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: rate ? "แก้ไขอัตราค่าขนส่งแล้ว" : "สร้างอัตราค่าขนส่งใหม่แล้ว"
+        });
+        onClose();
+      } else {
+        const error = await response.json();
+        throw new Error(error.message || "Failed to save");
+      }
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to delete rate", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: error instanceof Error ? error.message : "ไม่สามารถบันทึกข้อมูลได้"
       });
     } finally {
-      setDeletingId(null);
-    }
-  };
-  const handleToggle = async (rate) => {
-    try {
-      await requestJson(`/admin/shipping-config/rates/${rate.id}`, "PUT", {
-        active: !rate.active
-      });
-      await refresh();
-    } catch (error) {
-      ui.toast.error(error.message ?? "Failed to update rate status", {
-        dismissable: true
-      });
+      setIsSaving(false);
     }
   };
-  const tableRows = react.useMemo(() => {
-    if (loading) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 5, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "Loading rates..." }) }) });
-    }
-    if (rates.length === 0) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 5, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "No shipping rates configured." }) }) });
-    }
-    return rates.map((rate) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "font-medium", children: rate.carrier === "COMPANY_TRUCK" ? "Company Truck" : "Private Carrier" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "text-sm text-ui-fg-subtle", children: [
-        rate.min_weight_kg,
-        " - ",
-        rate.max_weight_kg
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Cell, { children: [
-        rate.price_thb,
-        " ",
-        rate.currency
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: rate.active ? "green" : "grey", children: rate.active ? "Active" : "Inactive" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Switch,
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer, { open: true, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Content, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Title, { children: rate ? "แก้ไขอัตราค่าขนส่ง" : "สร้างอัตราค่าขนส่งใหม่" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Drawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "carrier", children: "ประเภทขนส่ง *" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.Select,
           {
-            checked: rate.active,
-            onCheckedChange: () => handleToggle(rate)
+            value: formData.carrier_type,
+            onValueChange: (value) => setFormData({ ...formData, carrier_type: value }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "เลือกประเภทขนส่ง" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: CARRIER_TYPES$1.map((carrier) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: carrier.value, children: carrier.label }, carrier.value)) })
+            ]
           }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "service", children: "บริการจัดส่ง *" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.Select,
           {
-            variant: "secondary",
-            size: "small",
-            onClick: () => setFormState({
-              id: rate.id,
-              carrier: rate.carrier,
-              min_weight_kg: String(rate.min_weight_kg ?? 0),
-              max_weight_kg: String(rate.max_weight_kg),
-              price_thb: String(rate.price_thb),
-              currency: (rate.currency ?? "").toUpperCase(),
-              active: rate.active
+            value: formData.service_code,
+            onValueChange: (value) => setFormData({
+              ...formData,
+              service_code: value,
+              eta_hours_min: "",
+              eta_hours_max: "",
+              eta_days_min: "",
+              eta_days_max: ""
             }),
-            children: "Edit"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            variant: "danger",
-            size: "small",
-            onClick: () => handleDelete(rate.id),
-            disabled: deletingId === rate.id,
-            children: "Delete"
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "เลือกบริการ" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: SERVICE_CODES$1.map((service) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: service.value, children: service.label }, service.value)) })
+            ]
           }
         )
-      ] }) })
-    ] }, rate.id));
-  }, [deletingId, loading, rates]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "space-y-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 rounded-md border p-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", children: formState.id ? "Edit Shipping Rate" : "Create Shipping Rate" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-4", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "maxWeight", children: "น้ำหนักสูงสุด (kg) *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-rate-carrier",
-              children: "Carrier"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "select",
+            ui.Input,
             {
-              id: "parcel-rate-carrier",
-              className: "mt-1 w-full rounded-md border border-ui-border-base bg-ui-bg-field px-3 py-2 text-sm",
-              value: formState.carrier,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                carrier: event.target.value
-              })),
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "COMPANY_TRUCK", children: "Company Truck" }),
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "PRIVATE_CARRIER", children: "Private Carrier" })
-              ]
+              id: "maxWeight",
+              type: "number",
+              step: "0.1",
+              min: "0",
+              value: formData.max_weight_kg,
+              onChange: (e) => setFormData({ ...formData, max_weight_kg: e.target.value }),
+              placeholder: "เช่น 3",
+              required: true
             }
           )
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-rate-min-weight",
-              children: "Min Weight (kg)"
-            }
-          ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "price", children: "ราคา (THB) *" }),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-rate-min-weight",
-              placeholder: "e.g. 0",
+              id: "price",
               type: "number",
-              value: formState.min_weight_kg,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                min_weight_kg: event.target.value
-              }))
+              step: "0.01",
+              min: "0",
+              value: formData.price,
+              onChange: (e) => setFormData({ ...formData, price: e.target.value }),
+              placeholder: "เช่น 80",
+              required: true
             }
           )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "priority", children: "ลำดับความสำคัญ" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "priority",
+            type: "number",
+            value: formData.priority,
+            onChange: (e) => setFormData({ ...formData, priority: e.target.value }),
+            placeholder: "0"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-ui-fg-subtle mt-1", children: "ตัวเลขสูงกว่าจะถูกเสนอให้เลือกก่อน (ค่าเริ่มต้น 0)" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Label, { children: [
+          usesHours ? "ETA (ชั่วโมง)" : "ETA (วัน)",
+          " *"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-x-4 mt-2", children: usesHours ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
+            ui.Input,
             {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-rate-max-weight",
-              children: "Max Weight (kg)"
+              type: "number",
+              placeholder: "ต่ำสุด",
+              value: formData.eta_hours_min,
+              onChange: (e) => setFormData({ ...formData, eta_hours_min: e.target.value }),
+              required: true
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-rate-max-weight",
-              placeholder: "e.g. 5",
               type: "number",
-              value: formState.max_weight_kg,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                max_weight_kg: event.target.value
-              }))
+              placeholder: "สูงสุด",
+              value: formData.eta_hours_max,
+              onChange: (e) => setFormData({ ...formData, eta_hours_max: e.target.value }),
+              required: true
             }
           )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
+        ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
+            ui.Input,
             {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-rate-price",
-              children: "Price (THB)"
+              type: "number",
+              placeholder: "ต่ำสุด",
+              value: formData.eta_days_min,
+              onChange: (e) => setFormData({ ...formData, eta_days_min: e.target.value }),
+              required: true
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Input,
             {
-              id: "parcel-rate-price",
-              placeholder: "e.g. 45",
               type: "number",
-              value: formState.price_thb,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                price_thb: event.target.value
-              }))
+              placeholder: "สูงสุด",
+              value: formData.eta_days_max,
+              onChange: (e) => setFormData({ ...formData, eta_days_max: e.target.value }),
+              required: true
             }
           )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-rate-currency",
-              children: "Currency"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "select",
-            {
-              id: "parcel-rate-currency",
-              className: "w-full rounded-md border border-ui-border-base bg-ui-bg-field px-3 py-2 text-sm",
-              value: formState.currency,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                currency: event.target.value
-              })),
-              disabled: currencyOptions.length === 0,
-              children: currencyOptions.map((code) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: code, children: code }, code))
-            }
-          ),
-          currenciesLoading && /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-xs text-ui-fg-subtle", children: "Loading currencies..." }),
-          !currenciesLoading && currencyOptions.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-xs text-ui-fg-subtle", children: "Configure store currencies to enable selection." })
-        ] })
+        ] }) })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           ui.Switch,
           {
-            checked: formState.active,
-            onCheckedChange: (active) => setFormState((prev) => ({ ...prev, active }))
+            id: "active",
+            checked: formData.active,
+            onCheckedChange: (checked) => setFormData({ ...formData, active: checked })
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-sm text-ui-fg-subtle", children: "Active" })
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "active", children: "เปิดใช้งาน" })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: handleSubmit, disabled: saving, children: formState.id ? "Update" : "Create" }),
-        formState.id && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", onClick: resetForm, children: "Cancel" })
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Drawer.Footer, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "button", variant: "secondary", onClick: onClose, disabled: isSaving, children: "ยกเลิก" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", disabled: isSaving, children: isSaving ? "กำลังบันทึก..." : "บันทึก" })
       ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Carrier" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Weight Range (kg)" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Price" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Status" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "Actions" })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: tableRows })
     ] }) })
-  ] });
+  ] }) });
 };
-const AreasSection = () => {
-  const [areas, setAreas] = react.useState([]);
-  const [loading, setLoading] = react.useState(true);
-  const [formState, setFormState] = react.useState({
-    id: null,
-    kind: "PROVINCE",
-    value: "",
-    active: true
-  });
-  const thaiAddressInputs = react.useMemo(() => getThaiAddressComponents(), []);
-  const ThaiProvinceInput = thaiAddressInputs == null ? void 0 : thaiAddressInputs.Province;
-  const ThaiZipcodeInput = thaiAddressInputs == null ? void 0 : thaiAddressInputs.Zipcode;
-  const [thaiAddress, setThaiAddress] = react.useState({
-    district: "",
-    amphoe: "",
-    province: "",
-    zipcode: ""
-  });
-  const [saving, setSaving] = react.useState(false);
-  const [deletingId, setDeletingId] = react.useState(null);
-  const refresh = react.useCallback(async () => {
-    setLoading(true);
-    try {
-      const data = await requestJson(
-        "/admin/shipping-config/areas"
-      );
-      setAreas(data.areas ?? []);
-    } catch (error) {
-      ui.toast.error(error.message ?? "Failed to load service areas", {
-        dismissable: true
-      });
-    } finally {
-      setLoading(false);
-    }
-  }, []);
+const CARRIER_TYPES = [
+  { value: "ALL", label: "ทั้งหมด" },
+  { value: "COMPANY_FLEET", label: "บริษัทรถส่งของ (Messenger)" },
+  { value: "COMPANY_TRUCK", label: "รถบริษัท (Same Day)" },
+  { value: "PRIVATE_CARRIER", label: "ขนส่งเอกชน (EMS/Express)" }
+];
+const SERVICE_CODES = [
+  { value: "ALL", label: "ทั้งหมด" },
+  { value: "MESSENGER_3H", label: "ส่งด่วน 3 ชม." },
+  { value: "SAME_DAY", label: "ส่งด่วนภายในวัน" },
+  { value: "STANDARD_3_5D", label: "EMS 3-5 วัน" },
+  { value: "EXPRESS_1_2D", label: "Express 1-2 วัน" }
+];
+const ShippingRatesTable = () => {
+  const [rates, setRates] = react.useState([]);
+  const [filteredRates, setFilteredRates] = react.useState([]);
+  const [carrierFilter, setCarrierFilter] = react.useState("ALL");
+  const [serviceFilter, setServiceFilter] = react.useState("ALL");
+  const [isModalOpen, setIsModalOpen] = react.useState(false);
+  const [editingRate, setEditingRate] = react.useState(null);
+  const [isLoading, setIsLoading] = react.useState(false);
+  const [deleteRateId, setDeleteRateId] = react.useState(null);
   react.useEffect(() => {
-    refresh();
-  }, [refresh]);
-  const resetForm = react.useCallback(() => {
-    setFormState({
-      id: null,
-      kind: "PROVINCE",
-      value: "",
-      active: true
-    });
-    setThaiAddress({
-      district: "",
-      amphoe: "",
-      province: "",
-      zipcode: ""
-    });
+    fetchRates();
   }, []);
-  const handleSubmit = async () => {
-    if (!formState.value.trim()) {
-      ui.toast.error("Provide a value", { dismissable: true });
-      return;
+  react.useEffect(() => {
+    let filtered = rates;
+    if (carrierFilter !== "ALL") {
+      filtered = filtered.filter((rate) => rate.carrier_type === carrierFilter);
     }
-    const payload = {
-      kind: formState.kind,
-      value: formState.value.trim(),
-      active: formState.active
-    };
-    setSaving(true);
+    if (serviceFilter !== "ALL") {
+      filtered = filtered.filter((rate) => rate.service_code === serviceFilter);
+    }
+    setFilteredRates(filtered);
+  }, [carrierFilter, serviceFilter, rates]);
+  const fetchRates = async () => {
+    setIsLoading(true);
     try {
-      if (formState.id) {
-        await requestJson(
-          `/admin/shipping-config/areas/${formState.id}`,
-          "PUT",
-          payload
-        );
-        ui.toast.success("Service area updated", { dismissable: true });
-      } else {
-        await requestJson("/admin/shipping-config/areas", "POST", payload);
-        ui.toast.success("Service area created", { dismissable: true });
-      }
-      await refresh();
-      resetForm();
+      const response = await fetch("/admin/shipping-rates", {
+        credentials: "include"
+      });
+      const data = await response.json();
+      setRates(data.rates || []);
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to save service area", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถโหลดข้อมูลอัตราค่าขนส่งได้"
       });
     } finally {
-      setSaving(false);
+      setIsLoading(false);
     }
   };
-  const handleDelete = async (id) => {
-    setDeletingId(id);
+  const handleDelete = async () => {
+    if (!deleteRateId) return;
     try {
-      await requestJson(`/admin/shipping-config/areas/${id}`, "DELETE");
-      ui.toast.success("Service area removed", { dismissable: true });
-      await refresh();
+      const response = await fetch(`/admin/shipping-rates/${deleteRateId}`, {
+        method: "DELETE",
+        credentials: "include"
+      });
+      if (response.ok) {
+        ui.toast.success("สำเร็จ", {
+          description: "ลบอัตราค่าขนส่งแล้ว"
+        });
+        fetchRates();
+      } else {
+        throw new Error("Failed to delete");
+      }
     } catch (error) {
-      ui.toast.error(error.message ?? "Failed to delete service area", {
-        dismissable: true
+      ui.toast.error("ข้อผิดพลาด", {
+        description: "ไม่สามารถลบอัตราค่าขนส่งได้"
       });
     } finally {
-      setDeletingId(null);
+      setDeleteRateId(null);
     }
   };
-  const handleToggle = async (area) => {
-    try {
-      await requestJson(`/admin/shipping-config/areas/${area.id}`, "PUT", {
-        active: !area.active
-      });
-      await refresh();
-    } catch (error) {
-      ui.toast.error(
-        error.message ?? "Failed to update service area status",
-        { dismissable: true }
-      );
-    }
+  const handleEdit = (rate) => {
+    setEditingRate(rate);
+    setIsModalOpen(true);
   };
-  const beginEdit = react.useCallback((area) => {
-    setFormState({
-      id: area.id,
-      kind: area.kind,
-      value: area.value,
-      active: area.active
-    });
-    setThaiAddress((prev) => ({
-      ...prev,
-      province: area.kind === "PROVINCE" ? area.value : prev.province,
-      zipcode: area.kind === "POSTCODE_PREFIX" ? area.value : prev.zipcode
-    }));
-  }, []);
-  const handleThaiAddressSelect = react.useCallback(
-    (addressRecord) => {
-      const nextAddress = {
-        district: addressRecord.district ?? "",
-        amphoe: addressRecord.amphoe ?? "",
-        province: addressRecord.province ?? "",
-        zipcode: addressRecord.zipcode ? String(addressRecord.zipcode) : ""
-      };
-      setThaiAddress(nextAddress);
-      if (formState.kind === "PROVINCE") {
-        setFormState((prev) => ({
-          ...prev,
-          value: nextAddress.province
-        }));
-      } else {
-        setFormState((prev) => ({
-          ...prev,
-          value: nextAddress.zipcode.slice(0, 3)
-        }));
-      }
-    },
-    [formState.kind]
-  );
-  const handleThaiAddressChange = react.useCallback(
-    (scope) => (rawValue) => {
-      const value = typeof rawValue === "number" ? String(rawValue) : rawValue;
-      setThaiAddress((prev) => ({
-        ...prev,
-        [scope]: value
-      }));
-      if (scope === "province" && formState.kind === "PROVINCE") {
-        setFormState((prev) => ({
-          ...prev,
-          value
-        }));
-      }
-      if (scope === "zipcode" && formState.kind === "POSTCODE_PREFIX") {
-        setFormState((prev) => ({
-          ...prev,
-          value: value.slice(0, 3)
-        }));
-      }
-    },
-    [formState.kind]
-  );
-  const tableRows = react.useMemo(() => {
-    if (loading) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 4, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "Loading service areas..." }) }) });
-    }
-    if (areas.length === 0) {
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { colSpan: 4, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-center text-ui-fg-subtle", children: "No service areas configured." }) }) });
+  const handleCreateNew = () => {
+    setEditingRate(null);
+    setIsModalOpen(true);
+  };
+  const handleModalClose = () => {
+    setIsModalOpen(false);
+    setEditingRate(null);
+    fetchRates();
+  };
+  const getCarrierLabel = (type) => {
+    var _a;
+    return ((_a = CARRIER_TYPES.find((c) => c.value === type)) == null ? void 0 : _a.label) || type;
+  };
+  const getServiceLabel = (code) => {
+    var _a;
+    return ((_a = SERVICE_CODES.find((s) => s.value === code)) == null ? void 0 : _a.label) || code;
+  };
+  const formatETA = (rate) => {
+    if (rate.eta_hours_min !== null && rate.eta_hours_min !== void 0 && rate.eta_hours_max !== null && rate.eta_hours_max !== void 0) {
+      return `${rate.eta_hours_min}-${rate.eta_hours_max} ชม.`;
     }
-    return areas.map((area) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "font-medium", children: area.kind === "PROVINCE" ? "Province" : "Postcode Prefix" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: area.value }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: area.active ? "green" : "grey", children: area.active ? "Active" : "Inactive" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Switch,
-          {
-            checked: area.active,
-            onCheckedChange: () => handleToggle(area)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            variant: "secondary",
-            size: "small",
-            onClick: () => beginEdit(area),
-            children: "Edit"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            variant: "danger",
-            size: "small",
-            onClick: () => handleDelete(area.id),
-            disabled: deletingId === area.id,
-            children: "Delete"
-          }
-        )
-      ] }) })
-    ] }, area.id));
-  }, [areas, beginEdit, deletingId, handleDelete, handleToggle, loading]);
-  const valueLabel = formState.kind === "PROVINCE" ? "Province" : "Postcode Prefix";
-  react.useEffect(() => {
-    if (formState.kind === "PROVINCE") {
-      setThaiAddress(
-        (prev) => prev.province === formState.value ? prev : { ...prev, province: formState.value }
-      );
-    } else if (formState.kind === "POSTCODE_PREFIX") {
-      setThaiAddress(
-        (prev) => prev.zipcode === formState.value ? prev : { ...prev, zipcode: formState.value }
-      );
+    if (rate.eta_days_min !== null && rate.eta_days_min !== void 0 && rate.eta_days_max !== null && rate.eta_days_max !== void 0) {
+      return `${rate.eta_days_min}-${rate.eta_days_max} วัน`;
     }
-  }, [formState.kind, formState.value]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "space-y-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 rounded-md border p-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", children: formState.id ? "Edit Service Area" : "Create Service Area" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-area-kind",
-              children: "Kind"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "select",
-            {
-              id: "parcel-area-kind",
-              className: "mt-1 w-full rounded-md border border-ui-border-base bg-ui-bg-field px-3 py-2 text-sm",
-              value: formState.kind,
-              onChange: (event) => {
-                const nextKind = event.target.value;
-                setFormState((prev) => ({
-                  ...prev,
-                  kind: nextKind,
-                  value: nextKind === "PROVINCE" ? thaiAddress.province : thaiAddress.zipcode.slice(0, 3)
-                }));
-              },
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "PROVINCE", children: "Province" }),
-                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "POSTCODE_PREFIX", children: "Postcode Prefix" })
-              ]
-            }
-          )
+    return "-";
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-x-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-x-4 items-end", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-sm font-medium text-ui-fg-subtle", children: "ประเภทขนส่ง" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { value: carrierFilter, onValueChange: setCarrierFilter, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "ทั้งหมด" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: CARRIER_TYPES.map((type) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: type.value, children: type.label }, type.value)) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-sm font-medium text-ui-fg-subtle", children: "บริการจัดส่ง" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { value: serviceFilter, onValueChange: setServiceFilter, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, { placeholder: "ทั้งหมด" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: SERVICE_CODES.map((service) => /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: service.value, children: service.label }, service.value)) })
+            ] })
+          ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Label,
-            {
-              className: "text-sm font-medium text-ui-fg-base",
-              htmlFor: "parcel-area-value",
-              children: valueLabel
-            }
-          ),
-          ThaiProvinceInput && ThaiZipcodeInput ? formState.kind === "PROVINCE" ? /* @__PURE__ */ jsxRuntime.jsx(
-            ThaiProvinceInput,
-            {
-              className: "w-full",
-              value: thaiAddress.province,
-              onChange: handleThaiAddressChange("province"),
-              onSelect: handleThaiAddressSelect,
-              autoCompleteProps: {
-                style: { width: "100%" },
-                dropdownMatchSelectWidth: false,
-                placement: "bottomLeft"
-              }
-            }
-          ) : /* @__PURE__ */ jsxRuntime.jsx(
-            ThaiZipcodeInput,
-            {
-              className: "w-full",
-              value: thaiAddress.zipcode,
-              onChange: handleThaiAddressChange("zipcode"),
-              onSelect: handleThaiAddressSelect,
-              autoCompleteProps: {
-                style: { width: "100%" },
-                dropdownMatchSelectWidth: false,
-                placement: "bottomLeft"
-              }
-            }
-          ) : /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Input,
-            {
-              id: "parcel-area-value",
-              placeholder: `Enter ${valueLabel.toLowerCase()}`,
-              value: formState.value,
-              onChange: (event) => setFormState((prev) => ({
-                ...prev,
-                value: event.target.value
-              }))
-            }
-          ),
-          formState.kind === "POSTCODE_PREFIX" && /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-xs text-ui-fg-subtle", children: "Using the first three digits of the selected postal code." })
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { onClick: handleCreateNew, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, {}),
+          "สร้างอัตราใหม่"
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Switch,
-          {
-            checked: formState.active,
-            onCheckedChange: (active) => setFormState((prev) => ({ ...prev, active }))
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-sm text-ui-fg-subtle", children: "Active" })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: handleSubmit, disabled: saving, children: formState.id ? "Update" : "Create" }),
-        formState.id && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", onClick: resetForm, children: "Cancel" })
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ประเภทขนส่ง" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "บริการ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "น้ำหนัก ≤ (kg)" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ราคา (THB)" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "ETA" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "สถานะ" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "การจัดการ" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "กำลังโหลด..." }) }) : filteredRates.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-center", children: "ไม่พบข้อมูลอัตราค่าขนส่ง" }) }) : filteredRates.map((rate) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: getCarrierLabel(rate.carrier_type) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: getServiceLabel(rate.service_code) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Cell, { children: [
+            "≤ ",
+            rate.max_weight_kg,
+            " kg"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: rate.price.toFixed(2) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: "blue", children: formatETA(rate) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: rate.active ? "green" : "grey", children: rate.active ? "เปิดใช้งาน" : "ปิดใช้งาน" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => handleEdit(rate),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Edit, {})
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                variant: "transparent",
+                size: "small",
+                onClick: () => setDeleteRateId(rate.id),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash, {})
+              }
+            )
+          ] }) })
+        ] }, rate.id)) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Kind" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Value" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Status" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { className: "text-right", children: "Actions" })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: tableRows })
-    ] }) })
+    isModalOpen && /* @__PURE__ */ jsxRuntime.jsx(ShippingRateModal, { rate: editingRate, onClose: handleModalClose }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Prompt,
+      {
+        variant: "confirmation",
+        open: !!deleteRateId,
+        onOpenChange: () => setDeleteRateId(null),
+        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Content, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Header, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Title, { children: "ลบอัตราค่าขนส่ง" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Description, { children: "คุณต้องการลบอัตราค่าขนส่งนี้ใช่หรือไม่? การดำเนินการนี้ไม่สามารถย้อนกลับได้" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Prompt.Footer, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Cancel, { children: "ยกเลิก" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Prompt.Action, { onClick: handleDelete, children: "ลบ" })
+          ] })
+        ] })
+      }
+    )
   ] });
 };
-const ParcelShippingRoute = () => {
-  return /* @__PURE__ */ jsxRuntime.jsx(ParcelShippingPage, {});
+const RatesPage = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "อัตราค่าขนส่ง" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ShippingRatesTable, {})
+  ] }) });
 };
 const config = adminSdk.defineRouteConfig({
-  label: "Parcel Shipping",
-  icon: icons.Directions
+  icon: icons.HandTruck,
+  label: "อัตราค่าขนส่ง"
 });
-const widgetModule = { widgets: [] };
+const widgetModule = { widgets: [
+  {
+    Component: OrderShippingQuoteWidget,
+    zone: ["order.details.after"]
+  }
+] };
 const routeModule = {
   routes: [
     {
-      Component: ParcelBoxesRoute,
-      path: "/parcel-boxes"
+      Component: AreasPage,
+      path: "/areas"
+    },
+    {
+      Component: BoxesPage,
+      path: "/boxes"
     },
     {
-      Component: ParcelShippingRoute,
-      path: "/parcel-shipping"
+      Component: MaterialCostsPage,
+      path: "/material-costs"
+    },
+    {
+      Component: RatesPage,
+      path: "/rates"
     }
   ]
 };
 const menuItemModule = {
   menuItems: [
+    {
+      label: config$3.label,
+      icon: config$3.icon,
+      path: "/areas",
+      nested: void 0
+    },
+    {
+      label: config$2.label,
+      icon: config$2.icon,
+      path: "/boxes",
+      nested: void 0
+    },
     {
       label: config$1.label,
       icon: config$1.icon,
-      path: "/parcel-boxes",
+      path: "/material-costs",
       nested: void 0
     },
     {
       label: config.label,
       icon: config.icon,
-      path: "/parcel-shipping",
+      path: "/rates",
       nested: void 0
     }
   ]