@flowselections/floriday-voorraad 1.0.22 → 1.0.26

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

@@ -2,26 +2,34 @@ 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;
 const LOAD_CARRIER_LABELS = {
@@ -70,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);
@@ -85,10 +106,76 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
     const [productLoading, setProductLoading] = useState(Boolean(productId));
     const [syncState, setSyncState] = useState("idle");
     const [syncError, setSyncError] = useState(null);
+    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;
@@ -138,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 });
@@ -151,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;
@@ -162,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)
@@ -180,45 +275,160 @@ 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: [],
-                            },
-                        ]
-                        : [];
+                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 }]
+                            : [];
+                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
+                        .from("trade_item_stock")
+                        .select("physical_stock")
+                        .eq("trade_item_key", `product:${product.id}`)
+                        .maybeSingle();
+                    physical = Number(stockRow?.physical_stock ?? 0);
+                }
+                catch { /* stock niet gevonden = 0 */ }
                 setData({
                     ...empty,
                     ...payload,
-                    name: product.product ?? payload.name ?? "",
-                    articleCode: String(product.article_number ?? payload.articleCode ?? "").trim(),
-                    gtin: validGtin ? barcode : (payload.gtin ?? ""),
+                    // 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,
-                    saleStockPieces: Number(product.quantity ?? payload.saleStockPieces) || 0,
-                    images: Array.isArray(payload.images) && payload.images.length > 0
-                        ? payload.images
-                        : imageUrl
-                            ? [{ url: imageUrl, name: product.product ?? undefined, primary: true }]
-                            : [],
+                    // 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((product.floriday_trade_item_id ?? null));
+                setDraftFloridayId(fid);
+                setProductMeta({
+                    floridayActive: fActive,
+                    floridayTradeItemId: fid,
+                    physicalStock: physical,
+                });
             }
             catch (e) {
                 if (!cancelled)
@@ -232,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)
@@ -264,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);
             }
@@ -282,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([]);
@@ -326,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).
@@ -350,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)
@@ -359,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) => {
@@ -379,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) {
@@ -536,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);
@@ -563,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,
+                                    });
+                                }
                             }
                         }
                     }
@@ -635,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");
@@ -655,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 {
@@ -720,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;
@@ -730,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;
         }
@@ -744,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);
@@ -808,7 +1248,15 @@ 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, { children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "text-destructive hover:text-destructive", children: [_jsx(Trash2, { className: "mr-2 h-4 w-4" }), "Verwijderen"] }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Product verwijderen?" }), _jsx(AlertDialogDescription, { children: "Dit product wordt permanent uit de voorraad verwijderd. Als het product actief op Floriday staat moet je het daar apart deactiveren." })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { onClick: handleDeleteDraft, children: "Verwijderen" })] })] })] }))] }), isEditing && (data.name || data.vbnName) && (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: "Artikel" }), _jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [_jsx("h1", { className: "text-2xl font-semibold leading-tight", children: data.name || data.vbnName }), (isEditingPublished || draftFloridayId) ? (syncState === "saving" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), " Synchroniseren\u2026"] })) : syncState === "saved" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-emerald-100 text-emerald-700", children: [_jsx(Check, { className: "h-3 w-3" }), " Gesynchroniseerd"] })) : syncState === "error" ? (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-red-100 text-red-700", title: syncError ?? undefined, children: "Sync mislukt \u2014 klik Opslaan om opnieuw te proberen" })) : null) : (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: "Nog niet gepubliceerd naar Floriday" })), _jsx(PriceStatusBadge, { tradeItemId: tradeItemId ?? draftFloridayId ?? null, offerForSale: data.offerForSale })] }), data.name && data.vbnName && data.name !== data.vbnName && (_jsx("div", { className: "text-sm text-muted-foreground", children: data.vbnName }))] })), isEditing && (_jsx(Card, { className: "p-4 bg-muted/30 flex items-center gap-3 text-sm", children: isEditingPublished ? (_jsxs(_Fragment, { children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-6 w-6 shrink-0" }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Gepubliceerd artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Wijzigingen worden direct naar Floriday verstuurd. Je kunt vrij tussen alle secties navigeren." })] }), _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" })), "Wijzigingen opslaan"] })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Lokaal artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Niet gepubliceerd. Je kunt vrij tussen alle secties navigeren." })] }), _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" })), publishToFloriday ? "Publiceren naar Floriday" : "Wijzigingen opslaan"] })] })) })), isEditing && (_jsxs(_Fragment, { children: [_jsx(ArtikelCompositionCard, { productId: linkedProductId, floridayId: tradeItemId ?? draftFloridayId ?? null }), _jsx(VoorraadStockCard, { connectionId: activeId, tradeItemId: tradeItemId ?? null, draftId: draftId ?? null, productId: linkedProductId }), _jsx(OrderHistoryCard, { tradeItemKey: localTradeItemKey, productName: data.name || data.vbnName || null, productId: linkedProductId ?? null }), _jsx(ProductLinkCard, { tradeItemKey: localTradeItemKey, productName: data.vbnName || null })] })), _jsx("ol", { className: "space-y-3", children: steps.map((s, i) => {
+    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);
+                        }, children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "text-destructive hover:text-destructive", children: [_jsx(Trash2, { className: "mr-2 h-4 w-4" }), "Verwijderen"] }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Product verwijderen?" }), _jsx(AlertDialogDescription, { asChild: true, children: _jsxs("div", { className: "space-y-3 text-sm", children: [_jsxs("div", { children: ["Je staat op het punt om ", _jsx("strong", { children: data.name || "dit artikel" }), data.articleCode ? _jsxs(_Fragment, { children: [" (artikelnummer ", _jsx("code", { children: data.articleCode }), ")"] }) : null, " ", "lokaal uit de voorraad te verwijderen."] }), _jsxs("div", { className: "rounded-md border p-3 bg-muted/40 space-y-1", children: [_jsxs("div", { children: ["Huidige voorraad: ", _jsx("strong", { children: productMeta.physicalStock }), " stuks"] }), _jsxs("div", { children: ["Floriday-koppeling:", " ", productMeta.floridayActive || productMeta.floridayTradeItemId ? (_jsx("span", { className: "text-emerald-700 font-medium", children: "actief" })) : (_jsx("span", { className: "text-muted-foreground", children: "geen" }))] })] }), (productMeta.floridayActive || productMeta.floridayTradeItemId) && (_jsxs("div", { className: "rounded-md border border-amber-300 bg-amber-50 p-3 text-amber-900", children: [_jsx("strong", { children: "Let op:" }), " dit artikel is gekoppeld met Floriday. Als je alleen de lokale kant verwijdert, blijft het artikel op Floriday bestaan en verschijnt het bij de volgende sync weer terug in de lijst. Trek het artikel daarna zelf in via het Floriday-portaal als je het echt weg wilt."] })), productMeta.physicalStock > 0 && (_jsxs("div", { className: "rounded-md border border-rose-300 bg-rose-50 p-3 text-rose-900", children: ["Er staat nog voorraad (", productMeta.physicalStock, " stuks) op dit product. Deze voorraad wordt \u00F3\u00F3k verwijderd en kan niet automatisch worden hersteld."] })), _jsxs("label", { className: "flex items-start gap-2 pt-1", children: [_jsx(Checkbox, { checked: deleteAck, onCheckedChange: (v) => setDeleteAck(Boolean(v)) }), _jsx("span", { children: "Ik weet zeker dat ik dit product wil verwijderen en begrijp de gevolgen." })] })] }) })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { disabled: !deleteAck, onClick: handleDeleteDraft, className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: "Definitief verwijderen" })] })] })] }))] }), isEditing && (data.name || data.vbnName) && (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: "Artikel" }), _jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [_jsx("h1", { className: "text-2xl font-semibold leading-tight", children: data.name || data.vbnName }), (isEditingPublished || draftFloridayId) ? (syncState === "saving" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), " Synchroniseren\u2026"] })) : syncState === "saved" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-emerald-100 text-emerald-700", children: [_jsx(Check, { className: "h-3 w-3" }), " Gesynchroniseerd"] })) : syncState === "error" ? (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-red-100 text-red-700", title: syncError ?? undefined, children: "Sync mislukt \u2014 klik Opslaan om opnieuw te proberen" })) : null) : (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: "Nog niet gepubliceerd naar Floriday" })), _jsx(PriceStatusBadge, { tradeItemId: tradeItemId ?? draftFloridayId ?? null, offerForSale: data.offerForSale })] }), data.name && data.vbnName && data.name !== data.vbnName && (_jsx("div", { className: "text-sm text-muted-foreground", children: data.vbnName }))] })), isEditing && (_jsx(Card, { className: "p-4 bg-muted/30 flex items-center gap-3 text-sm", children: isEditingPublished ? (_jsxs(_Fragment, { children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-6 w-6 shrink-0" }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Gepubliceerd artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Wijzigingen worden direct naar Floriday verstuurd. Je kunt vrij tussen alle secties navigeren." })] }), _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" })), "Wijzigingen opslaan"] })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Lokaal artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Niet gepubliceerd. Je kunt vrij tussen alle secties navigeren." })] }), _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" })), publishToFloriday ? "Publiceren naar Floriday" : "Wijzigingen opslaan"] })] })) })), isEditing && (_jsxs(_Fragment, { children: [_jsx(ArtikelCompositionCard, { productId: linkedProductId, floridayId: tradeItemId ?? draftFloridayId ?? null }), _jsx(FloridayInfoCard, { floridayTradeItemId: tradeItemId ?? draftFloridayId ?? null, local: {
+                            name: data.name || data.vbnName,
+                            articleNumber: data.articleCode,
+                            gtin: data.gtin,
+                        } }), _jsx(VoorraadStockCard, { connectionId: activeId, tradeItemId: tradeItemId ?? null, draftId: draftId ?? null, productId: linkedProductId }), _jsx(OrderHistoryCard, { tradeItemKey: localTradeItemKey, productName: data.name || data.vbnName || null, productId: linkedProductId ?? null }), _jsx(ProductLinkCard, { tradeItemKey: localTradeItemKey, productName: data.vbnName || null })] })), _jsx("ol", { className: "space-y-3", children: steps.map((s, i) => {
                     const isOpen = i === step;
                     const isValid = stepValidity[i];
                     const isVisited = i < step || isEditing;
@@ -830,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"
@@ -885,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";
@@ -920,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":
@@ -955,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;
     }
@@ -1056,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);
@@ -1092,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) => {
@@ -1122,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;
@@ -1144,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
@@ -1207,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) {
@@ -1265,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;
@@ -1291,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)))) })] })] }) })] }));
@@ -1472,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.
@@ -1571,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)
@@ -1598,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("");
@@ -1627,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) => {
@@ -1665,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)
@@ -1684,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);
@@ -1693,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);
     };
@@ -1806,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
@@ -1817,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