@flowselections/layout-maker 1.13.2 → 1.20.0

package/dist-lib/components/AfdrukKnop.d.ts

@@ -11,5 +11,10 @@ export interface AfdrukKnopProps {
     layoutId?: string | null;
     kopieen?: number;
 }
+/**
+ * @deprecated Verouderd — deze knop gebruikt het browser-printvenster als
+ * terugval. Gebruik `printHtml()` / `printPdf()` uit `printApi` zodat alles
+ * via PrintNode loopt.
+ */
 export declare function AfdrukKnop({ documenttype, formaatCode, orientatie, getHtml, css, documentnaam, label, layoutId, kopieen, }: AfdrukKnopProps): import("react").JSX.Element;
 //# sourceMappingURL=AfdrukKnop.d.ts.map

package/dist-lib/components/AfdrukKnop.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AfdrukKnop.d.ts","sourceRoot":"","sources":["../../src/components/AfdrukKnop.tsx"],"names":[],"mappings":"AASA,OAAO,EAAU,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAG9D,MAAM,WAAW,eAAe;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,UAAU,EAAE,UAAU,CAAC;IACvB,uEAAuE;IACvE,OAAO,EAAE,MAAM,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,wBAAgB,UAAU,CAAC,EACzB,YAAY,EACZ,WAAW,EACX,UAAU,EACV,OAAO,EACP,GAAG,EACH,YAAY,EACZ,KAAmB,EACnB,QAAQ,EACR,OAAO,GACR,EAAE,eAAe,+BAwDjB"}
+{"version":3,"file":"AfdrukKnop.d.ts","sourceRoot":"","sources":["../../src/components/AfdrukKnop.tsx"],"names":[],"mappings":"AASA,OAAO,EAAU,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAG9D,MAAM,WAAW,eAAe;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,UAAU,EAAE,UAAU,CAAC;IACvB,uEAAuE;IACvE,OAAO,EAAE,MAAM,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EACzB,YAAY,EACZ,WAAW,EACX,UAAU,EACV,OAAO,EACP,GAAG,EACH,YAAY,EACZ,KAAmB,EACnB,QAAQ,EACR,OAAO,GACR,EAAE,eAAe,+BAwDjB"}

package/dist-lib/components/AfdrukKnop.js

@@ -9,6 +9,11 @@ import { Button, toast } from "@flowselections/core";
 import { Loader2, Printer } from "lucide-react";
 import { drukAf } from "../lib/browserPrint.js";
 import { printDirect } from "../lib/directPrint.js";
+/**
+ * @deprecated Verouderd — deze knop gebruikt het browser-printvenster als
+ * terugval. Gebruik `printHtml()` / `printPdf()` uit `printApi` zodat alles
+ * via PrintNode loopt.
+ */
 export function AfdrukKnop({ documenttype, formaatCode, orientatie, getHtml, css, documentnaam, label = "Afdrukken", layoutId, kopieen, }) {
     const [bezig, setBezig] = useState(false);
     const afdrukken = async () => {

package/dist-lib/components/DocumentRouteringPage.d.ts

@@ -1,2 +1,4 @@
-export declare function DocumentRouteringPage(): import("react").JSX.Element;
+export declare function DocumentRouteringPage({ ingebed }?: {
+    ingebed?: boolean;
+}): import("react").JSX.Element;
 //# sourceMappingURL=DocumentRouteringPage.d.ts.map

package/dist-lib/components/DocumentRouteringPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DocumentRouteringPage.d.ts","sourceRoot":"","sources":["../../src/components/DocumentRouteringPage.tsx"],"names":[],"mappings":"AA2CA,wBAAgB,qBAAqB,gCAiTpC"}
+{"version":3,"file":"DocumentRouteringPage.d.ts","sourceRoot":"","sources":["../../src/components/DocumentRouteringPage.tsx"],"names":[],"mappings":"AAsCA,wBAAgB,qBAAqB,CAAC,EAAE,OAAe,EAAE,GAAE;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAO,+BAmVpF"}

package/dist-lib/components/DocumentRouteringPage.js

@@ -1,38 +1,41 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // ============================================================================
 // src/components/DocumentRouteringPage.tsx — overzicht: welke documentsoort
-// gaat via welke werkplek naar welke printer.
+// gaat standaard naar welke printer, en welk document daarvoor wordt gebruikt.
+// Afwijkingen per plek staan bij de printplek zelf.
 // ============================================================================
 import { useMemo, useState } from "react";
-import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
-import { Link } from "@tanstack/react-router";
-import { AlertTriangle, Monitor, Plus, Printer, Trash2 } from "lucide-react";
+import { Badge, Card, CardContent, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Separator, toast, } from "@flowselections/core";
+import { AlertTriangle, ChevronDown, ChevronRight } from "lucide-react";
 import { DOCUMENT_TYPES, documentTypeLabel, isFloridayLayout } from "../lib/documentTypes.js";
 import { documentProfiel } from "../lib/documentProfiles.js";
 import { usePrinters } from "../lib/useDocumentData.js";
 import { useAlleFormaatPrinters, zetFormaatPrinter } from "../lib/formaatPrinters.js";
-import { BRONNEN, HERKOMSTEN, useBronregels, zetBronregel, } from "../lib/documentBron.js";
+import { BRONNEN, HERKOMSTEN, useBronregels, zetBronregel } from "../lib/documentBron.js";
 import { useLayouts } from "../lib/useDocumentData.js";
-import { useWerkplekPrinters, verwijderWerkplekPrinter, zetWerkplekPrinter, } from "../lib/documentRoutering.js";
-import { useComputers } from "./ComputersLijst.js";
 const GEEN = "geen";
-export function DocumentRouteringPage() {
+/**
+ * Documentsoorten die de Logistiek Engine naar de wachtrij stuurt. Die kiest
+ * zelf geen printer meer, dus zonder standaardregel blijft zo'n opdracht
+ * liggen. Daarom staan ze altijd bovenaan met een waarschuwing.
+ */
+const ENGINE_TYPES = ["pakbon", "sticker", "transportdocument", "productiebon"];
+export function DocumentRouteringPage({ ingebed = false } = {}) {
     const { printers } = usePrinters();
-    const { computers } = useComputers();
     const { koppelingen: standaard, reload: herlaadStandaard } = useAlleFormaatPrinters();
-    const { koppelingen: werkplekken, reload: herlaadWerkplekken } = useWerkplekPrinters();
     const { regels, reload: herlaadRegels } = useBronregels();
     const { layouts } = useLayouts();
     const [zoek, setZoek] = useState("");
-    const [nieuw, setNieuw] = useState(null);
-    const [nieuweWerkplek, setNieuweWerkplek] = useState("");
-    const [nieuwePrinter, setNieuwePrinter] = useState(GEEN);
+    const [gekozen, setGekozen] = useState("pakbon");
+    const [toonRest, setToonRest] = useState(false);
+    const [toonUitleg, setToonUitleg] = useState(false);
+    const [toonGeavanceerd, setToonGeavanceerd] = useState(false);
     const printerNaam = (id) => printers.find((p) => p.id === id)?.naam ?? "Onbekende printer";
     const standaardFormaat = (type) => documentProfiel(type).formaten[0]?.code ?? "A4";
+    const actieveLayouts = (type) => layouts.filter((l) => l.documenttype === type && l.actief);
     /** Formaat zoals de gebruiker het ziet: dat van de actieve layouts zelf. */
     const weergaveFormaat = (type) => {
-        const eigen = Array.from(new Set(layouts
-            .filter((l) => l.documenttype === type && l.actief)
+        const eigen = Array.from(new Set(actieveLayouts(type)
             .map((l) => l.papierformaat)
             .filter((f) => !!f)));
         if (eigen.length === 1)
@@ -43,11 +46,26 @@ export function DocumentRouteringPage() {
     };
     const standaardVoor = (type) => standaard.find((k) => k.documenttype === type && k.formaat_code === standaardFormaat(type))
         ?.printer_id ?? null;
-    const werkplekkenVoor = (type) => werkplekken.filter((w) => w.documenttype === type);
-    const rijen = useMemo(() => {
-        const term = zoek.trim().toLowerCase();
-        return DOCUMENT_TYPES.filter((d) => (term ? d.label.toLowerCase().includes(term) : true));
-    }, [zoek]);
+    const bronVan = (type, herkomst) => regels.find((r) => r.documenttype === type && r.herkomst === herkomst);
+    /** In gebruik = er is een actieve layout of er is iets ingesteld. */
+    const inGebruik = (type) => actieveLayouts(type).length > 0 ||
+        !!standaardVoor(type) ||
+        regels.some((r) => r.documenttype === type && r.bron !== "auto");
+    const term = zoek.trim().toLowerCase();
+    const gefilterd = useMemo(() => DOCUMENT_TYPES.filter((d) => (term ? d.label.toLowerCase().includes(term) : true)), [term]);
+    const engine = gefilterd.filter((d) => ENGINE_TYPES.includes(d.value));
+    const overig = gefilterd.filter((d) => !ENGINE_TYPES.includes(d.value));
+    const actief = overig.filter((d) => inGebruik(d.value));
+    const rest = overig.filter((d) => !inGebruik(d.value));
+    const aantalIngesteld = DOCUMENT_TYPES.filter((d) => !!standaardVoor(d.value)).length;
+    const huidig = gekozen;
+    const std = standaardVoor(huidig);
+    const bronSamenvatting = HERKOMSTEN.map((h) => {
+        const r = bronVan(huidig, h.value);
+        if (!r || r.bron === "auto")
+            return null;
+        return `${h.label}: ${BRONNEN.find((b) => b.value === r.bron)?.label ?? r.bron}`;
+    }).filter((s) => !!s);
     const kiesStandaard = async (type, printerId) => {
         try {
             await zetFormaatPrinter(type, standaardFormaat(type), printerId === GEEN ? null : printerId);
@@ -58,24 +76,6 @@ export function DocumentRouteringPage() {
             toast.error("Opslaan mislukt");
         }
     };
-    const voegWerkplekToe = async (type) => {
-        if (!nieuweWerkplek.trim()) {
-            toast.error("Kies eerst een werkplek");
-            return;
-        }
-        try {
-            await zetWerkplekPrinter(type, nieuweWerkplek, nieuwePrinter === GEEN ? null : nieuwePrinter, standaardFormaat(type));
-            await herlaadWerkplekken();
-            setNieuw(null);
-            setNieuweWerkplek("");
-            setNieuwePrinter(GEEN);
-            toast.success("Werkplek gekoppeld");
-        }
-        catch {
-            toast.error("Opslaan mislukt");
-        }
-    };
-    const bronVan = (type, herkomst) => regels.find((r) => r.documenttype === type && r.herkomst === herkomst);
     const kiesBron = async (type, herkomst, bron, layoutId) => {
         try {
             await zetBronregel(type, herkomst, bron, layoutId ?? null);
@@ -86,30 +86,32 @@ export function DocumentRouteringPage() {
             toast.error("Opslaan mislukt");
         }
     };
-    const verwijder = async (id) => {
-        try {
-            await verwijderWerkplekPrinter(id);
-            await herlaadWerkplekken();
-            toast.success("Uitzondering verwijderd");
-        }
-        catch {
-            toast.error("Verwijderen mislukt");
-        }
+    const kies = (type) => {
+        setGekozen(type);
+        setToonGeavanceerd(false);
+    };
+    const LijstItem = ({ type, label }) => {
+        const printerId = standaardVoor(type);
+        const gekozenItem = huidig === type;
+        const engineType = ENGINE_TYPES.includes(type);
+        const geenLayout = actieveLayouts(type).length === 0;
+        const waarschuw = engineType
+            ? !printerId || geenLayout
+            : !printerId && actieveLayouts(type).length > 0;
+        const melding = !printerId
+            ? "Geen standaardprinter"
+            : geenLayout && engineType
+                ? "Geen actieve layout"
+                : printerNaam(printerId);
+        return (_jsxs("button", { type: "button", onClick: () => kies(type), className: `w-full rounded-md px-3 py-2 text-left transition-colors ${gekozenItem ? "bg-primary/10 text-primary" : "hover:bg-muted"}`, children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "min-w-0 flex-1 truncate text-sm font-medium", children: label }), waarschuw && _jsx(AlertTriangle, { className: "text-destructive h-3.5 w-3.5 shrink-0" })] }), _jsx("span", { className: `block truncate text-xs ${waarschuw ? "text-destructive" : "text-muted-foreground"}`, children: melding })] }));
     };
-    return (_jsxs("main", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Documentroutering" }), _jsx("p", { className: "text-muted-foreground text-sm", children: "Bepaal per documentsoort welke printer wordt gebruikt, en welke printer geldt op een specifieke werkplek." })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { className: "w-56", placeholder: "Zoek documentsoort", value: zoek, onChange: (e) => setZoek(e.target.value) }), _jsx(Button, { variant: "outline", asChild: true, children: _jsxs(Link, { to: "/layouts-printers/printers", children: [_jsx(Printer, { className: "mr-2 h-4 w-4" }), " Printers"] }) })] })] }), _jsx(Card, { children: _jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Keuzevolgorde" }), _jsx(CardDescription, { children: "1. printer die de module meestuurt \u00B7 2. uitzondering voor de werkplek \u00B7 3. printer gekoppeld aan het ontwerp \u00B7 4. standaardprinter hieronder \u00B7 5. is er maar \u00E9\u00E9n actieve printer, dan die \u00B7 6. anders blijft de opdracht wachten in de printwachtrij." })] }) }), _jsx("div", { className: "space-y-3", children: rijen.map((d) => {
-                    const uitzonderingen = werkplekkenVoor(d.value);
-                    const std = standaardVoor(d.value);
-                    const zonderPrinter = !std && uitzonderingen.length === 0;
-                    return (_jsxs(Card, { children: [_jsxs(CardContent, { className: "grid gap-4 py-4 lg:grid-cols-[220px_260px_1fr]", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "font-medium", children: documentTypeLabel(d.value) }), _jsx("p", { className: "text-muted-foreground text-xs", children: weergaveFormaat(d.value) }), zonderPrinter && (_jsxs("p", { className: "text-destructive mt-1 flex items-center gap-1 text-xs", children: [_jsx(AlertTriangle, { className: "h-3.5 w-3.5" }), " Geen printer ingesteld"] }))] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-xs uppercase", children: "Standaardprinter" }), _jsxs(Select, { value: std ?? GEEN, onValueChange: (v) => void kiesStandaard(d.value, v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Geen printer" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Geen printer" }), printers.map((p) => (_jsx(SelectItem, { value: p.id, children: p.naam }, p.id)))] })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-muted-foreground text-xs uppercase", children: "Per werkplek" }), uitzonderingen.map((w) => (_jsxs("div", { className: "flex items-center gap-2 text-sm", children: [_jsx(Monitor, { className: "text-muted-foreground h-4 w-4 shrink-0" }), _jsxs("span", { className: "min-w-0 flex-1 truncate", children: [w.werkplek, " \u2192 ", printerNaam(w.printer_id)] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => void verwijder(w.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, w.id))), nieuw === d.value ? (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsxs(Select, { value: nieuweWerkplek, onValueChange: setNieuweWerkplek, children: [_jsx(SelectTrigger, { className: "w-48", children: _jsx(SelectValue, { placeholder: "Kies werkplek" }) }), _jsx(SelectContent, { children: computers.map((c) => (_jsx(SelectItem, { value: c.naam, children: c.naam }, c.id))) })] }), _jsxs(Select, { value: nieuwePrinter, onValueChange: setNieuwePrinter, children: [_jsx(SelectTrigger, { className: "w-48", children: _jsx(SelectValue, { placeholder: "Kies printer" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Geen printer" }), printers.map((p) => (_jsx(SelectItem, { value: p.id, children: p.naam }, p.id)))] })] }), _jsx(Button, { size: "sm", onClick: () => void voegWerkplekToe(d.value), children: "Opslaan" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => setNieuw(null), children: "Annuleren" })] })) : (_jsxs(Button, { size: "sm", variant: "outline", onClick: () => {
-                                                    setNieuw(d.value);
-                                                    setNieuweWerkplek("");
-                                                    setNieuwePrinter(GEEN);
-                                                }, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Werkplek toevoegen"] }))] })] }), _jsxs(CardContent, { className: "border-t pt-4", children: [_jsx("p", { className: "text-muted-foreground mb-2 text-xs uppercase", children: "Bron per herkomst" }), _jsx("div", { className: "grid gap-2 sm:grid-cols-2", children: HERKOMSTEN.map((h) => {
-                                            const regel = bronVan(d.value, h.value);
-                                            const huidig = regel?.bron ?? "auto";
-                                            return (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "w-32 shrink-0 text-sm", children: h.label }), _jsxs(Select, { value: huidig, onValueChange: (v) => void kiesBron(d.value, h.value, v, regel?.layout_id ?? null), children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: BRONNEN.map((b) => (_jsx(SelectItem, { value: b.value, children: b.label }, b.value))) })] }), huidig === "eigen_layout" && (_jsxs(Select, { value: regel?.layout_id ?? GEEN, onValueChange: (v) => void kiesBron(d.value, h.value, "eigen_layout", v === GEEN ? null : v), children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, { placeholder: "Standaardontwerp" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Standaardontwerp" }), layouts
-                                                                        .filter((l) => l.documenttype === d.value)
-                                                                        .map((l) => (_jsxs(SelectItem, { value: l.id, children: [l.naam, isFloridayLayout(l) ? " (uit Floriday)" : ""] }, l.id)))] })] }))] }, h.value));
-                                        }) })] })] }, d.value));
-                }) })] }));
+    const Wrapper = ingebed ? "div" : "main";
+    return (_jsxs(Wrapper, { className: ingebed ? "space-y-5" : "space-y-5 p-6", children: [_jsxs("header", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("p", { className: "text-muted-foreground text-sm", children: [aantalIngesteld, " van ", DOCUMENT_TYPES.length, " documentsoorten hebben een standaardprinter. Deze geldt als er geen printplek is meegegeven."] }), _jsx(Input, { className: "w-full sm:w-56", placeholder: "Zoek documentsoort", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setToonUitleg((v) => !v), className: "text-muted-foreground hover:text-foreground flex items-center gap-1 text-sm", children: [toonUitleg ? (_jsx(ChevronDown, { className: "h-4 w-4" })) : (_jsx(ChevronRight, { className: "h-4 w-4" })), "Hoe wordt de printer gekozen?"] }), toonUitleg && (_jsx(Card, { className: "mt-2", children: _jsx(CardContent, { className: "text-muted-foreground py-3 text-sm", children: "1. de printer die op de opdracht zelf staat \u00B7 2. de documentregel van de printplek (bijv. het pickstation) \u00B7 3. de printer die aan het ontwerp hangt \u00B7 4. de standaardprinter hieronder \u00B7 anders blijft de opdracht liggen met een melding welke instelling ontbreekt." }) }))] }), _jsxs("div", { className: "grid gap-4 lg:grid-cols-[280px_minmax(0,1fr)]", children: [_jsx(Card, { className: "min-w-0 self-start lg:sticky lg:top-4", children: _jsxs(CardContent, { className: "space-y-1 py-3", children: [engine.length > 0 && (_jsxs(_Fragment, { children: [_jsx("p", { className: "text-muted-foreground px-3 pb-1 text-xs uppercase", children: "Logistiek (pickstations)" }), engine.map((d) => (_jsx(LijstItem, { type: d.value, label: d.label }, d.value))), _jsx(Separator, { className: "my-2" })] })), _jsx("p", { className: "text-muted-foreground px-3 pb-1 text-xs uppercase", children: "In gebruik" }), actief.length === 0 && (_jsx("p", { className: "text-muted-foreground px-3 pb-2 text-sm", children: "Nog niets in gebruik." })), actief.map((d) => (_jsx(LijstItem, { type: d.value, label: d.label }, d.value))), rest.length > 0 && (_jsxs(_Fragment, { children: [_jsx(Separator, { className: "my-2" }), _jsxs("button", { type: "button", onClick: () => setToonRest((v) => !v), className: "text-muted-foreground hover:text-foreground flex w-full items-center gap-1 px-3 py-1 text-xs uppercase", children: [toonRest ? (_jsx(ChevronDown, { className: "h-3.5 w-3.5" })) : (_jsx(ChevronRight, { className: "h-3.5 w-3.5" })), "Nog niet ingesteld (", rest.length, ")"] }), toonRest &&
+                                            rest.map((d) => _jsx(LijstItem, { type: d.value, label: d.label }, d.value))] }))] }) }), _jsx(Card, { className: "min-w-0", children: _jsxs(CardContent, { className: "space-y-6 py-5", children: [_jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("h2", { className: "text-lg font-semibold", children: documentTypeLabel(huidig) }), _jsx(Badge, { variant: "secondary", children: weergaveFormaat(huidig) }), actieveLayouts(huidig).length > 0 && (_jsxs(Badge, { variant: "outline", children: [actieveLayouts(huidig).length, " actief ontwerp", actieveLayouts(huidig).length === 1 ? "" : "en"] }))] }), !std && (_jsxs("p", { className: "text-destructive mt-1 flex items-center gap-1 text-sm", children: [_jsx(AlertTriangle, { className: "h-4 w-4" }), " Nog geen printer gekozen \u2014 opdrachten blijven wachten in de printwachtrij."] }))] }), _jsxs("div", { className: "max-w-md space-y-1.5", children: [_jsx("p", { className: "text-sm font-medium", children: "Standaardprinter (bedrijfsbreed)" }), _jsxs(Select, { value: std ?? GEEN, onValueChange: (v) => void kiesStandaard(huidig, v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Geen printer" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Geen printer" }), printers.map((p) => (_jsx(SelectItem, { value: p.id, children: p.naam }, p.id)))] })] }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Wordt gebruikt als de opdracht geen printplek meegeeft. Per printplek stel je een afwijkende printer in met de printplek-wizard." })] }), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setToonGeavanceerd((v) => !v), className: "text-muted-foreground hover:text-foreground flex items-center gap-1 text-sm", children: [toonGeavanceerd || bronSamenvatting.length > 0 ? (_jsx(ChevronDown, { className: "h-4 w-4" })) : (_jsx(ChevronRight, { className: "h-4 w-4" })), "Geavanceerd: welk document wordt gebruikt", bronSamenvatting.length > 0 ? ` · ${bronSamenvatting.join(" · ")}` : ""] }), (toonGeavanceerd || bronSamenvatting.length > 0) && (_jsxs("div", { className: "mt-3 space-y-3", children: [_jsx("p", { className: "text-muted-foreground text-xs", children: "Kies of het meegestuurde document van Floriday wordt afgedrukt of een eigen ontwerp uit deze module." }), HERKOMSTEN.map((h) => {
+                                                    const regel = bronVan(huidig, h.value);
+                                                    const bron = regel?.bron ?? "auto";
+                                                    return (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "w-32 shrink-0 text-sm", children: h.label }), _jsxs(Select, { value: bron, onValueChange: (v) => void kiesBron(huidig, h.value, v, regel?.layout_id ?? null), children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: BRONNEN.map((b) => (_jsx(SelectItem, { value: b.value, children: b.label }, b.value))) })] }), bron === "eigen_layout" && (_jsxs(Select, { value: regel?.layout_id ?? GEEN, onValueChange: (v) => void kiesBron(huidig, h.value, "eigen_layout", v === GEEN ? null : v), children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, { placeholder: "Standaardontwerp" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Standaardontwerp" }), layouts
+                                                                                .filter((l) => l.documenttype === huidig)
+                                                                                .map((l) => (_jsxs(SelectItem, { value: l.id, children: [l.naam, isFloridayLayout(l) ? " (uit Floriday)" : ""] }, l.id)))] })] }))] }, h.value));
+                                                })] }))] })] }) })] })] }));
 }

package/dist-lib/components/DocumentenPage.d.ts

@@ -0,0 +1,4 @@
+export declare function DocumentenPage({ tab }: {
+    tab?: "layouts" | "logos";
+}): import("react").JSX.Element;
+//# sourceMappingURL=DocumentenPage.d.ts.map

package/dist-lib/components/DocumentenPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocumentenPage.d.ts","sourceRoot":"","sources":["../../src/components/DocumentenPage.tsx"],"names":[],"mappings":"AAeA,wBAAgB,cAAc,CAAC,EAAE,GAAe,EAAE,EAAE;IAAE,GAAG,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;CAAE,+BAUhF"}

package/dist-lib/components/DocumentenPage.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// ============================================================================
+// src/components/DocumentenPage.tsx — één menu-item "Documenten" met tabbladen
+// voor de documentontwerpen en de logobibliotheek.
+// ============================================================================
+import { FileText, Image } from "lucide-react";
+import { ModuleTabs } from "./ModuleTabs.js";
+import { LayoutsPage } from "./LayoutsPage.js";
+import { LogosPage } from "./LogosPage.js";
+const TABS = [
+    { label: "Documenten", href: "/layouts-printers", icon: FileText },
+    { label: "Logo's", href: "/layouts-printers/logos", icon: Image },
+];
+export function DocumentenPage({ tab = "layouts" }) {
+    return (_jsx(ModuleTabs, { titel: "Documenten", omschrijving: "Ontwerp pakbonnen, facturen, stickers en beheer de logo's die daarop staan.", tabs: TABS, children: tab === "logos" ? _jsx(LogosPage, { ingebed: true }) : _jsx(LayoutsPage, { ingebed: true }) }));
+}

package/dist-lib/components/LayoutsPage.d.ts

@@ -1,2 +1,4 @@
-export declare function LayoutsPage(): import("react").JSX.Element;
+export declare function LayoutsPage({ ingebed }?: {
+    ingebed?: boolean;
+}): import("react").JSX.Element;
 //# sourceMappingURL=LayoutsPage.d.ts.map

package/dist-lib/components/LayoutsPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutsPage.d.ts","sourceRoot":"","sources":["../../src/components/LayoutsPage.tsx"],"names":[],"mappings":"AAgEA,wBAAgB,WAAW,gCA4kB1B"}
+{"version":3,"file":"LayoutsPage.d.ts","sourceRoot":"","sources":["../../src/components/LayoutsPage.tsx"],"names":[],"mappings":"AAgEA,wBAAgB,WAAW,CAAC,EAAE,OAAe,EAAE,GAAE;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAO,+BA+kB1E"}

package/dist-lib/components/LayoutsPage.js

@@ -13,7 +13,7 @@ function klantOntwerpLayout(l) {
     const cfg = (l.config ?? {});
     return Boolean(cfg?.klantlayout?.gebruik_klantlayout);
 }
-export function LayoutsPage() {
+export function LayoutsPage({ ingebed = false } = {}) {
     const { layouts, loading, reload } = useLayouts();
     useAutoRefresh(() => reload(true), 30000);
     const navigate = useNavigate();
@@ -144,7 +144,8 @@ export function LayoutsPage() {
             setBezig(false);
         }
     };
-    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Documentlayouts" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Ontwerp pakbonnen, facturen, etiketten en alle andere documenten." })] }), _jsx("div", { className: "flex gap-2", children: _jsxs(Button, { onClick: () => setWizardOpen(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Nieuwe layout"] }) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Overzicht" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} van ${layouts.length} layouts` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-5", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op naam of omschrijving", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: typeFilter, onValueChange: setTypeFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Documenttype" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle documenttypes" }), DOCUMENT_TYPES.map((d) => (_jsx(SelectItem, { value: d.value, children: d.label }, d.value)))] })] }), _jsxs(Select, { value: statusFilter, onValueChange: setStatusFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Status" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), _jsx(SelectItem, { value: "actief", children: "Actief" }), _jsx(SelectItem, { value: "inactief", children: "Inactief" })] })] }), _jsxs(Select, { value: bronFilter, onValueChange: setBronFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Herkomst" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle herkomsten" }), _jsx(SelectItem, { value: "eigen", children: "Eigen ontwerp" }), _jsx(SelectItem, { value: "floriday", children: "Uit Floriday" })] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Naam" }), _jsx(TableHead, { children: "Documenttype" }), _jsx(TableHead, { children: "Formaat" }), _jsx(TableHead, { children: "Versie" }), _jsx(TableHead, { children: "Actief" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen layouts gevonden." }) })), gefilterd.map((l) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsxs("div", { className: "flex items-center gap-2 font-medium", children: [_jsx(FileText, { className: "h-4 w-4 text-muted-foreground" }), l.naam, l.is_standaard && _jsx(Badge, { variant: "secondary", children: "Standaard" }), isFloridayLayout(l) && _jsx(Badge, { variant: "outline", children: "Uit Floriday" })] }), (l.omschrijving || isFloridayLayout(l)) && (_jsx("span", { className: "text-xs text-muted-foreground", children: isFloridayLayout(l) ? FLORIDAY_LAYOUT_TOELICHTING : l.omschrijving }))] }), _jsx(TableCell, { children: documentTypeLabel(l.documenttype) }), _jsxs(TableCell, { className: "text-sm text-muted-foreground", children: [l.papierformaat, " \u00B7 ", Number(l.breedte_mm), " \u00D7 ", Number(l.hoogte_mm), " mm"] }), _jsxs(TableCell, { children: ["v", l.huidige_versie] }), _jsx(TableCell, { children: _jsx(Switch, { checked: l.actief, onCheckedChange: async (v) => {
+    const Wrapper = ingebed ? "div" : "main";
+    return (_jsxs(Wrapper, { className: ingebed ? "space-y-6" : "p-6 space-y-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [!ingebed && (_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Documentlayouts" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Ontwerp pakbonnen, facturen, etiketten en alle andere documenten." })] })), _jsx("div", { className: "ml-auto flex gap-2", children: _jsxs(Button, { onClick: () => setWizardOpen(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Nieuwe layout"] }) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Overzicht" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} van ${layouts.length} layouts` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-5", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op naam of omschrijving", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: typeFilter, onValueChange: setTypeFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Documenttype" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle documenttypes" }), DOCUMENT_TYPES.map((d) => (_jsx(SelectItem, { value: d.value, children: d.label }, d.value)))] })] }), _jsxs(Select, { value: statusFilter, onValueChange: setStatusFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Status" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), _jsx(SelectItem, { value: "actief", children: "Actief" }), _jsx(SelectItem, { value: "inactief", children: "Inactief" })] })] }), _jsxs(Select, { value: bronFilter, onValueChange: setBronFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Herkomst" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle herkomsten" }), _jsx(SelectItem, { value: "eigen", children: "Eigen ontwerp" }), _jsx(SelectItem, { value: "floriday", children: "Uit Floriday" })] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Naam" }), _jsx(TableHead, { children: "Documenttype" }), _jsx(TableHead, { children: "Formaat" }), _jsx(TableHead, { children: "Actief" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 5, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen layouts gevonden." }) })), gefilterd.map((l) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsxs("div", { className: "flex items-center gap-2 font-medium", children: [_jsx(FileText, { className: "h-4 w-4 text-muted-foreground" }), l.naam, l.is_standaard && _jsx(Badge, { variant: "secondary", children: "Standaard" }), isFloridayLayout(l) && _jsx(Badge, { variant: "outline", children: "Uit Floriday" })] }), (l.omschrijving || isFloridayLayout(l)) && (_jsx("span", { className: "text-xs text-muted-foreground", children: isFloridayLayout(l) ? FLORIDAY_LAYOUT_TOELICHTING : l.omschrijving }))] }), _jsx(TableCell, { children: documentTypeLabel(l.documenttype) }), _jsxs(TableCell, { className: "text-sm text-muted-foreground", children: [l.papierformaat, " \u00B7 ", Number(l.breedte_mm), " \u00D7 ", Number(l.hoogte_mm), " mm"] }), _jsx(TableCell, { children: _jsx(Switch, { checked: l.actief, onCheckedChange: async (v) => {
                                                                 await updateLayout(l.id, { actief: v });
                                                                 void reload();
                                                             } }) }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [isFloridayLayout(l) ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "Niet aanpasbaar \u2014 komt uit Floriday" })) : klantOntwerpLayout(l) ? (_jsx(Badge, { variant: "outline", children: "Ontwerp van klant" })) : (_jsxs(Button, { variant: "ghost", size: "sm", onClick: () => navigate(l.documenttype === "productiebon"

package/dist-lib/components/LayoutsPrintersTabPage.d.ts

@@ -0,0 +1,2 @@
+export declare function LayoutsPrintersTabPage(): import("react").JSX.Element;
+//# sourceMappingURL=LayoutsPrintersTabPage.d.ts.map

package/dist-lib/components/LayoutsPrintersTabPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutsPrintersTabPage.d.ts","sourceRoot":"","sources":["../../src/components/LayoutsPrintersTabPage.tsx"],"names":[],"mappings":"AAeA,wBAAgB,sBAAsB,gCAmBrC"}

package/dist-lib/components/LayoutsPrintersTabPage.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// ============================================================================
+// src/components/LayoutsPrintersTabPage.tsx — één pagina die de tabblad-URL's
+// van de module bedient (/layouts-printers/logos, /routering, /printers).
+// ============================================================================
+import { useEffect } from "react";
+import { useNavigate, useRouterState } from "@tanstack/react-router";
+import { DocumentenPage } from "./DocumentenPage.js";
+import { PrintenPage } from "./PrintenPage.js";
+function huidigTab(pathname) {
+    const delen = pathname.split("/").filter(Boolean);
+    return delen[delen.length - 1] ?? "";
+}
+export function LayoutsPrintersTabPage() {
+    const navigate = useNavigate();
+    const pathname = useRouterState({ select: (s) => s.location.pathname });
+    const tab = huidigTab(pathname);
+    const stuurDoor = tab === "printers"
+        ? "/layouts-printers/printplekken"
+        : tab === "logos" || tab === "routering"
+            ? null
+            : "/layouts-printers";
+    useEffect(() => {
+        if (stuurDoor)
+            void navigate({ to: stuurDoor, replace: true });
+    }, [stuurDoor, navigate]);
+    if (tab === "logos")
+        return _jsx(DocumentenPage, { tab: "logos" });
+    if (tab === "routering")
+        return _jsx(PrintenPage, { tab: "routering" });
+    return _jsx("p", { className: "text-muted-foreground p-6 text-sm", children: "Doorsturen\u2026" });
+}

package/dist-lib/components/LogosPage.d.ts

@@ -3,5 +3,7 @@ export declare function LogoThumbnail({ logo, className }: {
     logo: LogoModel;
     className?: string;
 }): import("react").JSX.Element;
-export declare function LogosPage(): import("react").JSX.Element;
+export declare function LogosPage({ ingebed }?: {
+    ingebed?: boolean;
+}): import("react").JSX.Element;
 //# sourceMappingURL=LogosPage.d.ts.map

package/dist-lib/components/LogosPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LogosPage.d.ts","sourceRoot":"","sources":["../../src/components/LogosPage.tsx"],"names":[],"mappings":"AAkCA,OAAO,EAaL,KAAK,SAAS,EACf,MAAM,oBAAoB,CAAC;AAE5B,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,SAAc,EAAE,EAAE;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAY9F;AASD,wBAAgB,SAAS,gCA4LxB"}
+{"version":3,"file":"LogosPage.d.ts","sourceRoot":"","sources":["../../src/components/LogosPage.tsx"],"names":[],"mappings":"AAkCA,OAAO,EAaL,KAAK,SAAS,EACf,MAAM,oBAAoB,CAAC;AAE5B,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,SAAc,EAAE,EAAE;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAY9F;AASD,wBAAgB,SAAS,CAAC,EAAE,OAAe,EAAE,GAAE;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAO,+BA8LxE"}

package/dist-lib/components/LogosPage.js

@@ -7,7 +7,7 @@ import { LOGO_CATEGORIEEN, TOEGESTANE_LOGO_TYPES, downloadLogo, formatteerBytes,
 export function LogoThumbnail({ logo, className = "" }) {
     return (_jsx("div", { className: `flex h-12 w-16 items-center justify-center overflow-hidden rounded border bg-[repeating-conic-gradient(#e5e7eb_0%_25%,#fff_0%_50%)] bg-[length:10px_10px] ${className}`, children: logo.viewUrl ? (_jsx("img", { src: logo.viewUrl, alt: logo.naam, className: "max-h-full max-w-full object-contain" })) : (_jsx(ImagePlus, { className: "h-4 w-4 text-muted-foreground" })) }));
 }
-export function LogosPage() {
+export function LogosPage({ ingebed = false } = {}) {
     const { logos, loading, reload } = useLogos();
     const { opslagFout, controleer } = useLogoOpslag();
     const [zoek, setZoek] = useState("");
@@ -42,7 +42,8 @@ export function LogosPage() {
             toast.error("Verwijderen mislukt");
         }
     };
-    return (_jsxs("main", { className: "flex-1 space-y-6 p-6", children: [opslagFout ? (_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3 rounded-md border border-destructive/40 bg-destructive/10 p-4 text-sm text-destructive", children: [_jsx("span", { children: opslagFout }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => void controleer(), children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), " Opnieuw controleren"] })] })) : null, _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex-row flex-wrap items-end justify-between gap-3 space-y-0", children: [_jsxs("div", { children: [_jsx(CardTitle, { children: "Logo Bibliotheek" }), _jsx(CardDescription, { children: "Centraal beheer van alle bedrijfslogo's. Layouts verwijzen naar deze bibliotheek, dus een vervangen logo werkt direct door in elke layout." })] }), _jsxs(Button, { onClick: () => setUploadOpen(true), disabled: !!opslagFout, title: opslagFout ?? undefined, children: [_jsx(Upload, { className: "mr-2 h-4 w-4" }), " Logo's uploaden"] })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-wrap gap-3", children: [_jsx(Input, { placeholder: "Zoek op naam of omschrijving\u2026", value: zoek, onChange: (e) => setZoek(e.target.value), className: "max-w-xs" }), _jsxs(Select, { value: categorie, onValueChange: setCategorie, children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, { placeholder: "Categorie" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle categorie\u00EBn" }), LOGO_CATEGORIEEN.map((c) => (_jsx(SelectItem, { value: c.value, children: c.label }, c.value)))] })] })] }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Voorbeeld" }), _jsx(TableHead, { children: "Naam" }), _jsx(TableHead, { children: "Omschrijving" }), _jsx(TableHead, { children: "Categorie" }), _jsx(TableHead, { children: "Formaat" }), _jsx(TableHead, { children: "Resolutie" }), _jsx(TableHead, { children: "Transparant" }), _jsx(TableHead, { children: "Toegevoegd" }), _jsx(TableHead, { children: "Gewijzigd" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [loading && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 10, children: "Laden\u2026" }) })), !loading && zichtbaar.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 10, className: "text-muted-foreground", children: "Nog geen logo's gevonden." }) })), zichtbaar.map((l) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(LogoThumbnail, { logo: l }) }), _jsxs(TableCell, { className: "font-medium", children: [l.naam, l.is_standaard && (_jsx(Badge, { variant: "secondary", className: "ml-2", children: "Standaard" }))] }), _jsx(TableCell, { className: "max-w-56 truncate text-muted-foreground", children: l.omschrijving }), _jsx(TableCell, { children: logoCategorieLabel(l.categorie) }), _jsx(TableCell, { className: "uppercase", children: l.bestandstype }), _jsxs(TableCell, { children: [l.breedte && l.hoogte ? `${l.breedte} × ${l.hoogte} px` : "—", _jsx("div", { className: "text-xs text-muted-foreground", children: formatteerBytes(l.bestandsgrootte) })] }), _jsx(TableCell, { children: l.transparant ? "Ja" : "Nee" }), _jsx(TableCell, { children: new Date(l.created_at).toLocaleDateString("nl-NL") }), _jsx(TableCell, { children: new Date(l.updated_at).toLocaleDateString("nl-NL") }), _jsx(TableCell, { children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx(Button, { variant: "ghost", size: "icon", title: "Bewerken", onClick: () => setBewerk(l), children: _jsx(Pencil, { className: "h-4 w-4" }) }), _jsxs("label", { title: "Vervangen", children: [_jsx("input", { type: "file", className: "hidden", accept: TOEGESTANE_LOGO_TYPES.join(","), onChange: (e) => {
+    const Wrapper = ingebed ? "div" : "main";
+    return (_jsxs(Wrapper, { className: ingebed ? "space-y-6" : "flex-1 space-y-6 p-6", children: [opslagFout ? (_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3 rounded-md border border-destructive/40 bg-destructive/10 p-4 text-sm text-destructive", children: [_jsx("span", { children: opslagFout }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => void controleer(), children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), " Opnieuw controleren"] })] })) : null, _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex-row flex-wrap items-end justify-between gap-3 space-y-0", children: [_jsxs("div", { children: [_jsx(CardTitle, { children: "Logo Bibliotheek" }), _jsx(CardDescription, { children: "Centraal beheer van alle bedrijfslogo's. Layouts verwijzen naar deze bibliotheek, dus een vervangen logo werkt direct door in elke layout." })] }), _jsxs(Button, { onClick: () => setUploadOpen(true), disabled: !!opslagFout, title: opslagFout ?? undefined, children: [_jsx(Upload, { className: "mr-2 h-4 w-4" }), " Logo's uploaden"] })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-wrap gap-3", children: [_jsx(Input, { placeholder: "Zoek op naam of omschrijving\u2026", value: zoek, onChange: (e) => setZoek(e.target.value), className: "max-w-xs" }), _jsxs(Select, { value: categorie, onValueChange: setCategorie, children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, { placeholder: "Categorie" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle categorie\u00EBn" }), LOGO_CATEGORIEEN.map((c) => (_jsx(SelectItem, { value: c.value, children: c.label }, c.value)))] })] })] }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Voorbeeld" }), _jsx(TableHead, { children: "Naam" }), _jsx(TableHead, { children: "Omschrijving" }), _jsx(TableHead, { children: "Categorie" }), _jsx(TableHead, { children: "Formaat" }), _jsx(TableHead, { children: "Resolutie" }), _jsx(TableHead, { children: "Transparant" }), _jsx(TableHead, { children: "Toegevoegd" }), _jsx(TableHead, { children: "Gewijzigd" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [loading && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 10, children: "Laden\u2026" }) })), !loading && zichtbaar.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 10, className: "text-muted-foreground", children: "Nog geen logo's gevonden." }) })), zichtbaar.map((l) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(LogoThumbnail, { logo: l }) }), _jsxs(TableCell, { className: "font-medium", children: [l.naam, l.is_standaard && (_jsx(Badge, { variant: "secondary", className: "ml-2", children: "Standaard" }))] }), _jsx(TableCell, { className: "max-w-56 truncate text-muted-foreground", children: l.omschrijving }), _jsx(TableCell, { children: logoCategorieLabel(l.categorie) }), _jsx(TableCell, { className: "uppercase", children: l.bestandstype }), _jsxs(TableCell, { children: [l.breedte && l.hoogte ? `${l.breedte} × ${l.hoogte} px` : "—", _jsx("div", { className: "text-xs text-muted-foreground", children: formatteerBytes(l.bestandsgrootte) })] }), _jsx(TableCell, { children: l.transparant ? "Ja" : "Nee" }), _jsx(TableCell, { children: new Date(l.created_at).toLocaleDateString("nl-NL") }), _jsx(TableCell, { children: new Date(l.updated_at).toLocaleDateString("nl-NL") }), _jsx(TableCell, { children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx(Button, { variant: "ghost", size: "icon", title: "Bewerken", onClick: () => setBewerk(l), children: _jsx(Pencil, { className: "h-4 w-4" }) }), _jsxs("label", { title: "Vervangen", children: [_jsx("input", { type: "file", className: "hidden", accept: TOEGESTANE_LOGO_TYPES.join(","), onChange: (e) => {
                                                                                     const f = e.target.files?.[0];
                                                                                     if (f)
                                                                                         void vervang(l, f);

package/dist-lib/components/ModuleTabs.d.ts

@@ -0,0 +1,19 @@
+import type { ReactNode } from "react";
+import type { LucideIcon } from "lucide-react";
+export interface ModuleTab {
+    label: string;
+    href: string;
+    icon?: LucideIcon;
+    /** Extra paden die dit tabblad actief maken (bijv. detailpagina's). */
+    ook?: string[];
+}
+interface Props {
+    titel: string;
+    omschrijving?: string;
+    tabs: ModuleTab[];
+    acties?: ReactNode;
+    children: ReactNode;
+}
+export declare function ModuleTabs({ titel, omschrijving, tabs, acties, children }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=ModuleTabs.d.ts.map

package/dist-lib/components/ModuleTabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModuleTabs.d.ts","sourceRoot":"","sources":["../../src/components/ModuleTabs.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,uEAAuE;IACvE,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC;CAChB;AAED,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,SAAS,EAAE,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,KAAK,+BA2ChF"}

package/dist-lib/components/ModuleTabs.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Link, useRouterState } from "@tanstack/react-router";
+export function ModuleTabs({ titel, omschrijving, tabs, acties, children }) {
+    const pad = useRouterState({ select: (s) => s.location.pathname });
+    const veilig = Array.isArray(tabs) ? tabs : [];
+    const isActief = (t) => {
+        const paden = [t.href, ...(Array.isArray(t.ook) ? t.ook : [])];
+        return paden.some((p) => pad === p || pad.startsWith(`${p}/`));
+    };
+    return (_jsxs("main", { className: "space-y-5 p-6", children: [_jsxs("header", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("h1", { className: "truncate text-xl font-semibold", children: titel }), omschrijving && _jsx("p", { className: "text-muted-foreground text-sm", children: omschrijving })] }), acties && _jsx("div", { className: "flex flex-wrap items-center gap-2", children: acties })] }), _jsx("nav", { className: "bg-muted/50 inline-flex flex-wrap gap-1 rounded-lg p-1", children: veilig.map((t) => {
+                    const actief = isActief(t);
+                    const Icon = t.icon;
+                    return (_jsxs(Link, { to: t.href, className: `flex items-center gap-2 rounded-md px-3 py-1.5 text-sm font-medium transition-colors ${actief
+                            ? "bg-background text-foreground shadow-sm"
+                            : "text-muted-foreground hover:text-foreground"}`, children: [Icon && _jsx(Icon, { className: "h-4 w-4" }), t.label] }, t.href));
+                }) }), _jsx("div", { children: children })] }));
+}

package/dist-lib/components/PakbonBuilderPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PakbonBuilderPage.d.ts","sourceRoot":"","sources":["../../src/components/PakbonBuilderPage.tsx"],"names":[],"mappings":"AAwBA,iFAAiF;AACjF,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAE;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAO,+BA0IvF"}
+{"version":3,"file":"PakbonBuilderPage.d.ts","sourceRoot":"","sources":["../../src/components/PakbonBuilderPage.tsx"],"names":[],"mappings":"AAyBA,iFAAiF;AACjF,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAE;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAO,+BA0KvF"}

package/dist-lib/components/PakbonBuilderPage.js

@@ -7,7 +7,8 @@ import { PakbonSectiesPanel } from "./PakbonSectiesPanel.js";
 import { PakbonPreview } from "./PakbonPreview.js";
 import { FormaatOrientatieBar } from "./FormaatOrientatieBar.js";
 import { leesPakbonConfig } from "../lib/pakbonBuilder.js";
-import { printPakbon, voorbeeldPakbonOrder } from "../lib/pakbonHtml.js";
+import { renderPakbonDocument, voorbeeldPakbonOrder } from "../lib/pakbonHtml.js";
+import { printHtml, printerVoorDocumenttype, volgJobStatus } from "../lib/printApi.js";
 import { haalPrintLogos } from "../lib/logoLibrary.js";
 import { updateLayout, useLayoutDetail } from "../lib/useDocumentData.js";
 import { useLayoutIdParam } from "../lib/useLayoutIdParam.js";
@@ -44,16 +45,41 @@ export function PakbonBuilderPage({ layoutId: layoutIdProp } = {}) {
             return;
         setPrinten(true);
         try {
+            const printerId = await printerVoorDocumenttype("pakbon", layout?.papierformaat ?? undefined);
+            if (!printerId) {
+                toast.error("Nog geen printer gekoppeld aan Pakbon — stel dit in bij Layouts & printers > Routering.");
+                return;
+            }
             const logos = await haalPrintLogos();
-            printPakbon(config, voorbeeldPakbonOrder(), {
+            const html = renderPakbonDocument(config, voorbeeldPakbonOrder(), {
                 logos,
                 breedteMm: breedte,
                 hoogteMm: hoogte,
                 titel: layout?.naam ?? "Pakbon",
             });
+            const { jobId } = await printHtml({
+                documenttype: "pakbon",
+                documentnaam: `Voorbeeld ${layout?.naam ?? "pakbon"}`,
+                html,
+                printerId,
+                payload: { voorbeeld: true, layout_id: layout?.id ?? layoutId },
+                isHerprint: true,
+            });
+            toast.success("Voorbeeld naar de printer verstuurd");
+            const stop = volgJobStatus(jobId, (s) => {
+                if (s.status === "klaar") {
+                    toast.success("Voorbeeld afgedrukt");
+                    stop();
+                }
+                else if (s.status === "mislukt") {
+                    toast.error(s.foutmelding ?? "Voorbeeld printen mislukt");
+                    stop();
+                }
+            });
+            window.setTimeout(() => stop(), 120000);
         }
-        catch {
-            toast.error("Voorbeeld printen mislukt");
+        catch (e) {
+            toast.error(e instanceof Error ? e.message : "Voorbeeld printen mislukt");
         }
         finally {
             setPrinten(false);

package/dist-lib/components/PrintQueuePage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrintQueuePage.d.ts","sourceRoot":"","sources":["../../src/components/PrintQueuePage.tsx"],"names":[],"mappings":"AAuDA,wBAAgB,cAAc,gCAqN7B"}
+{"version":3,"file":"PrintQueuePage.d.ts","sourceRoot":"","sources":["../../src/components/PrintQueuePage.tsx"],"names":[],"mappings":"AA+DA,wBAAgB,cAAc,gCAsP7B"}

package/dist-lib/components/PrintQueuePage.js

@@ -4,10 +4,11 @@ import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitl
 import { RotateCcw, Search, XCircle } from "lucide-react";
 import { bijgewerktTekst, useAutoRefresh } from "../lib/useAutoRefresh.js";
 import { PrintStatusBanner } from "./PrintStatusBanner.js";
-import { maakPrintJob, updateJobStatus, useLayouts, usePrinters, usePrintJobs } from "../lib/useDocumentData.js";
+import { maakPrintJob, updateJobStatus, useLayouts, usePrinters, usePrintJobs, usePrintPlekNamen, } from "../lib/useDocumentData.js";
 import { printStatus } from "../lib/printService.functions.js";
 import { vraagWachtrijRonde } from "../lib/queueTickClient.js";
 import { documentTypeLabel } from "../lib/documentTypes.js";
+import { jobPlekLabel } from "../lib/printQueue.js";
 const STATUS_VARIANT = {
     wachtend: "outline",
     bezig: "secondary",
@@ -35,15 +36,27 @@ export function PrintQueuePage() {
     const { layouts } = useLayouts();
     const [zoek, setZoek] = useState("");
     const [status, setStatus] = useState("alle");
+    const [plekFilter, setPlekFilter] = useState("alle");
     const [tickFout, setTickFout] = useState(null);
+    const plekNamen = usePrintPlekNamen();
     const printerNaam = useMemo(() => new Map(printers.map((p) => [p.id, p.naam])), [printers]);
     const layoutNaam = useMemo(() => new Map(layouts.map((l) => [l.id, l.naam])), [layouts]);
+    /** Herkomstlabel per opdracht: printplek, anders pickstation of werkplek. */
+    const plekPerJob = useMemo(() => {
+        const m = new Map();
+        for (const j of jobs)
+            m.set(j.id, jobPlekLabel(j, plekNamen));
+        return m;
+    }, [jobs, plekNamen]);
+    const plekOpties = useMemo(() => Array.from(new Set(Array.from(plekPerJob.values()).filter(Boolean))).sort(), [plekPerJob]);
     const gefilterd = jobs.filter((j) => {
         const q = zoek.trim().toLowerCase();
         if (q && !`${j.documentnaam ?? ""} ${j.gebruiker_naam ?? ""}`.toLowerCase().includes(q))
             return false;
         if (status !== "alle" && j.status !== status)
             return false;
+        if (plekFilter !== "alle" && (plekPerJob.get(j.id) || "—") !== plekFilter)
+            return false;
         return true;
     });
     const tellingen = useMemo(() => {
@@ -83,7 +96,7 @@ export function PrintQueuePage() {
         await reload(true);
     };
     const bijgewerkt = useAutoRefresh(ronde, lopende ? 5000 : 20000);
-    return (_jsxs("main", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Printwachtrij" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Volg printopdrachten, herstart mislukte prints en print documenten opnieuw." })] }), _jsx("span", { className: "text-muted-foreground text-xs", children: bijgewerktTekst(bijgewerkt) })] }), _jsx(PrintStatusBanner, { fout: tickFout }), _jsx("div", { className: "grid gap-4 md:grid-cols-4", children: ["wachtend", "bezig", "voltooid", "mislukt"].map((s) => (_jsx(Card, { children: _jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { className: "capitalize", children: s }), _jsx(CardTitle, { className: "text-2xl", children: tellingen[s] ?? 0 })] }) }, s))) }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Opdrachten" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} opdrachten` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-4", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op document of gebruiker", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: status, onValueChange: setStatus, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), ["wachtend", "bezig", "voltooid", "mislukt", "geannuleerd"].map((s) => (_jsx(SelectItem, { value: s, children: s }, s)))] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Document" }), _jsx(TableHead, { children: "Layout" }), _jsx(TableHead, { children: "Printer" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Tijdstip" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen printopdrachten." }) })), gefilterd.map((j) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("span", { className: "font-medium", children: j.documentnaam ?? documentTypeLabel(j.documenttype) }), j.is_herprint && (_jsx(Badge, { variant: "outline", className: "ml-2", children: "herprint" })), !heeftOrderKenmerk(j) && (_jsx(Badge, { variant: "outline", className: "ml-2 text-amber-600", children: "geen orderkenmerk" })), j.foutmelding && (_jsx("span", { className: "block text-xs text-destructive", children: j.foutmelding }))] }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.layout_id ? layoutNaam.get(j.layout_id) ?? "—" : "—" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.printer_id ? printerNaam.get(j.printer_id) ?? "—" : "—" }), _jsx(TableCell, { children: _jsx(Badge, { variant: STATUS_VARIANT[j.status] ?? "outline", children: j.status }) }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: new Date(j.created_at).toLocaleString("nl-NL") }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsxs(Button, { variant: "ghost", size: "sm", onClick: async () => {
+    return (_jsxs("main", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Printwachtrij" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Volg printopdrachten, herstart mislukte prints en print documenten opnieuw." })] }), _jsx("span", { className: "text-muted-foreground text-xs", children: bijgewerktTekst(bijgewerkt) })] }), _jsx(PrintStatusBanner, { fout: tickFout }), _jsx("div", { className: "grid gap-4 md:grid-cols-4", children: ["wachtend", "bezig", "voltooid", "mislukt"].map((s) => (_jsx(Card, { children: _jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { className: "capitalize", children: s }), _jsx(CardTitle, { className: "text-2xl", children: tellingen[s] ?? 0 })] }) }, s))) }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Opdrachten" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} opdrachten` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-4", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op document of gebruiker", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: status, onValueChange: setStatus, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), ["wachtend", "bezig", "voltooid", "mislukt", "geannuleerd"].map((s) => (_jsx(SelectItem, { value: s, children: s }, s)))] })] }), _jsxs(Select, { value: plekFilter, onValueChange: setPlekFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle printplekken" }), plekOpties.map((p) => (_jsx(SelectItem, { value: p, children: p }, p))), _jsx(SelectItem, { value: "\u2014", children: "Zonder printplek" })] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Document" }), _jsx(TableHead, { children: "Printplek" }), _jsx(TableHead, { children: "Layout" }), _jsx(TableHead, { children: "Printer" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Tijdstip" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 7, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen printopdrachten." }) })), gefilterd.map((j) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("span", { className: "font-medium", children: j.documentnaam ?? documentTypeLabel(j.documenttype) }), j.is_herprint && (_jsx(Badge, { variant: "outline", className: "ml-2", children: "herprint" })), !heeftOrderKenmerk(j) && (_jsx(Badge, { variant: "outline", className: "ml-2 text-amber-600", children: "geen orderkenmerk" })), j.foutmelding && (_jsx("span", { className: "block text-xs text-destructive", children: j.foutmelding }))] }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: plekPerJob.get(j.id) || "—" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.layout_id ? layoutNaam.get(j.layout_id) ?? "—" : "—" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.printer_id ? printerNaam.get(j.printer_id) ?? "—" : "—" }), _jsx(TableCell, { children: _jsx(Badge, { variant: STATUS_VARIANT[j.status] ?? "outline", children: j.status }) }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: new Date(j.created_at).toLocaleString("nl-NL") }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsxs(Button, { variant: "ghost", size: "sm", onClick: async () => {
                                                                         if (!j.layout_id)
                                                                             return;
                                                                         try {

package/dist-lib/components/PrintenPage.d.ts

@@ -0,0 +1,4 @@
+export declare function PrintenPage({ tab, }: {
+    tab?: "printplekken" | "routering";
+}): import("react").JSX.Element;
+//# sourceMappingURL=PrintenPage.d.ts.map