@flowselections/floriday-voorraad 1.0.23 → 1.0.27

package/dist-lib/components/voorraad/ArtikelWizard.js

@@ -2,26 +2,33 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Link, useNavigate } from "@tanstack/react-router";
 import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, Button, Card, CardContent, Checkbox, Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, Input, Label, Popover, PopoverContent, PopoverTrigger, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Switch, toast, } from "@flowselections/core";
-import { ArrowLeft, ArrowRight, Check, ChevronDown, ClipboardList, Info, Loader2, Plus, Search, Trash2, Upload, UploadCloud, Users, X, } from "lucide-react";
+import { ArrowLeft, ArrowRight, Check, ChevronDown, ClipboardList, Info, Loader2, Plus, Search, Trash2, Upload, UploadCloud, Users, X, Star, } from "lucide-react";
 import { useFloridayConnection } from "../../hooks/useFloridayConnection";
 import { useFlorydayCustomers } from "../../hooks/useFlorydayCustomers";
 import { floriday } from "../../lib/floriday-client";
-import { listFloricode } from "../../lib/floricode-client";
+import { listFloricode, listFloricodeByField } from "../../lib/floricode-client";
 import { supabase } from "../../integrations/supabase/client";
-import { buildAddTradeItemPayload, buildUpdateTradeItemPayload, buildPrimaryPackingBase, emptyWizardData, floridayCacheToWizardData, isValidGtin13, PACKAGING_SUPPLIERS, validateStep, } from "../../lib/floriday-payload";
+import { buildAddTradeItemPayload, buildUpdateTradeItemPayload, buildPrimaryPackingBase, emptyWizardData, floridayCacheToWizardData, isValidGtin13, normalizeFloridayProductGroup, PACKAGING_SUPPLIERS, validateStep, } from "../../lib/floriday-payload";
 import { AdditionalPackagingDialog } from "./AdditionalPackagingDialog";
 import { publishCustomerOfferFn } from "../../lib/floriday-customer-offer.functions";
 import { upsertSupplyLineForTradeItem } from "../../lib/floriday-supply-line";
 import { deleteLocalTradeItem, getLocalTradeItem, upsertLocalTradeItem, } from "../../hooks/useLocalTradeItems";
 import { useTradeItemSpec } from "../../hooks/useTradeItemSpec";
+import { isMissingCharacteristicsError } from "../../lib/floriday-writes.functions";
 import { useVbnRegulatoryFeatures } from "../../hooks/useVbnRegulatoryFeatures";
+import { useFloridayVbnRequired } from "../../hooks/useFloridayVbnRequired";
+import { saveFloridayVbnRequired } from "../../lib/floriday-vbn-required.functions";
+import { useQueryClient } from "@tanstack/react-query";
 import { useCodeList, useTradeItemFormSchema } from "../../hooks/useFloriday";
+import { useFloridayPriceGroups } from "../../hooks/useFloridayPriceGroups";
+import { readTradeItemPrices, syncTradeItemPrices } from "../../lib/trade-item-prices";
 const floridayLogo = "/flowselections-assets/Voorraad/floriday-logo.png";
 import { VoorraadStockCard } from "../../components/voorraad/VoorraadStockCard";
 import { ProductLinkCard } from "../../components/voorraad/ProductLinkCard";
 import { PriceStatusBadge } from "../../components/voorraad/PriceStatusBadge";
 import { OrderHistoryCard } from "../../components/voorraad/OrderHistoryCard";
 import { ArtikelCompositionCard } from "../../components/voorraad/ArtikelCompositionCard";
+import { StepSamenstelling } from "../../components/voorraad/StepSamenstelling";
 import { FloridayInfoCard } from "../../components/voorraad/FloridayInfoCard";
 import { stockKeyFor } from "../../hooks/useTradeItemStock";
 const empty = emptyWizardData;
@@ -71,10 +78,23 @@ function warehouseSubLabel(raw) {
     const city = addr.city ?? "";
     return [line, city].filter(Boolean).join(", ") || undefined;
 }
+async function lookupProductGroupForVbn(vbnCode) {
+    const code = String(vbnCode ?? "").trim();
+    if (!code)
+        return null;
+    const { data } = await supabase
+        .from("floricode_records")
+        .select("record_id,resource,data")
+        .eq("resource", "VbnProduct")
+        .eq("record_id", code)
+        .maybeSingle();
+    return data ? groupOfRecord(data) : null;
+}
 export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId, } = {}) {
     const navigate = useNavigate();
     const { activeId, activeConnection, loading: connLoading } = useFloridayConnection();
     const { customers: floridayCustomers } = useFlorydayCustomers(activeId);
+    const { priceGroups } = useFloridayPriceGroups(activeId);
     const [step, setStep] = useState(0);
     const [data, setData] = useState(empty);
     const [submitting, setSubmitting] = useState(false);
@@ -89,10 +109,73 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
     const [productMeta, setProductMeta] = useState({ floridayActive: false, floridayTradeItemId: null, physicalStock: 0 });
     const [deleteAck, setDeleteAck] = useState(false);
     const [deleteOpen, setDeleteOpen] = useState(false);
+    // Codes die Floriday's server-side check bij een eerdere publish-poging als
+    // "missing" terugmeldde. Wordt uit een gedeelde Supabase-tabel gelezen
+    // (`floriday_vbn_required_characteristics`) zodat iedere gebruiker profiteert
+    // van elke geleerde eis, en de gebruiker nooit dezelfde 400 twee keer krijgt.
+    const queryClient = useQueryClient();
     const isEditingDraft = Boolean(initialDraftId);
     const isEditingPublished = Boolean(tradeItemId);
     const isEditingProduct = Boolean(productId);
     const isEditing = isEditingDraft || isEditingPublished || isEditingProduct;
+    const lastSavedRef = useRef(null);
+    // Zolang de post-load hydraties (product/draft/published + prijs- en features-
+    // hydratie) nog kunnen vuren, tellen setData-aanroepen niet als user-edits.
+    // Voorkomt dat een automatische Floriday-PUT vlak na openen wordt gestart.
+    const hydrationSettledRef = useRef(false);
+    useEffect(() => {
+        lastSavedRef.current = null;
+        hydrationSettledRef.current = false;
+    }, [productId, tradeItemId, initialDraftId, activeId]);
+    // Zodra alle load-fases klaar zijn, geven we hydraties nog één micro-tick de
+    // tijd om `setData` te doen; daarna beschouwen we volgende mutaties als edits.
+    useEffect(() => {
+        if (draftLoading || publishedLoading || productLoading)
+            return;
+        const t = window.setTimeout(() => {
+            hydrationSettledRef.current = true;
+        }, 50);
+        return () => window.clearTimeout(t);
+    }, [draftLoading, publishedLoading, productLoading]);
+    // Nieuw artikel: default de Warehouse-select op het voorkeursmagazijn uit de
+    // actieve Floriday-connectie. Alleen wanneer de gebruiker nog niets heeft
+    // gekozen en het magazijn ook echt in de Floriday warehouses-cache van deze
+    // connectie voorkomt (anders zou de push naar Suppliers API 2026v1 een
+    // onbekende warehouseId meesturen).
+    const isNewArticle = !productId && !tradeItemId && !initialDraftId;
+    const preferredWarehouseId = activeConnection?.preferred_warehouse_id ?? null;
+    const resolvePreferredWarehouseId = useCallback(async () => {
+        if (!activeId || !preferredWarehouseId)
+            return null;
+        const { data: wh } = await supabase
+            .from("floriday_warehouses_cache")
+            .select("floriday_id, data")
+            .eq("connection_id", activeId)
+            .eq("floriday_id", preferredWarehouseId)
+            .maybeSingle();
+        if (!wh)
+            return null;
+        const raw = wh.data ?? {};
+        if (raw.isExternal === true || raw.isDeleted === true)
+            return null;
+        return String(wh.floriday_id);
+    }, [activeId, preferredWarehouseId]);
+    useEffect(() => {
+        if (!isNewArticle)
+            return;
+        let cancelled = false;
+        (async () => {
+            const preferred = await resolvePreferredWarehouseId();
+            if (cancelled || !preferred)
+                return;
+            setData((prev) => prev.warehouseId && prev.warehouseId.length > 0
+                ? prev
+                : { ...prev, warehouseId: preferred });
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [isNewArticle, resolvePreferredWarehouseId]);
     const saveWarehousePreference = useCallback(async (targetTradeItemId, warehouseId) => {
         if (!activeId || !targetTradeItemId || !warehouseId)
             return;
@@ -142,6 +225,9 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     .maybeSingle();
                 warehouseId = pref?.warehouse_id ?? warehouseId;
             }
+            if (!warehouseId) {
+                warehouseId = (await resolvePreferredWarehouseId()) ?? "";
+            }
             if (cancelled)
                 return;
             setData({ ...empty, ...row.data, warehouseId });
@@ -155,8 +241,13 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         return () => {
             cancelled = true;
         };
-    }, [initialDraftId, activeId]);
+    }, [initialDraftId, activeId, resolvePreferredWarehouseId]);
     // Load existing ERP product directly into the same Floriday field wizard.
+    // Wanneer het product al aan een Floriday trade item is gekoppeld, halen we
+    // de authoritative Floriday-payload uit `floriday_trade_items_cache` en
+    // mergen die over de lokaal opgeslagen `floriday_payload` heen, zodat elke
+    // wizardstap (paspoort, kenmerken, foto's, beladingen, warehouse, …) direct
+    // is voorgevuld met wat er in Floriday staat.
     useEffect(() => {
         if (!productId)
             return;
@@ -166,7 +257,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
             try {
                 const { data: product, error } = await supabase
                     .from("products")
-                    .select("id,product,barcode,article_number,quantity,sale_price,image_url,plants_per_crate,crates_per_layer,layers_per_cart,floriday_active,floriday_trade_item_id,floriday_payload")
+                    .select("id,product,barcode,article_number,quantity,sale_price,vat_rate,vat_code,image_url,plants_per_crate,crates_per_layer,layers_per_cart,floriday_active,floriday_trade_item_id,floriday_payload")
                     .eq("id", productId)
                     .maybeSingle();
                 if (cancelled)
@@ -184,48 +275,90 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                 const cpl = Number(product.crates_per_layer) || 0;
                 const lpc = Number(product.layers_per_cart) || 0;
                 const payload = (product.floriday_payload ?? {});
+                const fid = (product.floriday_trade_item_id ?? null);
+                const fActive = Boolean(product.floriday_active);
+                // Floriday-cache + warehouse-voorkeur parallel ophalen wanneer we een
+                // gekoppeld trade-item hebben. Missing cache blokkeert de wizard niet;
+                // dan valt hij terug op wat er lokaal is opgeslagen.
+                let cacheData = null;
+                let warehousePref = null;
+                if (fid && activeId) {
+                    try {
+                        const [cacheRes, prefRes] = await Promise.all([
+                            supabase
+                                .from("floriday_trade_items_cache")
+                                .select("data")
+                                .eq("connection_id", activeId)
+                                .eq("floriday_id", fid)
+                                .maybeSingle(),
+                            supabase
+                                .from("trade_item_warehouse_preferences")
+                                .select("warehouse_id")
+                                .eq("connection_id", activeId)
+                                .eq("trade_item_id", fid)
+                                .maybeSingle(),
+                        ]);
+                        if (cacheRes.data?.data) {
+                            cacheData = floridayCacheToWizardData(cacheRes.data.data);
+                            if (!cacheData.productGroup) {
+                                const group = await lookupProductGroupForVbn(cacheData.vbnCode);
+                                if (group)
+                                    cacheData = { ...cacheData, productGroup: group };
+                            }
+                        }
+                        warehousePref = prefRes.data?.warehouse_id ?? null;
+                    }
+                    catch (e) {
+                        // Niet-fataal: wizard laadt door met lokale gegevens.
+                        console.warn("Floriday-cache laden mislukt", e);
+                    }
+                }
+                const cachePackings = cacheData?.packingConfigurations ?? [];
                 const payloadHasPacking = Array.isArray(payload.packingConfigurations) && payload.packingConfigurations.length > 0;
-                const seededPacking = payloadHasPacking
-                    ? payload.packingConfigurations
-                    : ppc > 0 || cpl > 0 || lpc > 0
-                        ? [
-                            {
-                                id: typeof crypto !== "undefined" && "randomUUID" in crypto
-                                    ? crypto.randomUUID()
-                                    : `pk-${Date.now()}`,
-                                source: "VBN",
-                                loadCarrier: "DANISH_TROLLEY",
-                                packagingType: "",
-                                unitsPerPackage: ppc || 1,
-                                packagesPerLayer: cpl || 1,
-                                layersPerLoadCarrier: lpc || 1,
-                                isPrimary: true,
-                                isCustomerSpecific: false,
-                                customerOrganizationIds: [],
-                            },
-                        ]
-                        : [];
-                setData({
-                    ...empty,
-                    ...payload,
-                    name: product.product ?? payload.name ?? "",
-                    articleCode: String(product.article_number ?? payload.articleCode ?? "").trim(),
-                    gtin: validGtin ? barcode : (payload.gtin ?? ""),
-                    salePricePerPiece: Number(product.sale_price ?? payload.salePricePerPiece) || 0,
-                    saleStockPieces: Number(product.quantity ?? payload.saleStockPieces) || 0,
-                    images: Array.isArray(payload.images) && payload.images.length > 0
+                const seededPacking = cachePackings.length > 0
+                    ? cachePackings
+                    : payloadHasPacking
+                        ? payload.packingConfigurations
+                        : ppc > 0 || cpl > 0 || lpc > 0
+                            ? [
+                                {
+                                    id: typeof crypto !== "undefined" && "randomUUID" in crypto
+                                        ? crypto.randomUUID()
+                                        : `pk-${Date.now()}`,
+                                    source: "VBN",
+                                    loadCarrier: "DANISH_TROLLEY",
+                                    packagingType: "",
+                                    unitsPerPackage: ppc || 1,
+                                    packagesPerLayer: cpl || 1,
+                                    layersPerLoadCarrier: lpc || 1,
+                                    isPrimary: true,
+                                    isCustomerSpecific: false,
+                                    customerOrganizationIds: [],
+                                },
+                            ]
+                            : [];
+                const cacheImages = cacheData?.images ?? [];
+                const mergedImages = cacheImages.length > 0
+                    ? cacheImages
+                    : Array.isArray(payload.images) && payload.images.length > 0
                         ? payload.images
                         : imageUrl
                             ? [{ url: imageUrl, name: product.product ?? undefined, primary: true }]
-                            : [],
-                    linkedProductId: product.id,
-                    packingConfigurations: seededPacking,
-                });
-                setDraftId(product.id);
-                setDraftFloridayId((product.floriday_trade_item_id ?? null));
-                const fid = (product.floriday_trade_item_id ?? null);
-                const fActive = Boolean(product.floriday_active);
-                // Voorraad ophalen voor deze product-key
+                            : [];
+                const normalizedPayloadProductGroup = normalizeFloridayProductGroup(payload.productGroup) ??
+                    (await lookupProductGroupForVbn(cacheData?.vbnCode ?? payload.vbnCode));
+                const cacheWarehouseId = cacheData?.warehouseId && cacheData.warehouseId.length > 0
+                    ? cacheData.warehouseId
+                    : "";
+                const payloadWarehouseId = payload.warehouseId ?? "";
+                const preferredWarehouseFallback = warehousePref || cacheWarehouseId || payloadWarehouseId
+                    ? null
+                    : await resolvePreferredWarehouseId();
+                // ── Voorraad ophalen VOOR setData zodat `saleStockPieces` de
+                // werkelijke voorraad reflecteert (i.p.v. de altijd-0
+                // `products.quantity`-kolom, die de wizard anders bij publiceren
+                // terug zou schrijven en zo een bestaande voorraad zou overschrijven
+                // met 0).
                 let physical = 0;
                 try {
                     const { data: stockRow } = await supabase
@@ -236,6 +369,61 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     physical = Number(stockRow?.physical_stock ?? 0);
                 }
                 catch { /* stock niet gevonden = 0 */ }
+                setData({
+                    ...empty,
+                    ...payload,
+                    // Floriday-cache is leidend voor alle Floriday-eigen velden. Alleen
+                    // niet-lege waarden overschrijven, zodat een leeg veld in de cache
+                    // de lokale fallback niet onnodig wist.
+                    ...(cacheData
+                        ? Object.fromEntries(Object.entries(cacheData).filter(([, v]) => {
+                            if (v === null || v === undefined)
+                                return false;
+                            if (typeof v === "string")
+                                return v.length > 0;
+                            if (Array.isArray(v))
+                                return v.length > 0;
+                            if (typeof v === "object")
+                                return Object.keys(v).length > 0;
+                            return true;
+                        }))
+                        : {}),
+                    name: (cacheData?.name && cacheData.name.length > 0
+                        ? cacheData.name
+                        : product.product) ?? payload.name ?? "",
+                    articleCode: (cacheData?.articleCode && cacheData.articleCode.length > 0
+                        ? cacheData.articleCode
+                        : String(product.article_number ?? payload.articleCode ?? "")).trim(),
+                    productGroup: cacheData?.productGroup ??
+                        normalizedPayloadProductGroup ??
+                        empty.productGroup,
+                    gtin: cacheData?.gtin && cacheData.gtin.length > 0
+                        ? cacheData.gtin
+                        : validGtin
+                            ? barcode
+                            : (payload.gtin ?? ""),
+                    salePricePerPiece: Number(product.sale_price ?? payload.salePricePerPiece) || 0,
+                    // Voorkeur: werkelijke voorraad uit trade_item_stock.
+                    // Fallback: opgeslagen payload-waarde. `products.quantity` wordt
+                    // bewust NIET meer gelezen — die staat structureel op 0.
+                    saleStockPieces: physical > 0
+                        ? physical
+                        : Number(payload.saleStockPieces ?? 0) || 0,
+                    vatRate: product.vat_rate !== null && product.vat_rate !== undefined
+                        ? Number(product.vat_rate)
+                        : (payload.vatRate ?? null),
+                    vatCode: product.vat_code ?? payload.vatCode ?? null,
+                    warehouseId: warehousePref ||
+                        cacheWarehouseId ||
+                        payloadWarehouseId ||
+                        preferredWarehouseFallback ||
+                        "",
+                    images: mergedImages,
+                    linkedProductId: product.id,
+                    packingConfigurations: seededPacking,
+                });
+                setDraftId(product.id);
+                setDraftFloridayId(fid);
                 setProductMeta({
                     floridayActive: fActive,
                     floridayTradeItemId: fid,
@@ -254,7 +442,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         return () => {
             cancelled = true;
         };
-    }, [productId]);
+    }, [productId, activeId, resolvePreferredWarehouseId]);
     // Load existing published trade item from the shared cache
     useEffect(() => {
         if (!tradeItemId || !activeId)
@@ -286,9 +474,15 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     return;
                 }
                 const wizardData = floridayCacheToWizardData(row.data);
+                const productGroup = wizardData.productGroup ??
+                    (await lookupProductGroupForVbn(wizardData.vbnCode));
+                const prefWarehouseId = pref?.warehouse_id ?? "";
+                const cachedWarehouseId = wizardData.warehouseId ?? "";
+                const preferredWarehouseFallback = prefWarehouseId || cachedWarehouseId ? null : await resolvePreferredWarehouseId();
                 setData({
                     ...wizardData,
-                    warehouseId: pref?.warehouse_id ?? wizardData.warehouseId,
+                    productGroup,
+                    warehouseId: prefWarehouseId || cachedWarehouseId || preferredWarehouseFallback || "",
                 });
                 setPublishToFloriday(true);
             }
@@ -304,7 +498,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         return () => {
             cancelled = true;
         };
-    }, [tradeItemId, activeId]);
+    }, [tradeItemId, activeId, resolvePreferredWarehouseId]);
     // Floricode data (PascalCase resource namen zoals ze in floricode_records staan)
     const [vbnProducts, setVbnProducts] = useState([]);
     const [featureTypes, setFeatureTypes] = useState([]);
@@ -348,7 +542,45 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
             values: r.values,
         }));
     }, [regulatoryQuery.data]);
-    const spec = useTradeItemSpec(schemaQuery.data, data.vbnCode, data.productGroup, regulatoryFeatures);
+    const specRaw = useTradeItemSpec(schemaQuery.data, data.vbnCode, data.productGroup, regulatoryFeatures);
+    // Gedeelde cache uit `floriday_vbn_required_characteristics`: codes die
+    // Floriday's server-side check bij een eerdere publish-poging (door welke
+    // gebruiker dan ook) als "missing" terugmeldde. Zodra de VBN-code bekend
+    // is, halen we de bekende eisen op zodat het formulier ze meteen toont —
+    // ook bij een nieuw artikel dat deze gebruiker nog nooit heeft gepubliceerd.
+    const vbnRequiredQuery = useFloridayVbnRequired(data.vbnCode);
+    const serverRequiredCodes = useMemo(() => vbnRequiredQuery.data?.requiredCodes ?? [], [vbnRequiredQuery.data]);
+    // Voeg de server-required codes toe aan spec.characteristics (als optionele
+    // codes al bestaan → forceer required; onbekende codes → nieuw toevoegen met
+    // label = code en zonder allowedValues). Zo gedraagt de rest van de wizard
+    // (validatie + rendering) zich alsof Floriday deze eisen zelf publiceerde.
+    const spec = useMemo(() => {
+        if (serverRequiredCodes.length === 0)
+            return specRaw;
+        const byCode = new Map(specRaw.characteristics.map((c) => [c.code, c]));
+        for (const code of serverRequiredCodes) {
+            const existing = byCode.get(code);
+            if (existing) {
+                byCode.set(code, { ...existing, required: true });
+            }
+            else {
+                byCode.set(code, {
+                    code,
+                    label: code,
+                    required: true,
+                    listName: code,
+                    allowedValues: [],
+                });
+            }
+        }
+        const characteristics = Array.from(byCode.values()).sort((a, b) => {
+            if (a.required !== b.required)
+                return Number(b.required) - Number(a.required);
+            return a.code.localeCompare(b.code);
+        });
+        const requiredCharacteristicCodes = new Set(characteristics.filter((c) => c.required).map((c) => c.code));
+        return { ...specRaw, characteristics, requiredCharacteristicCodes };
+    }, [specRaw, serverRequiredCodes]);
     // Set van VBN-product-codes die Floriday tijdens write accepteert.
     // VBN-codes zijn 5- of 6-cijferig en staan in `vbn-product-code` (NIET in
     // `vbn-product-group`, dat bevat 8-cijferige groeps-ID's).
@@ -372,7 +604,49 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         productId: !tradeItemId ? linkedProductId : null,
         draftId: !tradeItemId && !linkedProductId ? (draftId ?? null) : null,
     });
+    // Hydrateer basisprijs + prijsgroep-prijzen uit de lokale spiegel wanneer
+    // we bewerken en de trade_item_key bekend is.
+    const pricesHydratedRef = useRef("");
+    useEffect(() => {
+        if (!localTradeItemKey)
+            return;
+        if (pricesHydratedRef.current === localTradeItemKey)
+            return;
+        if (!isEditing)
+            return;
+        let cancelled = false;
+        pricesHydratedRef.current = localTradeItemKey;
+        readTradeItemPrices(localTradeItemKey)
+            .then((rows) => {
+            if (cancelled || rows.length === 0)
+                return;
+            setData((d) => {
+                const next = { ...d };
+                const groupPrices = { ...(d.priceGroupPrices ?? {}) };
+                for (const r of rows) {
+                    if (r.price_group_id) {
+                        groupPrices[r.price_group_id] = Number(r.price_per_piece);
+                    }
+                    else if (!(d.salePricePerPiece > 0)) {
+                        next.salePricePerPiece = Number(r.price_per_piece);
+                    }
+                }
+                next.priceGroupPrices = groupPrices;
+                return next;
+            });
+        })
+            .catch(() => {
+            pricesHydratedRef.current = "";
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [localTradeItemKey, isEditing]);
     // Bij wissel van VBN: gooi features weg die niet meer bij het schema horen.
+    // BELANGRIJK: de eerste keer dat we een vbnCode zien (initiële hydratie vanuit
+    // Floriday-cache of lokale draft) mogen we NIETS droppen — anders verdwijnen
+    // stil karakteristieken die Floriday wel kent maar ons lokale schema (nog) niet.
+    // Alleen bij een échte user-driven VBN-wissel prunen we.
     const lastPrunedVbnRef = useRef("");
     useEffect(() => {
         if (!data.vbnCode)
@@ -381,6 +655,16 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
             return;
         if (spec.characteristics.length === 0)
             return; // wachten tot spec geladen is
+        if (spec.characteristicsAreFallback) {
+            // Fallback-schema is onbetrouwbaar → alleen markeren, niet droppen.
+            lastPrunedVbnRef.current = data.vbnCode;
+            return;
+        }
+        if (lastPrunedVbnRef.current === "") {
+            // Eerste run per component-instance = hydratie. Markeer en skip.
+            lastPrunedVbnRef.current = data.vbnCode;
+            return;
+        }
         lastPrunedVbnRef.current = data.vbnCode;
         const allowedByCode = new Map(spec.characteristics.map((c) => [c.code, c]));
         setData((d) => {
@@ -401,7 +685,38 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
             }
             return { ...d, features: next };
         });
-    }, [data.vbnCode, spec.characteristics]);
+    }, [data.vbnCode, spec.characteristics, spec.characteristicsAreFallback]);
+    // Hydrateer vbnName wanneer we een code hebben maar (nog) geen naam — komt
+    // voor bij edit-flow: Floriday geeft alleen `vbnProductCode` terug, niet de
+    // omschrijving. Lookup gebeurt exact op record_id in de Floricode-cache.
+    const lastResolvedVbnNameRef = useRef("");
+    useEffect(() => {
+        const code = String(data.vbnCode ?? "").trim();
+        if (!code)
+            return;
+        if (data.vbnName && data.vbnName.length > 0)
+            return;
+        if (lastResolvedVbnNameRef.current === code)
+            return;
+        lastResolvedVbnNameRef.current = code;
+        let cancelled = false;
+        (async () => {
+            try {
+                const rows = await listFloricodeByField("VbnProduct", "record_id", code, 1);
+                const name = rows[0]?.data?.name ??
+                    rows[0]?.data?.description ??
+                    "";
+                if (!cancelled && name)
+                    update("vbnName", name);
+            }
+            catch {
+                /* stille faal — trigger-label valt terug op de code */
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [data.vbnCode, data.vbnName]);
     const validateEigenschappen = (d) => {
         const hasRegulatoryLookup = /^\d{5,6}$/.test(String(d.vbnCode ?? "").trim());
         if (hasRegulatoryLookup && regulatoryQuery.isLoading) {
@@ -558,6 +873,35 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                         toast.error(`Prijs bijwerken mislukt: ${e.message}`);
                     }
                 }
+                // Basisprijs + prijzen per prijsgroep (weekly-base-supply +
+                // weekly-supply-lines) spiegelen naar trade_item_prices en pushen.
+                try {
+                    const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
+                        data.packingConfigurations[0];
+                    const priceSync = await syncTradeItemPrices({
+                        tradeItemId,
+                        tradeItemKey: tradeItemId,
+                        availableQuantity: data.saleStockPieces,
+                        currency: "EUR",
+                        periodStart: data.offerStartDate
+                            ? new Date(`${data.offerStartDate}T00:00:00Z`).toISOString()
+                            : undefined,
+                        basePricePerPiece: data.salePricePerPiece,
+                        pricesByGroupId: data.priceGroupPrices ?? {},
+                        priceGroups,
+                        packingConfigurationId: primary?.id,
+                    });
+                    const failed = priceSync.groupResults.filter((r) => !r.ok);
+                    if (failed.length) {
+                        toast.error(`Prijsgroep(en) niet gepusht: ${failed.map((r) => r.name).join(", ")}`);
+                    }
+                    else if (priceSync.groupResults.length) {
+                        toast.success(`${priceSync.groupResults.length} prijsgroep-prijs(zen) bijgewerkt`);
+                    }
+                }
+                catch (e) {
+                    toast.error(`Prijzen synchroniseren mislukt: ${e.message}`);
+                }
             }
             else if (publishToFloriday) {
                 const payload = buildAddTradeItemPayload(data);
@@ -585,23 +929,36 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     // 1) Seed lokale voorraad (physical_stock) — de continuous-stock
                     //    trigger pusht dit naar Floriday zodra de trade item in de
                     //    cache verschijnt.
+                    //    GUARD: nooit een BESTAANDE voorraad-rij overschrijven. Als
+                    //    er al een rij is (bv. bij herpubliceren of bij een lokaal
+                    //    product met historische voorraad), laten we die met rust
+                    //    om ongewild op 0 zetten te voorkomen. Voorraad wordt
+                    //    beheerd via de Voorraadkaart, niet via de wizard.
                     try {
                         const key = stockKeyFor({ tradeItemId });
                         if (key && data.saleStockPieces > 0) {
-                            const userRes = await supabase.auth.getUser();
-                            const userId = userRes.data.user?.id;
-                            if (userId) {
-                                await supabase
-                                    .from("trade_item_stock")
-                                    .upsert({
-                                    user_id: userId,
-                                    connection_id: activeId,
-                                    trade_item_key: key,
-                                    physical_stock: data.saleStockPieces,
-                                    minimum_stock: 0,
-                                    reserved_stock: 0,
-                                    incoming_stock: 0,
-                                }, { onConflict: "connection_id,trade_item_key" });
+                            const { data: existing } = await supabase
+                                .from("trade_item_stock")
+                                .select("trade_item_key")
+                                .eq("connection_id", activeId)
+                                .eq("trade_item_key", key)
+                                .maybeSingle();
+                            if (!existing) {
+                                const userRes = await supabase.auth.getUser();
+                                const userId = userRes.data.user?.id;
+                                if (userId) {
+                                    await supabase
+                                        .from("trade_item_stock")
+                                        .insert({
+                                        user_id: userId,
+                                        connection_id: activeId,
+                                        trade_item_key: key,
+                                        physical_stock: data.saleStockPieces,
+                                        minimum_stock: 0,
+                                        reserved_stock: 0,
+                                        incoming_stock: 0,
+                                    });
+                                }
                             }
                         }
                     }
@@ -657,6 +1014,31 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     catch (e) {
                         toast.error(`Prijs online zetten mislukt: ${e.message}`);
                     }
+                    // Basisprijs + prijzen per prijsgroep spiegelen + pushen.
+                    try {
+                        const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
+                            data.packingConfigurations[0];
+                        const priceSync = await syncTradeItemPrices({
+                            tradeItemId,
+                            tradeItemKey: tradeItemId,
+                            availableQuantity: data.saleStockPieces,
+                            currency: "EUR",
+                            periodStart: data.offerStartDate
+                                ? new Date(`${data.offerStartDate}T00:00:00Z`).toISOString()
+                                : undefined,
+                            basePricePerPiece: data.salePricePerPiece,
+                            pricesByGroupId: data.priceGroupPrices ?? {},
+                            priceGroups,
+                            packingConfigurationId: primary?.id,
+                        });
+                        const failed = priceSync.groupResults.filter((r) => !r.ok);
+                        if (failed.length) {
+                            toast.error(`Prijsgroep(en) niet gepusht: ${failed.map((r) => r.name).join(", ")}`);
+                        }
+                    }
+                    catch (e) {
+                        toast.error(`Prijzen synchroniseren mislukt: ${e.message}`);
+                    }
                 }
                 else {
                     toast.success("Artikel aangemaakt in Floriday");
@@ -677,7 +1059,27 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         }
         catch (e) {
             const msg = e.message;
-            if (msg.includes("NO_ACTIVE_FLORIDAY_CONNECTION")) {
+            const missingCodes = isMissingCharacteristicsError(msg);
+            if (missingCodes.length > 0) {
+                // Floriday's server-side check gaf terug welke karakteristieken nog
+                // ontbreken. Schrijf ze naar de gedeelde Supabase-cache zodat iedere
+                // gebruiker deze eisen vanaf nu vóór de call te zien krijgt, en
+                // navigeer terug naar Eigenschappen zodat ze meteen invulbaar zijn.
+                if (data.vbnCode) {
+                    try {
+                        const res = await saveFloridayVbnRequired({
+                            data: { vbnCode: data.vbnCode, codes: missingCodes },
+                        });
+                        queryClient.setQueryData(["floriday-vbn-required", data.vbnCode], { vbnCode: res.vbnCode, requiredCodes: res.requiredCodes });
+                    }
+                    catch { /* cache-write mag stilletjes falen */ }
+                }
+                const eigenschappenIdx = visibleSteps(data).findIndex((s) => s.key === "eigenschappen");
+                if (eigenschappenIdx >= 0)
+                    setStep(eigenschappenIdx);
+                toast.error(`Floriday vereist nog: ${missingCodes.join(", ")}. Vul deze eigenschappen in en probeer opnieuw.`);
+            }
+            else if (msg.includes("NO_ACTIVE_FLORIDAY_CONNECTION")) {
                 toast.error("Geen actieve Floriday-connectie. Ga naar Instellingen → Floriday.");
             }
             else {
@@ -742,7 +1144,6 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
     // een PUT /trade-items/{id} naar Floriday gestuurd en de lokale cache
     // meteen bijgewerkt, zodat aanpassingen (o.a. beladingen) direct overal in
     // het systeem beschikbaar zijn en niet verloren raken bij navigatie.
-    const lastSavedRef = useRef(null);
     useEffect(() => {
         if (!activeId)
             return;
@@ -752,7 +1153,10 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         if (!draftId && !pushTargetId)
             return;
         const serialized = JSON.stringify(data);
-        if (lastSavedRef.current === null) {
+        if (lastSavedRef.current === null || !hydrationSettledRef.current) {
+            // Hydratie-effects (product/draft/cache load, prijzen, VBN-features prune)
+            // mogen niet als user-edit gelden — schuif de baseline mee tot de wizard
+            // echt tot rust is gekomen.
             lastSavedRef.current = serialized;
             return;
         }
@@ -766,8 +1170,22 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                 if (draftId) {
                     await upsertLocalTradeItem({ id: draftId, connectionId: activeId, data });
                 }
+                if (pushTargetId && !data.productGroup) {
+                    setSyncState(draftId ? "local" : "idle");
+                    lastSavedRef.current = serialized;
+                    return;
+                }
                 // Push naar Floriday als er een gekoppeld/gepubliceerd trade-item is
                 if (pushTargetId) {
+                    // Geen warehouse gekozen? Sla stil lokaal op — geen toast, geen rode
+                    // pill. Zodra de gebruiker een warehouse kiest gaat de sync verder.
+                    const whId = (data.warehouseId ?? "").trim();
+                    const isUuid = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(whId);
+                    if (!isUuid) {
+                        setSyncState(draftId ? "local" : "idle");
+                        lastSavedRef.current = serialized;
+                        return;
+                    }
                     await saveWarehousePreference(pushTargetId, data.warehouseId);
                     const payload = buildUpdateTradeItemPayload(data);
                     const res = await floriday.updateTradeItem(activeId, pushTargetId, payload);
@@ -830,7 +1248,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
     if (!activeConnection) {
         return (_jsx("main", { className: "p-6", children: _jsx(Card, { className: "p-6", children: "Geen actieve Floriday-connectie gevonden. Voeg er eerst een toe in Instellingen." }) }));
     }
-    return (_jsxs("main", { className: "mx-auto w-full max-w-3xl space-y-6 p-6", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Button, { variant: "ghost", size: "sm", asChild: true, children: _jsxs(Link, { to: "/voorraad", children: [_jsx(ArrowLeft, { className: "mr-2 h-4 w-4" }), "Terug naar voorraad"] }) }), !isEditingPublished && (_jsxs(Button, { variant: "outline", size: "sm", className: "ml-auto", onClick: saveDraft, disabled: submitting || (!draftId && !vbnValid), children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(ClipboardList, { className: "mr-2 h-4 w-4" })), "Product opslaan"] })), (isEditingDraft || isEditingProduct) && (_jsxs(AlertDialog, { open: deleteOpen, onOpenChange: (o) => {
+    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Button, { variant: "ghost", size: "sm", asChild: true, children: _jsxs(Link, { to: "/voorraad", children: [_jsx(ArrowLeft, { className: "mr-2 h-4 w-4" }), "Terug naar voorraad"] }) }), !isEditingPublished && (_jsxs(Button, { variant: "outline", size: "sm", className: "ml-auto", onClick: saveDraft, disabled: submitting || (!draftId && !vbnValid), children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(ClipboardList, { className: "mr-2 h-4 w-4" })), "Product opslaan"] })), (isEditingDraft || isEditingProduct) && (_jsxs(AlertDialog, { open: deleteOpen, onOpenChange: (o) => {
                             setDeleteOpen(o);
                             if (!o)
                                 setDeleteAck(false);
@@ -860,7 +1278,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                                                     ? "border-primary bg-primary text-primary-foreground"
                                                     : status === "invalid"
                                                         ? "border-destructive bg-destructive text-destructive-foreground"
-                                                        : "border-muted-foreground/30 text-muted-foreground"}`, children: status === "valid" ? (_jsx(Check, { className: "h-4 w-4" })) : status === "invalid" ? ("!") : (i + 1) }), _jsx("span", { className: `min-w-0 truncate font-medium ${status === "untouched" ? "text-muted-foreground" : ""}`, children: s.label }), !isOpen && summary && (_jsx("span", { className: `max-w-xs truncate text-xs ${status === "invalid" ? "text-destructive" : "text-muted-foreground"}`, children: status === "invalid" ? `Onvolledig — ${summary}` : summary }))] }), isOpen && (_jsxs(CardContent, { className: "space-y-4 pt-0", children: [_jsx("div", { "data-wizard-form-content": true, className: "w-full min-w-0", children: _jsx(StepBody, { stepKey: s.key, data: data, update: update, vbnProducts: vbnProducts, featureTypes: featureTypes, packagingTypes: packagingTypes, loadCarriers: loadCarriers, floridayCustomers: floridayCustomers, schemaQuery: schemaQuery, regulatoryQuery: regulatoryQuery, spec: spec, collectionsList: collectionsList, setCollectionsList: setCollectionsList, activeId: activeId, acceptedVbnCodes: acceptedVbnCodes }) }), isLastStep && !isEditingPublished && (_jsxs("div", { className: "rounded-lg border bg-muted/30 p-4 flex items-start gap-3", children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-7 w-7 shrink-0 mt-0.5" }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx(Label, { htmlFor: "publish-to-floriday", className: "font-medium cursor-pointer", children: "Publiceren naar Floriday" }), _jsx("p", { className: "text-xs text-muted-foreground mt-1", children: publishToFloriday
+                                                        : "border-muted-foreground/30 text-muted-foreground"}`, children: status === "valid" ? (_jsx(Check, { className: "h-4 w-4" })) : status === "invalid" ? ("!") : (i + 1) }), _jsx("span", { className: `min-w-0 truncate font-medium ${status === "untouched" ? "text-muted-foreground" : ""}`, children: s.label }), !isOpen && summary && (_jsx("span", { className: `max-w-xs truncate text-xs ${status === "invalid" ? "text-destructive" : "text-muted-foreground"}`, children: status === "invalid" ? `Onvolledig — ${summary}` : summary }))] }), isOpen && (_jsxs(CardContent, { className: "space-y-4 pt-0", children: [_jsx("div", { "data-wizard-form-content": true, className: "w-full min-w-0", children: _jsx(StepBody, { stepKey: s.key, data: data, update: update, vbnProducts: vbnProducts, featureTypes: featureTypes, packagingTypes: packagingTypes, loadCarriers: loadCarriers, floridayCustomers: floridayCustomers, schemaQuery: schemaQuery, regulatoryQuery: regulatoryQuery, spec: spec, collectionsList: collectionsList, setCollectionsList: setCollectionsList, activeId: activeId, acceptedVbnCodes: acceptedVbnCodes, priceGroups: priceGroups, parentProductId: linkedProductId ?? draftId ?? null, parentFloridayId: draftFloridayId ?? tradeItemId ?? null, articleCodeLocked: Boolean(draftFloridayId || tradeItemId) }) }), isLastStep && !isEditingPublished && (_jsxs("div", { className: "rounded-lg border bg-muted/30 p-4 flex items-start gap-3", children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-7 w-7 shrink-0 mt-0.5" }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx(Label, { htmlFor: "publish-to-floriday", className: "font-medium cursor-pointer", children: "Publiceren naar Floriday" }), _jsx("p", { className: "text-xs text-muted-foreground mt-1", children: publishToFloriday
                                                                 ? "Het artikel wordt aangemaakt in Floriday en is binnen enkele minuten zichtbaar voor klanten."
                                                                 : "Het artikel wordt alleen lokaal opgeslagen. Je kunt het later vanuit de voorraadlijst alsnog publiceren naar Floriday." })] }), _jsx(Switch, { id: "publish-to-floriday", checked: publishToFloriday, onCheckedChange: setPublishToFloriday })] })), (isLastStep || isEditing) && invalidStepCount > 0 && (_jsxs("div", { className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive flex items-center justify-between gap-3", children: [_jsxs("span", { children: ["Nog ", invalidStepCount, " stap", invalidStepCount === 1 ? "" : "pen", " onvolledig"] }), firstInvalidIndex >= 0 && (_jsxs("button", { type: "button", onClick: () => setStep(firstInvalidIndex), className: "underline font-medium", children: ["Ga naar ", steps[firstInvalidIndex].label] }))] })), _jsx("div", { className: "flex justify-end pt-2", children: isLastStep || isEditing ? (_jsxs(Button, { onClick: submit, disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), isEditingPublished
                                                         ? "Wijzigingen opslaan"
@@ -915,9 +1333,13 @@ function summaryFor(key, d) {
                 ? `${d.additionalPackaging.length} item(s)`
                 : "Geen extra verpakking";
         case "samenstelling":
-            return "Binnenkort beschikbaar";
+            return "Basis + per belading";
         case "beschikbaarheid":
-            return d.yearRound ? "Jaarrond" : `${d.weeks.length} week/weken`;
+            if (d.availabilityMode === "YEAR_ROUND")
+                return "Jaarrond";
+            if (d.availabilityMode === "UNSPECIFIED")
+                return "Niet gespecificeerd";
+            return `${d.weeks.length} week/weken`;
         case "aanbieden":
             if (!d.offerForSale)
                 return "Niet aanbieden";
@@ -950,7 +1372,10 @@ function StepBody(p) {
         case "verpakking":
             return _jsx(StepVerpakking, { ...p });
         case "samenstelling":
-            return (_jsx("div", { className: "rounded-md border border-dashed p-6 text-center text-sm text-muted-foreground", children: "Binnenkort beschikbaar" }));
+            return (_jsx(StepSamenstelling, { productId: p.parentProductId, floridayId: p.parentFloridayId, packings: p.data.packingConfigurations, packagingTypeLabel: (code) => {
+                    const rec = p.packagingTypes.find((r) => codeOf(r) === code);
+                    return rec ? labelOf(rec) : code;
+                } }));
         case "beschikbaarheid":
             return _jsx(StepBeschikbaarheid, { ...p });
         case "aanbieden":
@@ -985,11 +1410,11 @@ function groupOfRecord(r) {
     const n = Number(raw);
     if (Number.isFinite(n) && n > 0) {
         const s = String(Math.floor(n));
-        if (s.startsWith("10"))
+        if (s.startsWith("10") || s.startsWith("11"))
             return "CUT_FLOWER";
-        if (s.startsWith("20"))
+        if (s.startsWith("20") || s.startsWith("21") || s.startsWith("29"))
             return "POT_PLANT";
-        if (s.startsWith("30"))
+        if (s.startsWith("30") || s.startsWith("31"))
             return "GARDEN_PLANT";
         return null;
     }
@@ -1086,8 +1511,12 @@ function StepVbn({ data, update, acceptedVbnCodes }) {
         setQuery("");
     };
     const triggerLabel = data.vbnName
-        ? data.vbnName
-        : "Selecteer een VBN productcode";
+        ? data.vbnCode
+            ? `${data.vbnCode} – ${data.vbnName}`
+            : data.vbnName
+        : data.vbnCode
+            ? data.vbnCode
+            : "Selecteer een VBN productcode";
     return (_jsxs("div", { className: "space-y-5", children: [_jsxs("div", { children: [_jsx(Label, { className: "mb-2 block", children: "Productcode" }), _jsxs("div", { className: "grid gap-3 md:grid-cols-2", children: [_jsxs(Select, { value: groupValue, onValueChange: (v) => {
                                     const next = v === "ALL" ? null : v;
                                     update("productGroup", next);
@@ -1122,7 +1551,7 @@ function StepVbn({ data, update, acceptedVbnCodes }) {
 function InfoTip({ text }) {
     return (_jsx("span", { title: text, className: "inline-flex cursor-help text-muted-foreground", children: _jsx(Info, { className: "h-3.5 w-3.5" }) }));
 }
-function StepArtikel({ data, update, collectionsList, setCollectionsList }) {
+function StepArtikel({ data, update, collectionsList, setCollectionsList, articleCodeLocked }) {
     const [newCollection, setNewCollection] = useState("");
     const [showNewCollection, setShowNewCollection] = useState(false);
     const addCollection = async (name) => {
@@ -1152,7 +1581,7 @@ function StepArtikel({ data, update, collectionsList, setCollectionsList }) {
             icon: ClipboardList,
         },
     ];
-    return (_jsxs("div", { className: "grid gap-5", children: [_jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { className: "flex items-center gap-1.5", children: ["Artikelcode ", _jsx("span", { className: "text-destructive", children: "*" }), _jsx(InfoTip, { text: "Dit is je eigen referentie naar dit artikel, ook wel bekend als de kweker-artikelcode." })] }), _jsx(Input, { value: data.articleCode, onChange: (e) => update("articleCode", e.target.value) })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { children: ["Naam ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(Input, { value: data.name, onChange: (e) => update("name", e.target.value) })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { className: "flex items-center gap-1.5", children: ["GTIN ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optioneel)" }), _jsx(InfoTip, { text: "GTIN staat voor 'Global Trade Item Number', een 13-cijferige barcode" })] }), _jsx(Input, { value: data.gtin, onChange: (e) => update("gtin", e.target.value) })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { children: ["Collecties ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optioneel)" })] }), data.collections.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-1.5", children: data.collections.map((c) => (_jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-1 text-xs", children: [c, _jsx("button", { type: "button", onClick: () => removeCollection(c), className: "hover:text-destructive", children: _jsx(X, { className: "h-3 w-3" }) })] }, c))) })), !showNewCollection ? (_jsxs(Select, { value: "", onValueChange: (v) => {
+    return (_jsxs("div", { className: "grid gap-5", children: [_jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { className: "flex items-center gap-1.5", children: ["Artikelcode ", !articleCodeLocked && _jsx("span", { className: "text-destructive", children: "*" }), _jsx(InfoTip, { text: "Dit is je eigen referentie naar dit artikel, ook wel bekend als de kweker-artikelcode." })] }), _jsx(Input, { value: data.articleCode, onChange: (e) => update("articleCode", e.target.value), disabled: articleCodeLocked, readOnly: articleCodeLocked }), articleCodeLocked && (_jsx("p", { className: "text-xs text-muted-foreground", children: "Artikelcode ligt vast in Floriday en kan niet meer gewijzigd worden." }))] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { children: ["Naam ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(Input, { value: data.name, onChange: (e) => update("name", e.target.value) })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { className: "flex items-center gap-1.5", children: ["GTIN ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optioneel)" }), _jsx(InfoTip, { text: "GTIN staat voor 'Global Trade Item Number', een 13-cijferige barcode" })] }), _jsx(Input, { value: data.gtin, onChange: (e) => update("gtin", e.target.value) })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { children: ["Collecties ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optioneel)" })] }), data.collections.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-1.5", children: data.collections.map((c) => (_jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-1 text-xs", children: [c, _jsx("button", { type: "button", onClick: () => removeCollection(c), className: "hover:text-destructive", children: _jsx(X, { className: "h-3 w-3" }) })] }, c))) })), !showNewCollection ? (_jsxs(Select, { value: "", onValueChange: (v) => {
                             if (v === "__new__") {
                                 setShowNewCollection(true);
                                 return;
@@ -1174,7 +1603,7 @@ function StepArtikel({ data, update, collectionsList, setCollectionsList }) {
                                 } }), _jsx(Button, { type: "button", size: "sm", onClick: () => addCollection(newCollection), children: _jsx(Plus, { className: "h-4 w-4" }) }), _jsx(Button, { type: "button", size: "sm", variant: "outline", onClick: () => {
                                     setShowNewCollection(false);
                                     setNewCollection("");
-                                }, children: "Annuleer" })] }))] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Type artikel" }), _jsx("div", { className: "grid grid-cols-2 gap-3", children: articleTypes.map((t) => {
+                                }, children: "Annuleer" })] })), _jsx("p", { className: "text-xs text-muted-foreground", children: "Collecties worden voorlopig lokaal opgeslagen; koppeling met Floriday-collecties volgt in een aparte update." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Type artikel" }), _jsx("div", { className: "grid grid-cols-2 gap-3", children: articleTypes.map((t) => {
                             const Icon = t.icon;
                             const active = data.articleType === t.value;
                             return (_jsxs("button", { type: "button", onClick: () => update("articleType", t.value), className: `flex flex-col items-center gap-2 rounded-lg border p-4 text-center transition-colors ${active
@@ -1237,7 +1666,10 @@ function StepPaspoort({ data, update }) {
                                                 : "truncate", children: countryLabel }), _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 opacity-50" })] }) }), _jsxs(PopoverContent, { align: "start", sideOffset: 4, className: "w-[var(--radix-popover-trigger-width)] p-0", children: [_jsxs("div", { className: "flex items-center gap-2 border-b px-3 py-2", children: [_jsx(Search, { className: "h-4 w-4 text-muted-foreground" }), _jsx("input", { autoFocus: true, value: countryQuery, onChange: (e) => setCountryQuery(e.target.value), placeholder: "Zoek land\u2026", className: "h-7 w-full border-0 bg-transparent text-sm outline-none placeholder:text-muted-foreground" })] }), _jsxs("div", { className: "max-h-72 overflow-y-auto py-1", children: [filteredCountries.length === 0 && (_jsx("div", { className: "px-3 py-3 text-sm text-muted-foreground", children: "Geen resultaten." })), filteredCountries.map((c) => {
                                                 const checked = selectedCountries.includes(c.code);
                                                 return (_jsxs("button", { type: "button", onClick: () => toggleCountry(c.code), className: "flex w-full items-center gap-3 px-3 py-2 text-left text-sm hover:bg-muted", children: [_jsx(Checkbox, { checked: checked }), _jsx("span", { className: "flex-1", children: c.name }), _jsx("span", { className: "font-mono text-xs text-muted-foreground", children: c.code })] }, c.code));
-                                            })] })] })] })] })] }));
+                                            })] })] })] }), selectedCountries.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-2 pt-1", children: selectedCountries.map((code) => {
+                            const name = COUNTRIES.find((o) => o.code === code)?.name ?? code;
+                            return (_jsxs("span", { className: "inline-flex items-center gap-2 rounded-md border border-input bg-background px-2.5 py-1 text-sm", children: [name, _jsx("button", { type: "button", "aria-label": `Verwijder ${name}`, onClick: () => toggleCountry(code), className: "flex h-4 w-4 items-center justify-center rounded-full bg-muted-foreground/70 text-background transition hover:bg-destructive", children: _jsx(X, { className: "h-3 w-3" }) })] }, code));
+                        }) }))] })] }));
 }
 function StepEigenschappen({ data, update, spec, schemaQuery, regulatoryQuery }) {
     if (!data.vbnCode) {
@@ -1295,6 +1727,11 @@ function EigenschappenBody({ data, update, spec, }) {
     const hasValue = (code) => Boolean((data.features[code] ?? "").trim());
     const visibleFields = spec.characteristics.filter((c) => c.required || visibleOptional.has(c.code) || hasValue(c.code));
     const hiddenOptional = spec.characteristics.filter((c) => !c.required && !visibleOptional.has(c.code) && !hasValue(c.code));
+    // Codes die Floriday teruggeeft maar die het lokale spec-schema niet kent.
+    // Deze mogen NIET stil worden gedropt — we tonen ze als bewerkbaar veld zodat
+    // de gebruiker ze kan wijzigen of verwijderen, en de PUT-payload behoudt ze.
+    const knownCodes = new Set(spec.characteristics.map((c) => c.code));
+    const extraCodes = Object.keys(data.features).filter((code) => hasValue(code) && !knownCodes.has(code));
     const filteredHidden = hiddenOptional.filter((c) => {
         if (!addSearch.trim())
             return true;
@@ -1321,7 +1758,13 @@ function EigenschappenBody({ data, update, spec, }) {
         delete nextFeatures[code];
         update("features", nextFeatures);
     };
-    return (_jsxs("div", { className: "grid gap-4", children: [spec.characteristicsAreFallback && (_jsx("p", { className: "rounded-md border border-amber-200 bg-amber-50 p-3 text-xs text-amber-900", children: "Floriday levert voor deze VBN-code nog geen specifieke verplichte karakteristieken aan. Voeg via \"+ Eigenschap toevoegen\" de karakteristieken toe die van toepassing zijn." })), visibleFields.length === 0 && !spec.characteristicsAreFallback && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Er zijn geen verplichte karakteristieken voor deze VBN-code. Voeg optioneel eigenschappen toe via de knop hieronder." })), visibleFields.map((f) => (_jsx(CharacteristicField, { field: f, value: data.features[f.code] || "", onChange: (v) => update("features", { ...data.features, [f.code]: v }), onRemove: f.required ? undefined : () => removeField(f.code) }, f.code))), _jsx("div", { children: _jsxs(Popover, { open: addOpen, onOpenChange: (o) => { setAddOpen(o); if (!o)
+    return (_jsxs("div", { className: "grid gap-4", children: [spec.characteristicsAreFallback && (_jsx("p", { className: "rounded-md border border-amber-200 bg-amber-50 p-3 text-xs text-amber-900", children: "Floriday levert voor deze VBN-code nog geen specifieke verplichte karakteristieken aan. Voeg via \"+ Eigenschap toevoegen\" de karakteristieken toe die van toepassing zijn." })), visibleFields.length === 0 && !spec.characteristicsAreFallback && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Er zijn geen verplichte karakteristieken voor deze VBN-code. Voeg optioneel eigenschappen toe via de knop hieronder." })), visibleFields.map((f) => (_jsx(CharacteristicField, { field: f, value: data.features[f.code] || "", onChange: (v) => update("features", { ...data.features, [f.code]: v }), onRemove: f.required ? undefined : () => removeField(f.code) }, f.code))), extraCodes.map((code) => (_jsx(CharacteristicField, { field: {
+                    code,
+                    label: code,
+                    required: false,
+                    listName: code,
+                    allowedValues: [],
+                }, value: data.features[code] || "", onChange: (v) => update("features", { ...data.features, [code]: v }), onRemove: () => removeField(code) }, code))), _jsx("div", { children: _jsxs(Popover, { open: addOpen, onOpenChange: (o) => { setAddOpen(o); if (!o)
                         setAddSearch(""); }, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", disabled: hiddenOptional.length === 0, className: "gap-2", children: [_jsx(Plus, { className: "h-4 w-4" }), "Eigenschap toevoegen", hiddenOptional.length > 0 && (_jsxs("span", { className: "text-xs text-muted-foreground", children: ["(", hiddenOptional.length, ")"] }))] }) }), _jsxs(PopoverContent, { align: "start", className: "w-[380px] p-0", children: [_jsx("div", { className: "border-b p-2", children: _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "absolute left-2 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { autoFocus: true, value: addSearch, onChange: (e) => setAddSearch(e.target.value), placeholder: "Zoek op code of naam\u2026", className: "h-8 pl-7 text-sm" })] }) }), _jsx("div", { className: "max-h-64 overflow-y-auto p-1", children: filteredHidden.length === 0 ? (_jsx("p", { className: "p-3 text-xs text-muted-foreground", children: hiddenOptional.length === 0
                                             ? "Alle beschikbare karakteristieken zijn al toegevoegd."
                                             : "Geen resultaten." })) : (filteredHidden.map((c) => (_jsxs("button", { type: "button", onClick: () => showField(c.code), className: "flex w-full items-center justify-between gap-2 rounded px-2 py-1.5 text-left text-sm hover:bg-accent", children: [_jsx("span", { className: "truncate", children: c.label }), _jsx("span", { className: "font-mono text-xs text-muted-foreground", children: c.code })] }, c.code)))) })] })] }) })] }));
@@ -1502,7 +1945,34 @@ function StepFotos({ data, update, activeId }) {
                 }, className: `flex items-center gap-6 rounded-md border-2 border-dashed px-8 py-10 transition-colors ${isDragging ? "border-primary bg-primary/5" : "border-border bg-background"}`, children: [_jsxs("div", { className: "relative shrink-0", children: [_jsx(UploadCloud, { className: "h-16 w-16 text-muted-foreground/60", strokeWidth: 1.25 }), _jsx("div", { className: "absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full border border-muted-foreground/40 bg-background", children: _jsx(Plus, { className: "h-3 w-3 text-muted-foreground" }) })] }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "text-base font-semibold text-foreground", children: uploading ? "Uploaden..." : "Sleep afbeeldingen in dit venster om ze te uploaden" }), _jsxs("div", { className: "mt-1 text-sm text-muted-foreground", children: ["Of kies", " ", _jsx("button", { type: "button", onClick: () => inputRef.current?.click(), className: "text-foreground underline-offset-2 hover:underline", children: "Bestanden selecteren" })] }), _jsx("div", { className: "mt-2 text-xs text-muted-foreground", children: "JPG of PNG \u00B7 min. 640 \u00D7 640 px \u00B7 max. 5 MB per bestand" })] }), _jsx("input", { ref: inputRef, type: "file", multiple: true, accept: "image/png,image/jpeg", className: "hidden", onChange: (e) => {
                             onFiles(e.target.files);
                             e.target.value = "";
-                        } })] }), data.images.length > 0 && (_jsx("div", { className: "grid grid-cols-4 gap-2", children: data.images.map((img, idx) => (_jsxs("div", { className: "relative group rounded-md overflow-hidden border", children: [_jsx("img", { src: img.previewUrl || img.url, alt: img.name, className: "h-24 w-full object-cover" }), _jsx("button", { type: "button", onClick: () => update("images", data.images.filter((_, i) => i !== idx)), className: "absolute top-1 right-1 rounded-full bg-background/80 p-1 opacity-0 group-hover:opacity-100", children: _jsx(X, { className: "h-3 w-3" }) })] }, img.url))) }))] }));
+                        } })] }), data.images.length > 0 && (_jsx("div", { className: "grid grid-cols-4 gap-3", children: data.images.map((img, idx) => {
+                    const setImages = (fn) => update("images", fn(data.images));
+                    const removeAt = () => setImages((arr) => arr.filter((_, i) => i !== idx));
+                    const setPrimary = () => setImages((arr) => arr.map((it, k) => ({ ...it, primary: k === idx })));
+                    const move = (dir) => setImages((arr) => {
+                        const target = idx + dir;
+                        if (target < 0 || target >= arr.length)
+                            return arr;
+                        const next = arr.slice();
+                        [next[idx], next[target]] = [next[target], next[idx]];
+                        return next;
+                    });
+                    const setType = (v) => setImages((arr) => arr.map((it, k) => (k === idx ? { ...it, type: v } : it)));
+                    return (_jsxs("div", { className: "relative group rounded-md overflow-hidden border bg-background", children: [_jsxs("div", { className: "relative", children: [_jsx("img", { src: img.previewUrl || img.url, alt: img.name, className: "h-28 w-full object-cover" }), img.primary && (_jsxs("span", { className: "absolute top-1 left-1 inline-flex items-center gap-1 rounded-full bg-primary px-2 py-0.5 text-[10px] font-medium text-primary-foreground", children: [_jsx(Star, { className: "h-3 w-3 fill-current" }), " Hoofdfoto"] })), _jsx("button", { type: "button", onClick: removeAt, "aria-label": "Verwijder foto", className: "absolute top-1 right-1 rounded-full bg-background/80 p-1 opacity-0 transition group-hover:opacity-100", children: _jsx(X, { className: "h-3 w-3" }) })] }), _jsxs("div", { className: "grid gap-1.5 p-2", children: [_jsxs(Select, { value: img.type ?? "WEBSHOPFRIENDLY", onValueChange: setType, children: [_jsx(SelectTrigger, { className: "h-8 text-xs", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: [
+                                                    ["WEBSHOPFRIENDLY", "Standaard (webshop)"],
+                                                    ["PIECE", "Stuk"],
+                                                    ["TRAY", "Tray"],
+                                                    ["DETAIL", "Detail"],
+                                                    ["RULER", "Meetlat"],
+                                                    ["SCENE", "Scène"],
+                                                    ["SEASON", "Seizoen"],
+                                                    ["STEM", "Steel"],
+                                                    ["BUNCH", "Bos"],
+                                                    ["CONTAINER", "Container"],
+                                                    ["CLOCK", "Klok"],
+                                                    ["UNKNOWN", "Onbekend"],
+                                                ].map(([value, label]) => (_jsx(SelectItem, { value: value, children: label }, value))) })] }), _jsxs("div", { className: "flex items-center justify-between gap-1", children: [_jsxs("div", { className: "flex gap-1", children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "h-7 w-7 p-0", onClick: () => move(-1), disabled: idx === 0, "aria-label": "Verplaats naar links", children: _jsx(ArrowLeft, { className: "h-3.5 w-3.5" }) }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "h-7 w-7 p-0", onClick: () => move(1), disabled: idx === data.images.length - 1, "aria-label": "Verplaats naar rechts", children: _jsx(ArrowRight, { className: "h-3.5 w-3.5" }) })] }), !img.primary && (_jsxs(Button, { type: "button", variant: "outline", size: "sm", className: "h-7 px-2 text-[11px]", onClick: setPrimary, children: [_jsx(Star, { className: "mr-1 h-3 w-3" }), " Hoofdfoto"] }))] })] })] }, img.url));
+                }) }))] }));
 }
 /**
  * Warehouse-stap — verplicht in Floriday Suppliers API 2026v1.
@@ -1601,12 +2071,12 @@ function StepBeladingen({ data, update, packagingTypes, loadCarriers, floridayCu
     const editing = editingId
         ? data.packingConfigurations.find((p) => p.id === editingId) ?? null
         : null;
-    return (_jsxs("div", { className: "space-y-4", children: [data.packingConfigurations.length === 0 ? (_jsx("div", { className: "rounded-md border border-dashed p-6 text-center", children: _jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen beladingsconfiguratie toegevoegd." }) })) : (_jsx("div", { className: "overflow-hidden rounded-md border", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-muted/50 text-left text-xs uppercase text-muted-foreground", children: _jsxs("tr", { children: [_jsx("th", { className: "px-3 py-2 font-medium", children: "Primair" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Fust" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Ladingdrager" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Stuks / laag / drager" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Type" }), _jsx("th", { className: "px-3 py-2" })] }) }), _jsx("tbody", { className: "divide-y", children: data.packingConfigurations.map((p) => {
+    return (_jsxs("div", { className: "space-y-4", children: [data.packingConfigurations.length === 0 ? (_jsx("div", { className: "rounded-md border border-dashed p-6 text-center", children: _jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen beladingsconfiguratie toegevoegd." }) })) : (_jsx("div", { className: "overflow-hidden rounded-md border", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-muted/50 text-left text-xs uppercase text-muted-foreground", children: _jsxs("tr", { children: [_jsx("th", { className: "px-3 py-2 font-medium", children: "Primair" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Fust" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Ladingdrager" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Belading" }), _jsx("th", { className: "px-3 py-2 font-medium", children: "Type" }), _jsx("th", { className: "px-3 py-2" })] }) }), _jsx("tbody", { className: "divide-y", children: data.packingConfigurations.map((p) => {
                                 const pkgLabel = packagingTypes.find((r) => codeOf(r) === p.packagingType);
                                 const lcLabel = loadCarriers.find((r) => codeOf(r) === p.loadCarrier);
                                 return (_jsxs("tr", { className: "hover:bg-muted/30", children: [_jsx("td", { className: "px-3 py-2", children: _jsx("input", { type: "radio", name: "primary-packing", checked: Boolean(p.isPrimary), onChange: () => setPrimary(p.id), "aria-label": "Als primaire belading instellen" }) }), _jsxs("td", { className: "px-3 py-2", children: [_jsx("div", { className: "font-medium", children: pkgLabel
                                                         ? `${codeOf(pkgLabel)}: ${labelOf(pkgLabel)}`
-                                                        : p.packagingType || "—" }), p.source === "SUPPLIER" && (_jsx("div", { className: "text-xs text-muted-foreground", children: p.packagingSupplierName ?? p.packagingSupplierId }))] }), _jsx("td", { className: "px-3 py-2", children: LOAD_CARRIER_LABELS[p.loadCarrier] ?? p.loadCarrier ?? "—" }), _jsxs("td", { className: "px-3 py-2 tabular-nums", children: [p.unitsPerPackage, " / ", p.packagesPerLayer, " /", " ", p.layersPerLoadCarrier] }), _jsx("td", { className: "px-3 py-2", children: p.isCustomerSpecific ? (_jsxs("span", { className: "rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-900", children: ["Klantspecifiek (", p.customerOrganizationIds.length, ")"] })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: "Regulier" })) }), _jsx("td", { className: "px-3 py-2 text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => openEdit(p.id), children: "Bewerk" }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => remove(p.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }) })] }, p.id));
+                                                        : p.packagingType || "—" }), p.source === "SUPPLIER" && (_jsx("div", { className: "text-xs text-muted-foreground", children: p.packagingSupplierName ?? p.packagingSupplierId }))] }), _jsx("td", { className: "px-3 py-2", children: LOAD_CARRIER_LABELS[p.loadCarrier] ?? p.loadCarrier ?? "—" }), _jsxs("td", { className: "px-3 py-2 tabular-nums", children: [p.layersPerLoadCarrier, "\u00D7", p.packagesPerLayer, "\u00D7", p.unitsPerPackage] }), _jsx("td", { className: "px-3 py-2", children: _jsxs("div", { className: "flex flex-wrap items-center gap-1", children: [p.isCustomerSpecific ? (_jsxs("span", { className: "rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-900", children: ["Klantspecifiek (", p.customerOrganizationIds.length, ")"] })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: "Regulier" })), p.isHiddenForDirectSales && (_jsx("span", { className: "rounded bg-slate-200 px-2 py-0.5 text-xs text-slate-700", children: "Verborgen" }))] }) }), _jsx("td", { className: "px-3 py-2 text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => openEdit(p.id), children: "Bewerk" }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => remove(p.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }) })] }, p.id));
                             }) })] }) })), _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: openNew, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Belading toevoegen"] }), _jsx(PackingConfigDialog, { open: dialogOpen, onOpenChange: (o) => {
                     setDialogOpen(o);
                     if (!o)
@@ -1628,6 +2098,7 @@ function PackingConfigDialog({ open, onOpenChange, initial, isFirst, packagingTy
         isCustomerSpecific: false,
         customerOrganizationIds: [],
         isPrimary: isFirst,
+        isHiddenForDirectSales: false,
     });
     const [draft, setDraft] = useState(emptyItem);
     const [pkgSearch, setPkgSearch] = useState("");
@@ -1657,8 +2128,16 @@ function PackingConfigDialog({ open, onOpenChange, initial, isFirst, packagingTy
             ? draft.customerOrganizationIds.filter((x) => x !== id)
             : [...draft.customerOrganizationIds, id]);
     };
+    const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+    const materialIsUuid = UUID_RE.test((draft.packagingMaterialId ?? "").trim());
+    const supplierIsUuid = UUID_RE.test((draft.packagingSupplierId ?? "").trim());
+    const hasCustomPkg = draft.source === "SUPPLIER" && materialIsUuid;
+    const materialInvalid = draft.source === "SUPPLIER" &&
+        !!(draft.packagingMaterialId ?? "").trim() &&
+        !materialIsUuid;
     const canSave = draft.loadCarrier.length > 0 &&
-        draft.packagingType.length > 0 &&
+        (hasCustomPkg || draft.packagingType.length > 0) &&
+        !materialInvalid &&
         (draft.source === "VBN" || Boolean(draft.packagingSupplierId)) &&
         (!draft.isCustomerSpecific || draft.customerOrganizationIds.length > 0);
     const onUploadPhoto = async (file) => {
@@ -1695,14 +2174,22 @@ function PackingConfigDialog({ open, onOpenChange, initial, isFirst, packagingTy
                                                 ? "border-primary bg-primary/5"
                                                 : "hover:border-primary/40"}`, children: [_jsx("div", { className: "font-medium", children: "VBN fust" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Standaard veilingfust uit de VBN codelijst." })] }), _jsxs("button", { type: "button", onClick: () => setDraft((d) => ({ ...d, source: "SUPPLIER" })), className: `flex-1 rounded-md border px-3 py-2 text-sm text-left ${draft.source === "SUPPLIER"
                                                 ? "border-primary bg-primary/5"
-                                                : "hover:border-primary/40"}`, children: [_jsx("div", { className: "font-medium", children: "Verpakkingsleverancier" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Aangesloten leverancier (Modiform, Paardekooper, \u2026)." })] })] })] }), draft.source === "SUPPLIER" && (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Verpakkingsleverancier" }), _jsxs(Select, { value: draft.packagingSupplierId || undefined, onValueChange: (v) => {
-                                                const sup = PACKAGING_SUPPLIERS.find((s) => s.id === v);
-                                                setDraft((d) => ({
-                                                    ...d,
-                                                    packagingSupplierId: v,
-                                                    packagingSupplierName: sup?.name,
-                                                }));
-                                            }, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies leverancier..." }) }), _jsx(SelectContent, { children: PACKAGING_SUPPLIERS.map((s) => (_jsx(SelectItem, { value: s.id, children: s.name }, s.id))) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Materiaal-ID (optioneel)" }), _jsx(Input, { value: draft.packagingMaterialId ?? "", onChange: (e) => patch("packagingMaterialId", e.target.value), placeholder: "Referentie van de leverancier" })] })] })), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: draft.source === "SUPPLIER" ? "Fallback VBN-fust" : "Fusttype" }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", className: "w-full justify-between", children: [_jsx("span", { className: "truncate", children: draft.packagingType
+                                                : "hover:border-primary/40"}`, children: [_jsx("div", { className: "font-medium", children: "Verpakkingsleverancier" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Aangesloten leverancier (Modiform, Paardekooper, \u2026)." })] })] })] }), draft.source === "SUPPLIER" && (_jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Verpakkingsleverancier" }), supplierIsUuid ? (_jsxs("div", { className: "rounded-md border bg-muted/40 px-3 py-2 text-sm", children: [_jsx("div", { className: "font-medium", children: draft.packagingSupplierName ?? "Gekoppelde leverancier" }), _jsxs("div", { className: "mt-1 flex items-center gap-2 text-xs text-muted-foreground", children: [_jsx("span", { className: "font-mono truncate", children: draft.packagingSupplierId }), _jsx("button", { type: "button", className: "text-primary underline", onClick: () => setDraft((d) => ({
+                                                                        ...d,
+                                                                        packagingSupplierId: undefined,
+                                                                        packagingSupplierName: undefined,
+                                                                    })), children: "Wijzig" })] })] })) : (_jsxs(Select, { value: draft.packagingSupplierId || undefined, onValueChange: (v) => {
+                                                        const sup = PACKAGING_SUPPLIERS.find((s) => s.id === v);
+                                                        setDraft((d) => ({
+                                                            ...d,
+                                                            packagingSupplierId: v,
+                                                            packagingSupplierName: sup?.name,
+                                                        }));
+                                                    }, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies leverancier..." }) }), _jsx(SelectContent, { children: PACKAGING_SUPPLIERS.map((s) => (_jsx(SelectItem, { value: s.id, children: s.name }, s.id))) })] }))] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Floricode VRS-materiaal UUID (optioneel)" }), _jsx(Input, { value: draft.packagingMaterialId ?? "", onChange: (e) => patch("packagingMaterialId", e.target.value.trim()), placeholder: "00000000-0000-0000-0000-000000000000", className: materialInvalid ? "border-destructive" : "" }), materialInvalid ? (_jsx("p", { className: "text-xs text-destructive", children: "Ongeldig UUID-formaat. Laat leeg of plak een echte VRS-materiaal UUID uit Floricode." })) : (_jsxs("p", { className: "text-xs text-muted-foreground", children: ["Wanneer ingevuld gaat het als ", _jsx("code", { children: "customPackageId" }), "naar Floriday en vervangt het de VBN-fust."] }))] })] }), hasCustomPkg && (_jsx("div", { className: "rounded-md border border-primary/30 bg-primary/5 px-3 py-2 text-xs", children: "Custom package actief \u2014 VBN-fust hieronder wordt genegeerd in de Floriday-payload." }))] })), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: hasCustomPkg
+                                                ? "VBN-fust (genegeerd — custom package actief)"
+                                                : draft.source === "SUPPLIER"
+                                                    ? "Fallback VBN-fust"
+                                                    : "Fusttype" }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", className: "w-full justify-between", children: [_jsx("span", { className: "truncate", children: draft.packagingType
                                                                     ? (packagingTypes.find((r) => codeOf(r) === draft.packagingType)
                                                                         ? `${labelOf(packagingTypes.find((r) => codeOf(r) === draft.packagingType))} (${draft.packagingType})`
                                                                         : draft.packagingType)
@@ -1714,7 +2201,7 @@ function PackingConfigDialog({ open, onOpenChange, initial, isFirst, packagingTy
                                                 photoUrl: undefined,
                                                 photoImageId: undefined,
                                                 photoPreviewUrl: undefined,
-                                            })), className: "absolute top-1 right-1 rounded-full bg-background/80 p-1", children: _jsx(X, { className: "h-3 w-3" }) })] }))] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { type: "checkbox", checked: Boolean(draft.isPrimary), onChange: (e) => patch("isPrimary", e.target.checked) }), "Als primaire belading gebruiken"] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Annuleren" }), _jsx(Button, { type: "button", disabled: !canSave, onClick: () => onSave(draft), children: "Opslaan" })] })] }) }));
+                                            })), className: "absolute top-1 right-1 rounded-full bg-background/80 p-1", children: _jsx(X, { className: "h-3 w-3" }) })] }))] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { type: "checkbox", checked: Boolean(draft.isPrimary), onChange: (e) => patch("isPrimary", e.target.checked) }), "Als primaire belading gebruiken"] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { type: "checkbox", checked: Boolean(draft.isHiddenForDirectSales), onChange: (e) => patch("isHiddenForDirectSales", e.target.checked) }), "Verbergen voor Direct Sale (isHiddenForDirectSales)"] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Annuleren" }), _jsx(Button, { type: "button", disabled: !canSave, onClick: () => onSave(draft), children: "Opslaan" })] })] }) }));
 }
 function StepVerpakking({ data, update }) {
     const [dialogOpen, setDialogOpen] = useState(false);
@@ -1723,14 +2210,14 @@ function StepVerpakking({ data, update }) {
     return (_jsxs("div", { className: "space-y-3", children: [_jsxs("p", { className: "text-xs text-muted-foreground bg-muted/40 rounded-md p-2 border", children: ["Voeg extra verpakkingsmateriaal (hoes, steker, label, potfolie, \u2026) uit de VRS-catalogus toe. Materialen met een geldige Floriday-UUID worden automatisch meegestuurd naar Floriday als", _jsx("code", { className: "mx-1", children: "additionalPackagingMaterialIds" }), "op het TradeItem."] }), data.additionalPackaging.length > 0 && (_jsx("div", { className: "border rounded-md divide-y", children: data.additionalPackaging.map((p) => (_jsxs("div", { className: "grid grid-cols-[1fr_1fr_1fr_auto] gap-3 items-center px-3 py-2 text-sm", children: [_jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: "Leverancier" }), _jsx("div", { children: p.packagingSupplierName })] }), _jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: "Type" }), _jsx("div", { children: p.materialTypeName })] }), _jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: "Materiaal" }), _jsx("div", { children: p.packagingMaterialName })] }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => remove(p.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, p.id))) })), _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setDialogOpen(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "Verpakkingsmateriaal toevoegen"] }), _jsx(AdditionalPackagingDialog, { open: dialogOpen, onOpenChange: setDialogOpen, onSave: addItem })] }));
 }
 function StepBeschikbaarheid({ data, update }) {
-    const weeks = Array.from({ length: 52 }, (_, i) => i + 1);
+    const weeks = Array.from({ length: 53 }, (_, i) => i + 1);
     // Drag-selectie: bij mousedown bepalen we of we in "select"- of "deselect"-
     // modus zitten (op basis van de startcel) en breiden we de selectie uit
     // terwijl de gebruiker over de weken sleept, zoals in Floriday.
     const dragStateRef = useRef(null);
     const [dragHover, setDragHover] = useState(null);
     const setSelection = (list) => {
-        const unique = Array.from(new Set(list.filter((w) => w >= 1 && w <= 52)))
+        const unique = Array.from(new Set(list.filter((w) => w >= 1 && w <= 53)))
             .sort((a, b) => a - b);
         update("weeks", unique);
     };
@@ -1836,7 +2323,14 @@ function StepBeschikbaarheid({ data, update }) {
         pointerXRef.current = e.clientX;
         startAutoScrollLoop();
     };
-    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx("button", { type: "button", onClick: () => update("yearRound", true), className: `rounded-md border px-3 py-1.5 text-sm ${data.yearRound ? "border-primary bg-primary/5" : "hover:border-primary/40"}`, children: "Jaarrond" }), _jsx("button", { type: "button", onClick: () => update("yearRound", false), className: `rounded-md border px-3 py-1.5 text-sm ${!data.yearRound ? "border-primary bg-primary/5" : "hover:border-primary/40"}`, children: "Specifieke periode" })] }), !data.yearRound && (_jsxs("div", { children: [_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [_jsx(Label, { className: "shrink-0", children: "Selecteer weken" }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("span", { className: "text-xs text-muted-foreground", children: ["Sleep om meerdere weken te selecteren", data.weeks.length > 0 && ` — ${data.weeks.length} week/weken`] }), _jsx("button", { type: "button", onClick: () => setSelection([]), disabled: data.weeks.length === 0, className: "rounded-md border px-2.5 py-1 text-xs text-destructive hover:border-destructive/40 hover:bg-destructive/5 disabled:cursor-not-allowed disabled:opacity-40", children: "Selectie leegmaken" })] })] }), _jsx("div", { ref: scrollRef, className: "overflow-x-auto pb-2", children: _jsx("div", { className: "flex select-none gap-1 min-w-max", children: weeks.map((w) => {
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx("div", { className: "flex flex-wrap gap-2", children: [
+                    { value: "YEAR_ROUND", label: "Jaarrond" },
+                    { value: "SPECIFIC", label: "Specifieke periode" },
+                    { value: "UNSPECIFIED", label: "Niet gespecificeerd" },
+                ].map((opt) => {
+                    const active = data.availabilityMode === opt.value;
+                    return (_jsx("button", { type: "button", onClick: () => update("availabilityMode", opt.value), className: `rounded-md border px-3 py-1.5 text-sm ${active ? "border-primary bg-primary/5" : "hover:border-primary/40"}`, children: opt.label }, opt.value));
+                }) }), data.availabilityMode === "SPECIFIC" && (_jsxs("div", { children: [_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [_jsx(Label, { className: "shrink-0", children: "Selecteer weken" }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("span", { className: "text-xs text-muted-foreground", children: ["Sleep om meerdere weken te selecteren", data.weeks.length > 0 && ` — ${data.weeks.length} week/weken`] }), _jsx("button", { type: "button", onClick: () => setSelection([]), disabled: data.weeks.length === 0, className: "rounded-md border px-2.5 py-1 text-xs text-destructive hover:border-destructive/40 hover:bg-destructive/5 disabled:cursor-not-allowed disabled:opacity-40", children: "Selectie leegmaken" })] })] }), _jsx("div", { ref: scrollRef, className: "overflow-x-auto pb-2", children: _jsx("div", { className: "flex select-none gap-1 min-w-max", children: weeks.map((w) => {
                                 const selected = data.weeks.includes(w);
                                 const isHover = dragHover === w;
                                 return (_jsx("button", { type: "button", "data-week": w, onMouseDown: (e) => onWeekMouseDownWithScroll(w, e), onMouseEnter: () => onWeekMouseEnter(w), className: `h-9 w-11 shrink-0 rounded border text-xs transition-colors ${selected
@@ -1847,18 +2341,56 @@ function StepBeschikbaarheid({ data, update }) {
 // ------------------------------------------------------------
 // Stap "Aanbieden & voorraad" — Direct Sale via CustomerOffer
 // ------------------------------------------------------------
-function StepAanbieden({ data, update }) {
+function StepAanbieden({ data, update, priceGroups }) {
     const priceStr = Number.isFinite(data.salePricePerPiece)
         ? String(data.salePricePerPiece)
         : "";
     const stockStr = Number.isFinite(data.saleStockPieces)
         ? String(data.saleStockPieces)
         : "";
-    return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "rounded-md border bg-muted/30 p-3 text-sm text-muted-foreground", children: ["Zet dit product direct in de verkoop bij je gekoppelde Floriday-klanten. We sturen een ", _jsx("code", { children: "TradeItem" }), " + ", _jsx("code", { children: "CustomerOffer" }), " met vaste prijs per stuk en publiceren de opgegeven voorraad via de continuous-stock feed."] }), _jsxs("div", { className: "flex items-center justify-between rounded-md border p-3", children: [_jsxs("div", { children: [_jsx("div", { className: "text-sm font-medium", children: "Direct aanbieden voor verkoop" }), _jsx("div", { className: "text-xs text-muted-foreground", children: data.offerForSale
+    const setGroupPrice = (groupId, raw) => {
+        const next = { ...(data.priceGroupPrices ?? {}) };
+        const parsed = Number(raw);
+        if (!raw || !Number.isFinite(parsed) || parsed <= 0) {
+            delete next[groupId];
+        }
+        else {
+            next[groupId] = parsed;
+        }
+        update("priceGroupPrices", next);
+    };
+    return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "rounded-md border bg-muted/30 p-3 text-sm text-muted-foreground", children: ["Zet dit product direct in de verkoop bij je gekoppelde Floriday-klanten. We sturen een ", _jsx("code", { children: "TradeItem" }), " + ", _jsx("code", { children: "CustomerOffer" }), " met vaste basisprijs per stuk en publiceren de opgegeven voorraad via de continuous-stock feed. Prijzen per prijsgroep worden als aparte", " ", _jsx("code", { children: "weekly-supply-lines" }), " naar Floriday gepusht."] }), _jsxs("div", { className: "flex items-center justify-between rounded-md border p-3", children: [_jsxs("div", { children: [_jsx("div", { className: "text-sm font-medium", children: "Direct aanbieden voor verkoop" }), _jsx("div", { className: "text-xs text-muted-foreground", children: data.offerForSale
                                     ? "Aanbod wordt aangemaakt direct na publiceren."
-                                    : "Alleen artikel publiceren, geen aanbod aanmaken." })] }), _jsx(Switch, { checked: data.offerForSale, onCheckedChange: (v) => update("offerForSale", Boolean(v)) })] }), data.offerForSale && (_jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Voorraad (stuks)" }), _jsx(Input, { type: "number", inputMode: "numeric", min: 0, step: 1, value: stockStr, onChange: (e) => update("saleStockPieces", Math.max(0, Math.floor(Number(e.target.value) || 0))) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Wordt als fysieke voorraad geboekt en via continuous-stock naar Floriday gepusht." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Verkoopprijs per stuk (EUR)" }), _jsx(Input, { type: "number", inputMode: "decimal", min: 0, step: "0.01", value: priceStr, onChange: (e) => update("salePricePerPiece", Number(e.target.value) || 0) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Vaste prijs per stuk voor Direct Sale." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Aanbod geldig vanaf" }), _jsx(Input, { type: "date", value: data.offerStartDate, onChange: (e) => update("offerStartDate", e.target.value) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Aanbod loopt automatisch tot 1 jaar na deze datum." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Zichtbaar voor" }), _jsx("div", { className: "rounded-md border bg-muted/20 px-3 py-2 text-sm", children: data.customerOrganizationIds.length
-                                    ? `${data.customerOrganizationIds.length} geselecteerde klant(en)`
-                                    : "Alle gekoppelde Floriday-klanten" }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Klantselectie beheer je in de stap ", _jsx("em", { children: "Klanten" }), "."] })] })] }))] }));
+                                    : "Alleen artikel publiceren, geen aanbod aanmaken." })] }), _jsx(Switch, { checked: data.offerForSale, onCheckedChange: (v) => update("offerForSale", Boolean(v)) })] }), data.offerForSale && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Voorraad (stuks)" }), _jsx(Input, { type: "number", inputMode: "numeric", min: 0, step: 1, value: stockStr, onChange: (e) => update("saleStockPieces", Math.max(0, Math.floor(Number(e.target.value) || 0))) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Wordt als fysieke voorraad geboekt en via continuous-stock naar Floriday gepusht." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Basisprijs per stuk (EUR)" }), _jsx(Input, { type: "number", inputMode: "decimal", min: 0, step: "0.01", value: priceStr, onChange: (e) => update("salePricePerPiece", Number(e.target.value) || 0) }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Wordt gepusht als ", _jsx("code", { children: "weekly-base-supply" }), " \u2014 de standaard catalogusprijs voor klanten zonder eigen prijsgroep."] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Aanbod geldig vanaf" }), _jsx(Input, { type: "date", value: data.offerStartDate, onChange: (e) => update("offerStartDate", e.target.value) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Aanbod loopt automatisch tot 1 jaar na deze datum." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Zichtbaar voor" }), _jsx("div", { className: "rounded-md border bg-muted/20 px-3 py-2 text-sm", children: data.customerOrganizationIds.length
+                                            ? `${data.customerOrganizationIds.length} geselecteerde klant(en)`
+                                            : "Alle gekoppelde Floriday-klanten" }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Klantselectie beheer je in de stap ", _jsx("em", { children: "Klanten" }), "."] })] })] }), _jsxs("div", { className: "space-y-2 rounded-md border p-4", children: [_jsxs("div", { className: "flex items-baseline justify-between", children: [_jsxs("div", { children: [_jsx("div", { className: "text-sm font-medium", children: "Prijzen per Floriday-prijsgroep" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Laat leeg om voor die groep g\u00E9\u00E9n afwijkende prijs te publiceren. Basisprijs blijft dan gelden." })] }), _jsxs("div", { className: "text-xs text-muted-foreground", children: [priceGroups.length, " groep", priceGroups.length === 1 ? "" : "en"] })] }), priceGroups.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground py-4", children: "Geen actieve prijsgroepen gevonden voor deze Floriday-connectie." })) : (_jsx("div", { className: "grid gap-3 sm:grid-cols-2 pt-2", children: priceGroups.map((g) => {
+                                    const val = data.priceGroupPrices?.[g.id];
+                                    return (_jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "text-sm", children: [g.name, _jsxs("span", { className: "ml-2 text-xs font-normal text-muted-foreground", children: [g.customerOrganizationIds.length, " klant", g.customerOrganizationIds.length === 1 ? "" : "en"] })] }), _jsx(Input, { type: "number", inputMode: "decimal", min: 0, step: "0.01", placeholder: "\u20AC", value: val ? String(val) : "", onChange: (e) => setGroupPrice(g.id, e.target.value) })] }, g.id));
+                                }) }))] })] })), _jsx(VatSection, { data: data, update: update })] }));
+}
+// ------------------------------------------------------------
+// BTW-blok (facturatie) — lokaal, niet naar Floriday
+// ------------------------------------------------------------
+const TWINFIELD_VAT_OPTIONS = [
+    { code: "VH", label: "VH – Hoog (21%)", rate: 21 },
+    { code: "VL", label: "VL – Laag (9%)", rate: 9 },
+    { code: "VN", label: "VN – Nul (0%)", rate: 0 },
+    { code: "VG", label: "VG – Geen / vrijgesteld", rate: 0 },
+];
+function VatSection({ data, update }) {
+    const code = data.vatCode ?? "";
+    const onCodeChange = (next) => {
+        if (next === "__default__") {
+            update("vatCode", null);
+            update("vatRate", null);
+            return;
+        }
+        update("vatCode", next);
+        const match = TWINFIELD_VAT_OPTIONS.find((o) => o.code === next);
+        if (match)
+            update("vatRate", match.rate);
+    };
+    return (_jsxs("div", { className: "space-y-3 rounded-md border p-4", children: [_jsxs("div", { children: [_jsx("div", { className: "text-sm font-medium", children: "BTW (facturatie)" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Wordt gebruikt bij het maken van facturen. Leeg = standaardwaarde uit de instellingen (default 9% / VL)." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "BTW-tarief (%)" }), _jsxs(Select, { value: code || "__default__", onValueChange: onCodeChange, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "__default__", children: "Standaard (VL \u2013 9%)" }), TWINFIELD_VAT_OPTIONS.map((o) => (_jsx(SelectItem, { value: o.code, children: o.label }, o.code)))] })] })] })] }));
 }
 // ============================================================
 // Shared