@flowselections/klanten-installatie-techniek-planner 1.0.22 → 1.0.31

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

@@ -1 +1 @@
-{"version":3,"file":"KlantenDetailPage.d.ts","sourceRoot":"","sources":["../../src/components/KlantenDetailPage.tsx"],"names":[],"mappings":"AAsBA,wBAAgB,iBAAiB,gCAkLhC"}
+{"version":3,"file":"KlantenDetailPage.d.ts","sourceRoot":"","sources":["../../src/components/KlantenDetailPage.tsx"],"names":[],"mappings":"AAwBA,wBAAgB,iBAAiB,gCAwLhC"}

package/dist-lib/components/KlantenDetailPage.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
 import { useNavigate, useParams, Link } from "@tanstack/react-router";
 import { Button, Card, CardContent, CardHeader, CardTitle, Separator, } from "@flowselections/core";
 import { ArrowLeft, Trash2, Save, MapPin } from "lucide-react";
@@ -6,10 +7,12 @@ import { useKlantForm } from "./klanten/useKlantForm";
 import { SegmentToggle, AlgemeneGegevensFields, ContactenFields, LocatiesFields, DynamicFieldsGrid, } from "./klanten/KlantFormSections";
 import { KlantGeschiedenisCard } from "./klanten/KlantGeschiedenisCard";
 import { KlantNotitiesCard } from "./klanten/KlantNotitiesCard";
+import { KlantRisicoBannerById } from "./klanten/KlantRisicoBanner";
 import { KlantStatsCard } from "./klanten/KlantStatsCard";
 export function KlantenDetailPage() {
     const { id } = useParams({ from: "/_authenticated/installatietechniek-klanten-planner/$id" });
     const navigate = useNavigate();
+    const [riskKey, setRiskKey] = useState(0);
     const { isNew, loading, saving, form, setForm, customerNumber, contacts, addContact, updateContact, removeContact, locations, addLocation, updateLocation, removeLocation, fields, values, setValues, save, remove, reload, } = useKlantForm({
         customerId: id,
         onSaved: (newId) => {
@@ -26,5 +29,5 @@ export function KlantenDetailPage() {
     if (loading) {
         return (_jsx("main", { className: "p-6", children: _jsx("p", { className: "text-muted-foreground", children: "Laden\u2026" }) }));
     }
-    return (_jsxs("main", { className: "p-6 space-y-6 max-w-5xl", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Link, { to: "/installatietechniek-klanten-planner", children: _jsxs(Button, { variant: "ghost", size: "sm", className: "gap-2", children: [_jsx(ArrowLeft, { className: "w-4 h-4" }), "Terug"] }) }), _jsx("h1", { className: "text-2xl font-bold text-foreground", children: isNew ? "Nieuwe klant" : form.name || "Klant" }), customerNumber && (_jsx("span", { className: "font-mono text-xs text-muted-foreground bg-muted px-2 py-1 rounded", children: customerNumber }))] }), _jsxs("div", { className: "flex gap-2", children: [!isNew && (_jsxs(Button, { variant: "outline", onClick: remove, className: "gap-2 text-destructive", children: [_jsx(Trash2, { className: "w-4 h-4" }), "Verwijderen"] })), _jsxs(Button, { onClick: save, disabled: saving, className: "gap-2", children: [_jsx(Save, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Opslaan"] })] })] }), !isNew && (_jsxs("nav", { className: "flex flex-wrap gap-3 text-xs text-muted-foreground border-b pb-3", children: [_jsx("a", { href: "#gegevens", className: "hover:text-foreground transition-colors", children: "Gegevens" }), form.segment === "Business" && (_jsx("a", { href: "#contactpersonen", className: "hover:text-foreground transition-colors", children: "Contactpersonen" })), _jsx("a", { href: "#werklocaties", className: "hover:text-foreground transition-colors", children: "Werklocaties" }), fields.length > 0 && (_jsx("a", { href: "#aanvullend", className: "hover:text-foreground transition-colors", children: "Aanvullend" })), _jsx("a", { href: "#werkbonnen", className: "hover:text-foreground transition-colors", children: "Werkbonnen" }), _jsx("a", { href: "#notities", className: "hover:text-foreground transition-colors", children: "Notities" })] })), !isNew && _jsx(KlantStatsCard, { customerId: id }), _jsxs(Card, { id: "gegevens", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Segment" }) }), _jsx(CardContent, { children: _jsx(SegmentToggle, { segment: form.segment, onChange: (s) => setForm((f) => ({ ...f, segment: s })) }) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Algemene gegevens" }) }), _jsx(CardContent, { children: _jsx(AlgemeneGegevensFields, { form: form, setForm: setForm, isNew: isNew }) })] }), form.segment === "Business" && (_jsxs(Card, { id: "contactpersonen", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Contactpersonen" }) }), _jsx(CardContent, { children: _jsx(ContactenFields, { contacts: contacts, addContact: addContact, updateContact: updateContact, removeContact: removeContact }) })] })), _jsxs(Card, { id: "werklocaties", children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "text-base flex items-center gap-2", children: [_jsx(MapPin, { className: "w-4 h-4" }), "Werklocaties"] }) }), _jsx(CardContent, { children: _jsx(LocatiesFields, { locations: locations, addLocation: addLocation, updateLocation: updateLocation, removeLocation: removeLocation }) })] }), fields.length > 0 && (_jsxs(Card, { id: "aanvullend", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Aanvullende velden" }) }), _jsx(CardContent, { children: _jsx(DynamicFieldsGrid, { fields: fields, values: values, setValues: setValues }) })] })), !isNew && (_jsxs(_Fragment, { children: [_jsx(KlantGeschiedenisCard, { customerId: id }), _jsx(KlantNotitiesCard, { customerId: id })] })), _jsx(Separator, {}), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { onClick: save, disabled: saving, className: "gap-2", children: [_jsx(Save, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Opslaan"] }) })] }));
+    return (_jsxs("main", { className: "p-6 space-y-6 max-w-5xl", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Link, { to: "/installatietechniek-klanten-planner", children: _jsxs(Button, { variant: "ghost", size: "sm", className: "gap-2", children: [_jsx(ArrowLeft, { className: "w-4 h-4" }), "Terug"] }) }), _jsx("h1", { className: "text-2xl font-bold text-foreground", children: isNew ? "Nieuwe klant" : form.name || "Klant" }), customerNumber && (_jsx("span", { className: "font-mono text-xs text-muted-foreground bg-muted px-2 py-1 rounded", children: customerNumber })), !isNew && form.vat_reverse_charge && (_jsx("span", { className: "text-xs rounded bg-muted px-2 py-1 text-muted-foreground", children: "Btw verlegd" }))] }), _jsxs("div", { className: "flex gap-2", children: [!isNew && (_jsxs(Button, { variant: "outline", onClick: remove, className: "gap-2 text-destructive", children: [_jsx(Trash2, { className: "w-4 h-4" }), "Verwijderen"] })), _jsxs(Button, { onClick: save, disabled: saving, className: "gap-2", children: [_jsx(Save, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Opslaan"] })] })] }), !isNew && (_jsxs("nav", { className: "flex flex-wrap gap-3 text-xs text-muted-foreground border-b pb-3", children: [_jsx("a", { href: "#gegevens", className: "hover:text-foreground transition-colors", children: "Gegevens" }), form.segment === "Business" && (_jsx("a", { href: "#contactpersonen", className: "hover:text-foreground transition-colors", children: "Contactpersonen" })), _jsx("a", { href: "#werklocaties", className: "hover:text-foreground transition-colors", children: "Werklocaties" }), fields.length > 0 && (_jsx("a", { href: "#aanvullend", className: "hover:text-foreground transition-colors", children: "Aanvullend" })), _jsx("a", { href: "#werkbonnen", className: "hover:text-foreground transition-colors", children: "Werkbonnen" }), _jsx("a", { href: "#notities", className: "hover:text-foreground transition-colors", children: "Notities" })] })), !isNew && _jsx(KlantRisicoBannerById, { customerId: id, refreshKey: riskKey }), !isNew && _jsx(KlantStatsCard, { customerId: id }), _jsxs(Card, { id: "gegevens", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Segment" }) }), _jsx(CardContent, { children: _jsx(SegmentToggle, { segment: form.segment, onChange: (s) => setForm((f) => ({ ...f, segment: s })) }) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Algemene gegevens" }) }), _jsx(CardContent, { children: _jsx(AlgemeneGegevensFields, { form: form, setForm: setForm, isNew: isNew }) })] }), form.segment === "Business" && (_jsxs(Card, { id: "contactpersonen", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Contactpersonen" }) }), _jsx(CardContent, { children: _jsx(ContactenFields, { contacts: contacts, addContact: addContact, updateContact: updateContact, removeContact: removeContact }) })] })), _jsxs(Card, { id: "werklocaties", children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "text-base flex items-center gap-2", children: [_jsx(MapPin, { className: "w-4 h-4" }), "Werklocaties"] }) }), _jsx(CardContent, { children: _jsx(LocatiesFields, { locations: locations, addLocation: addLocation, updateLocation: updateLocation, removeLocation: removeLocation }) })] }), fields.length > 0 && (_jsxs(Card, { id: "aanvullend", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Aanvullende velden" }) }), _jsx(CardContent, { children: _jsx(DynamicFieldsGrid, { fields: fields, values: values, setValues: setValues }) })] })), !isNew && (_jsxs(_Fragment, { children: [_jsx(KlantGeschiedenisCard, { customerId: id }), _jsx(KlantNotitiesCard, { customerId: id, onStatusChanged: () => setRiskKey((k) => k + 1) })] })), _jsx(Separator, {}), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { onClick: save, disabled: saving, className: "gap-2", children: [_jsx(Save, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Opslaan"] }) })] }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"KlantenListPage.d.ts","sourceRoot":"","sources":["../../src/components/KlantenListPage.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAU3E,wBAAgB,eAAe,gCAsO9B;AAED,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,eAAe,CAAA;CAAE,+BAkBrE"}
+{"version":3,"file":"KlantenListPage.d.ts","sourceRoot":"","sources":["../../src/components/KlantenListPage.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAY3E,wBAAgB,eAAe,gCA8O9B;AAED,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,eAAe,CAAA;CAAE,+BAkBrE"}

package/dist-lib/components/KlantenListPage.js

@@ -5,7 +5,9 @@ import { Plus, Search, Building2, User } from "lucide-react";
 import { db } from "../lib/itkClient";
 import { fetchKlantStats, fetchTopKlanten, formatEuro } from "../lib/klantStatsClient";
 import { KlantDialog } from "./klanten/KlantDialog";
+import { KlantRisicoBadge } from "./klanten/KlantRisicoBanner";
 import { KlantenPodium } from "./klanten/KlantenPodium";
+import { KlantenTrendCard } from "./klanten/KlantenTrendCard";
 const PAGE_SIZE = 50;
 export function KlantenListPage() {
     const [customers, setCustomers] = useState([]);
@@ -95,7 +97,7 @@ export function KlantenListPage() {
     const filtered = customers;
     const pageCount = Math.max(1, Math.ceil(total / PAGE_SIZE));
     const statCell = (id, pick) => stats[id] ? pick(stats[id]) : statsFailed ? "n.b." : "—";
-    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 gap-y-3 sm:flex sm:flex-wrap sm:items-center sm:gap-6", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("h1", { className: "truncate text-2xl font-bold text-foreground", children: "Klanten" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Beheer al je zakelijke en particuliere klanten" })] }), top.length > 0 && (_jsx("div", { className: "col-span-2 justify-self-start sm:col-span-1 sm:self-center sm:justify-self-auto", children: _jsx(KlantenPodium, { items: top, onSelect: openCustomer }) })), _jsxs(Button, { className: "col-start-2 row-start-1 shrink-0 justify-self-end gap-2 sm:col-start-auto sm:row-start-auto sm:ml-auto sm:justify-self-auto", onClick: () => openCustomer(null), children: [_jsx(Plus, { className: "w-4 h-4" }), "Nieuwe klant"] })] }), _jsx(Card, { children: _jsxs(CardContent, { className: "p-4 space-y-4", children: [_jsxs("div", { className: "flex gap-3 flex-wrap", children: [_jsxs("div", { className: "relative flex-1 min-w-[240px]", children: [_jsx(Search, { className: "w-4 h-4 absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { placeholder: "Zoek op klantnr, naam, e-mail of plaats\u2026", value: search, onChange: (e) => setSearch(e.target.value), className: "pl-9" })] }), _jsxs(Select, { value: segmentFilter, onValueChange: (v) => setSegmentFilter(v), children: [_jsx(SelectTrigger, { className: "w-[180px]", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "Alle segmenten" }), _jsx(SelectItem, { value: "Business", children: "Zakelijk" }), _jsx(SelectItem, { value: "Private", children: "Particulier" })] })] })] }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: "w-[130px]", children: "Klantnr." }), _jsx(TableHead, { className: "w-[30%]", children: "Naam" }), _jsx(TableHead, { children: "Segment" }), _jsx(TableHead, { children: "E-mail" }), _jsx(TableHead, { children: "Telefoon" }), _jsx(TableHead, { children: "Plaats" }), _jsx(TableHead, { className: "text-right", children: "Omzet" }), _jsx(TableHead, { className: "text-right", children: "Klussen" })] }) }), _jsx(TableBody, { children: loading ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 8, className: "text-center text-muted-foreground py-8", children: "Laden\u2026" }) })) : filtered.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 8, className: "text-center text-muted-foreground py-8", children: loadError ? "Klanten konden niet geladen worden" : "Geen klanten gevonden" }) })) : (filtered.map((c) => (_jsxs(TableRow, { className: "hover:bg-muted/40 cursor-pointer", onClick: () => openCustomer(c.id), children: [_jsx(TableCell, { className: "font-mono text-xs text-muted-foreground", children: c.customer_number ?? "—" }), _jsx(TableCell, { className: "font-medium text-foreground", children: c.name }), _jsx(TableCell, { children: _jsx(SegmentBadge, { segment: c.segment }) }), _jsx(TableCell, { className: "text-sm", children: c.general_email ?? "—" }), _jsx(TableCell, { className: "text-sm", children: c.general_phone ?? "—" }), _jsx(TableCell, { className: "text-sm", children: c.billing_city ?? "—" }), _jsx(TableCell, { className: "text-sm text-right tabular-nums", children: statCell(c.id, (s) => formatEuro(s.omzetCents)) }), _jsx(TableCell, { className: "text-sm text-right tabular-nums", children: statCell(c.id, (s) => s.klussen) })] }, c.id)))) })] }) }), _jsxs("div", { className: "flex items-center justify-between gap-3 text-sm text-muted-foreground", children: [_jsxs("span", { children: [total, " ", total === 1 ? "klant" : "klanten", statsFailed && " · omzet/klussen niet beschikbaar"] }), pageCount > 1 && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", disabled: page === 0 || loading, onClick: () => setPage((p) => p - 1), children: "Vorige" }), _jsxs("span", { className: "tabular-nums", children: [page + 1, " / ", pageCount] }), _jsx(Button, { variant: "outline", size: "sm", disabled: page + 1 >= pageCount || loading, onClick: () => setPage((p) => p + 1), children: "Volgende" })] }))] })] }) }), _jsx(KlantDialog, { open: dialogOpen, onOpenChange: setDialogOpen, customerId: selectedId, onChanged: () => { void load(); void loadTop(); } })] }));
+    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 gap-y-3 sm:flex sm:flex-wrap sm:items-center sm:gap-6", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("h1", { className: "truncate text-2xl font-bold text-foreground", children: "Klanten" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Beheer al je zakelijke en particuliere klanten" })] }), top.length > 0 && (_jsx("div", { className: "col-span-2 justify-self-start sm:col-span-1 sm:self-center sm:justify-self-auto", children: _jsx(KlantenPodium, { items: top, onSelect: openCustomer }) })), _jsxs(Button, { className: "col-start-2 row-start-1 shrink-0 justify-self-end gap-2 sm:col-start-auto sm:row-start-auto sm:ml-auto sm:justify-self-auto", onClick: () => openCustomer(null), children: [_jsx(Plus, { className: "w-4 h-4" }), "Nieuwe klant"] })] }), _jsx(Card, { children: _jsxs(CardContent, { className: "p-4 space-y-4", children: [_jsxs("div", { className: "flex gap-3 flex-wrap", children: [_jsxs("div", { className: "relative flex-1 min-w-[240px]", children: [_jsx(Search, { className: "w-4 h-4 absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { placeholder: "Zoek op klantnr, naam, e-mail of plaats\u2026", value: search, onChange: (e) => setSearch(e.target.value), className: "pl-9" })] }), _jsxs(Select, { value: segmentFilter, onValueChange: (v) => setSegmentFilter(v), children: [_jsx(SelectTrigger, { className: "w-[180px]", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "Alle segmenten" }), _jsx(SelectItem, { value: "Business", children: "Zakelijk" }), _jsx(SelectItem, { value: "Private", children: "Particulier" })] })] })] }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: "w-[130px]", children: "Klantnr." }), _jsx(TableHead, { className: "w-[30%]", children: "Naam" }), _jsx(TableHead, { children: "Segment" }), _jsx(TableHead, { children: "E-mail" }), _jsx(TableHead, { children: "Telefoon" }), _jsx(TableHead, { children: "Plaats" }), _jsx(TableHead, { className: "text-right", children: "Omzet" }), _jsx(TableHead, { className: "text-right", children: "Klussen" })] }) }), _jsx(TableBody, { children: loading ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 8, className: "text-center text-muted-foreground py-8", children: "Laden\u2026" }) })) : filtered.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 8, className: "text-center text-muted-foreground py-8", children: loadError ? "Klanten konden niet geladen worden" : "Geen klanten gevonden" }) })) : (filtered.map((c) => (_jsxs(TableRow, { className: "hover:bg-muted/40 cursor-pointer", onClick: () => openCustomer(c.id), children: [_jsx(TableCell, { className: "font-mono text-xs text-muted-foreground", children: c.customer_number ?? "—" }), _jsxs(TableCell, { className: "font-medium text-foreground", children: [c.name, _jsx(KlantRisicoBadge, { status: c.risk_status }), c.vat_reverse_charge && (_jsx("span", { className: "ml-2 text-[10px] uppercase tracking-wide rounded bg-muted px-1.5 py-0.5 text-muted-foreground", children: "Btw verlegd" }))] }), _jsx(TableCell, { children: _jsx(SegmentBadge, { segment: c.segment }) }), _jsx(TableCell, { className: "text-sm", children: c.general_email ?? "—" }), _jsx(TableCell, { className: "text-sm", children: c.general_phone ?? "—" }), _jsx(TableCell, { className: "text-sm", children: c.billing_city ?? "—" }), _jsx(TableCell, { className: "text-sm text-right tabular-nums", children: statCell(c.id, (s) => formatEuro(s.omzetCents)) }), _jsx(TableCell, { className: "text-sm text-right tabular-nums", children: statCell(c.id, (s) => s.klussen) })] }, c.id)))) })] }) }), _jsxs("div", { className: "flex items-center justify-between gap-3 text-sm text-muted-foreground", children: [_jsxs("span", { children: [total, " ", total === 1 ? "klant" : "klanten", statsFailed && " · omzet/klussen niet beschikbaar"] }), pageCount > 1 && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", disabled: page === 0 || loading, onClick: () => setPage((p) => p - 1), children: "Vorige" }), _jsxs("span", { className: "tabular-nums", children: [page + 1, " / ", pageCount] }), _jsx(Button, { variant: "outline", size: "sm", disabled: page + 1 >= pageCount || loading, onClick: () => setPage((p) => p + 1), children: "Volgende" })] }))] })] }) }), _jsx(KlantenTrendCard, {}), _jsx(KlantDialog, { open: dialogOpen, onOpenChange: setDialogOpen, customerId: selectedId, onChanged: () => { void load(); void loadTop(); } })] }));
 }
 export function SegmentBadge({ segment }) {
     if (segment === "Business") {

package/dist-lib/components/klanten/KlantDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KlantDialog.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantDialog.tsx"],"names":[],"mappings":"AAqCA,UAAU,KAAK;IACb,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,6BAA6B;IAC7B,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,KAAK,+BA4L/E"}
+{"version":3,"file":"KlantDialog.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantDialog.tsx"],"names":[],"mappings":"AAsCA,UAAU,KAAK;IACb,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,6BAA6B;IAC7B,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,KAAK,+BAsM/E"}

package/dist-lib/components/klanten/KlantDialog.js

@@ -7,10 +7,12 @@ import { useKlantForm } from "./useKlantForm";
 import { SegmentToggle, AlgemeneGegevensFields, ContactenFields, LocatiesFields, DynamicFieldsGrid, } from "./KlantFormSections";
 import { KlantGeschiedenisCard } from "./KlantGeschiedenisCard";
 import { KlantNotitiesCard } from "./KlantNotitiesCard";
+import { KlantRisicoBannerById } from "./KlantRisicoBanner";
 import { KlantStatsCard } from "./KlantStatsCard";
 import { SegmentBadge } from "../KlantenListPage";
 export function KlantDialog({ open, onOpenChange, customerId, onChanged }) {
     const [tab, setTab] = useState("gegevens");
+    const [riskKey, setRiskKey] = useState(0);
     const { isNew, loading, saving, form, setForm, customerNumber, contacts, addContact, updateContact, removeContact, locations, addLocation, updateLocation, removeLocation, fields, values, setValues, save, remove, } = useKlantForm({
         customerId,
         enabled: open,
@@ -33,5 +35,8 @@ export function KlantDialog({ open, onOpenChange, customerId, onChanged }) {
             setTab("gegevens");
     }, [form.segment, tab]);
     const isBusiness = form.segment === "Business";
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-[720px] max-h-[85vh] overflow-hidden flex flex-col", children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center gap-2 pr-8", children: [_jsx(User, { className: "w-5 h-5" }), isNew ? "Nieuwe klant" : form.name || "Klant", customerNumber && (_jsx("span", { className: "font-mono text-xs text-muted-foreground bg-muted px-2 py-0.5 rounded", children: customerNumber })), !isNew && _jsx(SegmentBadge, { segment: form.segment })] }), _jsx(DialogDescription, { className: "sr-only", children: "Klantgegevens bewerken" })] }), loading ? (_jsx("p", { className: "text-sm text-muted-foreground py-8 text-center", children: "Laden\u2026" })) : (_jsxs(Tabs, { value: tab, onValueChange: setTab, className: "flex-1 overflow-hidden flex flex-col", children: [_jsxs(TabsList, { className: `grid w-full ${isBusiness ? "grid-cols-5" : "grid-cols-4"}`, children: [_jsxs(TabsTrigger, { value: "gegevens", title: "Gegevens", className: "gap-1.5 px-1.5 text-xs", children: [_jsx(User, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Gegevens" })] }), isBusiness && (_jsxs(TabsTrigger, { value: "contacten", title: "Contacten", className: "gap-1.5 px-1.5 text-xs", children: [_jsx(Users, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Contacten" })] })), _jsxs(TabsTrigger, { value: "locaties", title: "Locaties", className: "gap-1.5 px-1.5 text-xs", children: [_jsx(MapPin, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Locaties" })] }), _jsxs(TabsTrigger, { value: "werkbonnen", title: "Werkbonnen", disabled: isNew, className: "gap-1.5 px-1.5 text-xs", children: [_jsx(Wrench, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Werkbonnen" })] }), _jsxs(TabsTrigger, { value: "notities", title: "Notities", disabled: isNew, className: "gap-1.5 px-1.5 text-xs", children: [_jsx(StickyNote, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Notities" })] })] }), _jsxs("div", { className: "flex-1 overflow-y-auto mt-4 pr-1", children: [_jsxs(TabsContent, { value: "gegevens", className: "m-0 space-y-5", children: [!isNew && customerId && _jsx(KlantStatsCard, { customerId: customerId }), _jsx(SegmentToggle, { segment: form.segment, onChange: (s) => setForm((f) => ({ ...f, segment: s })) }), _jsx(AlgemeneGegevensFields, { form: form, setForm: setForm, isNew: isNew }), fields.length > 0 && (_jsxs("div", { className: "space-y-3 pt-2 border-t", children: [_jsx("p", { className: "text-sm font-medium text-foreground pt-3", children: "Aanvullende velden" }), _jsx(DynamicFieldsGrid, { fields: fields, values: values, setValues: setValues })] }))] }), isBusiness && (_jsx(TabsContent, { value: "contacten", className: "m-0", children: _jsx(ContactenFields, { contacts: contacts, addContact: addContact, updateContact: updateContact, removeContact: removeContact }) })), _jsx(TabsContent, { value: "locaties", className: "m-0", children: _jsx(LocatiesFields, { locations: locations, addLocation: addLocation, updateLocation: updateLocation, removeLocation: removeLocation, hideGpsFields: isNew }) }), !isNew && customerId && (_jsxs(_Fragment, { children: [_jsx(TabsContent, { value: "werkbonnen", className: "m-0", children: _jsx(KlantGeschiedenisCard, { customerId: customerId }) }), _jsx(TabsContent, { value: "notities", className: "m-0", children: _jsx(KlantNotitiesCard, { customerId: customerId }) })] }))] }), _jsxs("div", { className: "flex items-center justify-between gap-2 pt-4 border-t mt-4", children: [_jsxs("div", { className: "flex gap-2", children: [!isNew && (_jsxs(Button, { variant: "outline", onClick: remove, className: "gap-2 text-destructive", children: [_jsx(Trash2, { className: "w-4 h-4" }), "Verwijderen"] })), !isNew && customerId && (_jsx(Link, { to: "/installatietechniek-klanten-planner/$id", params: { id: customerId }, children: _jsxs(Button, { variant: "ghost", className: "gap-2", children: [_jsx(ExternalLink, { className: "w-4 h-4" }), _jsx("span", { className: "hidden sm:inline", children: "Volledige pagina" })] }) }))] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), children: "Annuleren" }), _jsxs(Button, { onClick: save, disabled: saving, className: "gap-2", children: [_jsx(Save, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Opslaan"] })] })] })] }))] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-[720px] max-h-[85vh] overflow-hidden flex flex-col", children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center gap-2 pr-8", children: [_jsx(User, { className: "w-5 h-5" }), isNew ? "Nieuwe klant" : form.name || "Klant", customerNumber && (_jsx("span", { className: "font-mono text-xs text-muted-foreground bg-muted px-2 py-0.5 rounded", children: customerNumber })), !isNew && _jsx(SegmentBadge, { segment: form.segment })] }), _jsx(DialogDescription, { className: "sr-only", children: "Klantgegevens bewerken" })] }), !isNew && customerId && !loading && (_jsx(KlantRisicoBannerById, { customerId: customerId, refreshKey: riskKey })), loading ? (_jsx("p", { className: "text-sm text-muted-foreground py-8 text-center", children: "Laden\u2026" })) : (_jsxs(Tabs, { value: tab, onValueChange: setTab, className: "flex-1 overflow-hidden flex flex-col", children: [_jsxs(TabsList, { className: `grid w-full ${isBusiness ? "grid-cols-5" : "grid-cols-4"}`, children: [_jsxs(TabsTrigger, { value: "gegevens", title: "Gegevens", className: "gap-1.5 px-1.5 text-xs", children: [_jsx(User, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Gegevens" })] }), isBusiness && (_jsxs(TabsTrigger, { value: "contacten", title: "Contacten", className: "gap-1.5 px-1.5 text-xs", children: [_jsx(Users, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Contacten" })] })), _jsxs(TabsTrigger, { value: "locaties", title: "Locaties", className: "gap-1.5 px-1.5 text-xs", children: [_jsx(MapPin, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Locaties" })] }), _jsxs(TabsTrigger, { value: "werkbonnen", title: "Werkbonnen", disabled: isNew, className: "gap-1.5 px-1.5 text-xs", children: [_jsx(Wrench, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Werkbonnen" })] }), _jsxs(TabsTrigger, { value: "notities", title: "Notities", disabled: isNew, className: "gap-1.5 px-1.5 text-xs", children: [_jsx(StickyNote, { className: "w-3.5 h-3.5 shrink-0" }), _jsx("span", { className: "hidden lg:inline", children: "Notities" })] })] }), _jsxs("div", { className: "flex-1 overflow-y-auto mt-4 pr-1", children: [_jsxs(TabsContent, { value: "gegevens", className: "m-0 space-y-5", children: [!isNew && customerId && _jsx(KlantStatsCard, { customerId: customerId }), _jsx(SegmentToggle, { segment: form.segment, onChange: (s) => setForm((f) => ({ ...f, segment: s })) }), _jsx(AlgemeneGegevensFields, { form: form, setForm: setForm, isNew: isNew }), fields.length > 0 && (_jsxs("div", { className: "space-y-3 pt-2 border-t", children: [_jsx("p", { className: "text-sm font-medium text-foreground pt-3", children: "Aanvullende velden" }), _jsx(DynamicFieldsGrid, { fields: fields, values: values, setValues: setValues })] }))] }), isBusiness && (_jsx(TabsContent, { value: "contacten", className: "m-0", children: _jsx(ContactenFields, { contacts: contacts, addContact: addContact, updateContact: updateContact, removeContact: removeContact }) })), _jsx(TabsContent, { value: "locaties", className: "m-0", children: _jsx(LocatiesFields, { locations: locations, addLocation: addLocation, updateLocation: updateLocation, removeLocation: removeLocation, hideGpsFields: isNew }) }), !isNew && customerId && (_jsxs(_Fragment, { children: [_jsx(TabsContent, { value: "werkbonnen", className: "m-0", children: _jsx(KlantGeschiedenisCard, { customerId: customerId }) }), _jsx(TabsContent, { value: "notities", className: "m-0", children: _jsx(KlantNotitiesCard, { customerId: customerId, onStatusChanged: () => {
+                                                    setRiskKey((k) => k + 1);
+                                                    onChanged?.();
+                                                } }) })] }))] }), _jsxs("div", { className: "flex items-center justify-between gap-2 pt-4 border-t mt-4", children: [_jsxs("div", { className: "flex gap-2", children: [!isNew && (_jsxs(Button, { variant: "outline", onClick: remove, className: "gap-2 text-destructive", children: [_jsx(Trash2, { className: "w-4 h-4" }), "Verwijderen"] })), !isNew && customerId && (_jsx(Link, { to: "/installatietechniek-klanten-planner/$id", params: { id: customerId }, children: _jsxs(Button, { variant: "ghost", className: "gap-2", children: [_jsx(ExternalLink, { className: "w-4 h-4" }), _jsx("span", { className: "hidden sm:inline", children: "Volledige pagina" })] }) }))] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), children: "Annuleren" }), _jsxs(Button, { onClick: save, disabled: saving, className: "gap-2", children: [_jsx(Save, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Opslaan"] })] })] })] }))] }) }));
 }

package/dist-lib/components/klanten/KlantFormSections.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KlantFormSections.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantFormSections.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE9E,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAOtF;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,IAAI,EACJ,KAAK,GACN,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;CACf,+BAgBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACnC,QAAQ,EAAE,CAAC,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC;CAClD,+BAiBA;AAED,wBAAgB,sBAAsB,CAAC,EACrC,IAAI,EACJ,OAAO,EACP,KAAa,GACd,EAAE;IACD,IAAI,EAAE,cAAc,CAAC;IACrB,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC;IAC9D,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,+BAqDA;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,UAAU,EACV,aAAa,EACb,aAAa,GACd,EAAE;IACD,QAAQ,EAAE,UAAU,EAAE,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IACjE,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,+BAqDA;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,WAAW,EACX,cAAc,EACd,cAAc,EACd,aAAqB,GACtB,EAAE;IACD,SAAS,EAAE,WAAW,EAAE,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnE,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,+BA8FA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,YAAY,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/B,+BA4CA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,MAAM,EACN,SAAS,GACV,EAAE;IACD,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;CACzE,+BAaA"}
+{"version":3,"file":"KlantFormSections.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantFormSections.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE9E,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAOtF;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,IAAI,EACJ,KAAK,GACN,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;CACf,+BAgBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACnC,QAAQ,EAAE,CAAC,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC;CAClD,+BAiBA;AAED,wBAAgB,sBAAsB,CAAC,EACrC,IAAI,EACJ,OAAO,EACP,KAAa,GACd,EAAE;IACD,IAAI,EAAE,cAAc,CAAC;IACrB,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC;IAC9D,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,+BA6EA;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,UAAU,EACV,aAAa,EACb,aAAa,GACd,EAAE;IACD,QAAQ,EAAE,UAAU,EAAE,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IACjE,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,+BAqDA;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,WAAW,EACX,cAAc,EACd,cAAc,EACd,aAAqB,GACtB,EAAE;IACD,SAAS,EAAE,WAAW,EAAE,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnE,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,+BA8FA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,YAAY,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/B,+BA4CA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,MAAM,EACN,SAAS,GACV,EAAE;IACD,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;CACzE,+BAaA"}

package/dist-lib/components/klanten/KlantFormSections.js

@@ -1,4 +1,4 @@
-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";
 import { Button, Input, Label, Textarea, Checkbox, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@flowselections/core";
 import { Building2, User, Plus, Trash2 } from "lucide-react";
 export function Field({ label, children }) {
@@ -14,7 +14,7 @@ export function SegmentToggle({ segment, onChange, }) {
     return (_jsxs("div", { className: "inline-flex rounded-lg border p-1 bg-muted/40", children: [_jsx(SegmentButton, { active: segment === "Business", onClick: () => onChange("Business"), icon: _jsx(Building2, { className: "w-4 h-4" }), label: "Zakelijk" }), _jsx(SegmentButton, { active: segment === "Private", onClick: () => onChange("Private"), icon: _jsx(User, { className: "w-4 h-4" }), label: "Particulier" })] }));
 }
 export function AlgemeneGegevensFields({ form, setForm, isNew = false, }) {
-    return (_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [isNew && (_jsx("p", { className: "text-xs text-muted-foreground md:col-span-2", children: "Het klantnummer wordt automatisch toegekend na het opslaan." })), _jsx(Field, { label: "Naam *", children: _jsx(Input, { value: form.name, onChange: (e) => setForm((f) => ({ ...f, name: e.target.value })), placeholder: "Bedrijf of persoonsnaam" }) }), _jsx(Field, { label: "Algemeen e-mailadres *", children: _jsx(Input, { type: "email", value: form.general_email ?? "", onChange: (e) => setForm((f) => ({ ...f, general_email: e.target.value })), placeholder: "info@voorbeeld.nl" }) }), _jsx(Field, { label: "Algemeen telefoonnummer *", children: _jsx(Input, { value: form.general_phone ?? "", onChange: (e) => setForm((f) => ({ ...f, general_phone: e.target.value })), placeholder: "+31 \u2026" }) }), _jsx("div", {}), _jsx(Field, { label: "Factuuradres \u2014 straat *", children: _jsx(Input, { value: form.billing_street ?? "", onChange: (e) => setForm((f) => ({ ...f, billing_street: e.target.value })) }) }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsx(Field, { label: "Postcode *", children: _jsx(Input, { value: form.billing_postcode ?? "", onChange: (e) => setForm((f) => ({ ...f, billing_postcode: e.target.value })) }) }), _jsx(Field, { label: "Plaats *", children: _jsx(Input, { value: form.billing_city ?? "", onChange: (e) => setForm((f) => ({ ...f, billing_city: e.target.value })) }) })] })] }));
+    return (_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [isNew && (_jsx("p", { className: "text-xs text-muted-foreground md:col-span-2", children: "Het klantnummer wordt automatisch toegekend na het opslaan." })), _jsx(Field, { label: "Naam *", children: _jsx(Input, { value: form.name, onChange: (e) => setForm((f) => ({ ...f, name: e.target.value })), placeholder: "Bedrijf of persoonsnaam" }) }), _jsx(Field, { label: "Algemeen e-mailadres *", children: _jsx(Input, { type: "email", value: form.general_email ?? "", onChange: (e) => setForm((f) => ({ ...f, general_email: e.target.value })), placeholder: "info@voorbeeld.nl" }) }), _jsx(Field, { label: "Algemeen telefoonnummer *", children: _jsx(Input, { value: form.general_phone ?? "", onChange: (e) => setForm((f) => ({ ...f, general_phone: e.target.value })), placeholder: "+31 \u2026" }) }), _jsx("div", {}), _jsx(Field, { label: "Factuuradres \u2014 straat *", children: _jsx(Input, { value: form.billing_street ?? "", onChange: (e) => setForm((f) => ({ ...f, billing_street: e.target.value })) }) }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsx(Field, { label: "Postcode *", children: _jsx(Input, { value: form.billing_postcode ?? "", onChange: (e) => setForm((f) => ({ ...f, billing_postcode: e.target.value })) }) }), _jsx(Field, { label: "Plaats *", children: _jsx(Input, { value: form.billing_city ?? "", onChange: (e) => setForm((f) => ({ ...f, billing_city: e.target.value })) }) })] }), form.segment === "Business" && (_jsxs(_Fragment, { children: [_jsx(Field, { label: form.vat_reverse_charge ? "Btw-identificatienummer *" : "Btw-identificatienummer", children: _jsx(Input, { value: form.vat_number ?? "", onChange: (e) => setForm((f) => ({ ...f, vat_number: e.target.value })), placeholder: "NL123456789B01" }) }), _jsxs("div", { className: "flex items-start gap-2 pt-6", children: [_jsx(Checkbox, { id: "vat-reverse-charge", checked: !!form.vat_reverse_charge, onCheckedChange: (v) => setForm((f) => ({ ...f, vat_reverse_charge: !!v })) }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "vat-reverse-charge", className: "text-sm", children: "Btw automatisch verleggen" }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Nieuwe facturen krijgen standaard \"btw verlegd\". Per factuur blijft dit aan te passen." })] })] })] }))] }));
 }
 export function ContactenFields({ contacts, addContact, updateContact, removeContact, }) {
     return (_jsxs("div", { className: "space-y-4", children: [_jsx("div", { className: "flex justify-end", children: _jsxs(Button, { size: "sm", variant: "outline", onClick: addContact, className: "gap-2", children: [_jsx(Plus, { className: "w-4 h-4" }), "Toevoegen"] }) }), contacts.length === 0 && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen contactpersonen." })), contacts.map((c, idx) => (_jsxs("div", { className: "border rounded-lg p-4 space-y-3 bg-muted/20", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-3", children: [_jsx(Field, { label: "Naam", children: _jsx(Input, { value: c.name, onChange: (e) => updateContact(idx, { name: e.target.value }) }) }), _jsx(Field, { label: "Functie", children: _jsx(Input, { value: c.role ?? "", onChange: (e) => updateContact(idx, { role: e.target.value }) }) }), _jsx(Field, { label: "Telefoon", children: _jsx(Input, { value: c.phone ?? "", onChange: (e) => updateContact(idx, { phone: e.target.value }) }) }), _jsx(Field, { label: "E-mail", children: _jsx(Input, { type: "email", value: c.email ?? "", onChange: (e) => updateContact(idx, { email: e.target.value }) }) })] }), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { size: "sm", variant: "ghost", onClick: () => removeContact(idx), className: "text-destructive gap-2", children: [_jsx(Trash2, { className: "w-4 h-4" }), "Verwijderen"] }) })] }, idx)))] }));

package/dist-lib/components/klanten/KlantNotitiesCard.d.ts

@@ -1,6 +1,7 @@
 interface Props {
     customerId: string;
+    onStatusChanged?: () => void;
 }
-export declare function KlantNotitiesCard({ customerId }: Props): import("react").JSX.Element;
+export declare function KlantNotitiesCard({ customerId, onStatusChanged }: Props): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=KlantNotitiesCard.d.ts.map

package/dist-lib/components/klanten/KlantNotitiesCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KlantNotitiesCard.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantNotitiesCard.tsx"],"names":[],"mappings":"AAsDA,UAAU,KAAK;IACb,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,UAAU,EAAE,EAAE,KAAK,+BAgLtD"}
+{"version":3,"file":"KlantNotitiesCard.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantNotitiesCard.tsx"],"names":[],"mappings":"AA6DA,UAAU,KAAK;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,iBAAiB,CAAC,EAAE,UAAU,EAAE,eAAe,EAAE,EAAE,KAAK,+BAuLvE"}

package/dist-lib/components/klanten/KlantNotitiesCard.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { Button, Card, CardContent, CardHeader, CardTitle, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Textarea, supabase, toast, } from "@flowselections/core";
 import { StickyNote, Trash2, Plus } from "lucide-react";
+import { KlantRisicoStatusCard } from "./KlantRisicoStatusCard";
 import { db } from "../../lib/itkClient";
 const TYPE_OPTIONS = [
     { value: "general", label: "Algemeen" },
@@ -10,15 +11,20 @@ const TYPE_OPTIONS = [
     { value: "visit", label: "Bezoek" },
     { value: "other", label: "Overig" },
 ];
+const TYPE_LABELS = {
+    general: "Algemeen", call: "Telefonisch", complaint: "Klacht", visit: "Bezoek", other: "Overig",
+    risk_status: "Klantstatus",
+};
 const TYPE_STYLE = {
     general: "bg-muted text-muted-foreground",
     call: "bg-blue-500/15 text-blue-400",
     complaint: "bg-red-500/15 text-red-400",
     visit: "bg-emerald-500/15 text-emerald-400",
     other: "bg-slate-500/15 text-slate-400",
+    risk_status: "bg-orange-500/15 text-orange-500",
 };
 function typeLabel(t) {
-    return TYPE_OPTIONS.find((o) => o.value === t)?.label ?? t;
+    return TYPE_LABELS[t] ?? t;
 }
 function formatDateTime(iso) {
     try {
@@ -34,7 +40,7 @@ function formatDateTime(iso) {
         return iso;
     }
 }
-export function KlantNotitiesCard({ customerId }) {
+export function KlantNotitiesCard({ customerId, onStatusChanged }) {
     const [notes, setNotes] = useState([]);
     const [authors, setAuthors] = useState({});
     const [loading, setLoading] = useState(true);
@@ -114,6 +120,9 @@ export function KlantNotitiesCard({ customerId }) {
         toast.success("Notitie verwijderd");
         void load();
     };
-    return (_jsxs(Card, { id: "notities", children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "text-base flex items-center gap-2", children: [_jsx(StickyNote, { className: "w-4 h-4" }), "Notities"] }) }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "border rounded-lg p-4 space-y-3 bg-muted/20", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-[200px_1fr] gap-3", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsx(Label, { className: "text-xs font-medium text-muted-foreground", children: "Type" }), _jsxs(Select, { value: noteType, onValueChange: (v) => setNoteType(v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: TYPE_OPTIONS.map((o) => (_jsx(SelectItem, { value: o.value, children: o.label }, o.value))) })] })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsx(Label, { className: "text-xs font-medium text-muted-foreground", children: "Notitie" }), _jsx(Textarea, { value: body, onChange: (e) => setBody(e.target.value), placeholder: "Bijv. Klant gebeld over aflever\u00ADafspraak\u2026", rows: 3 })] })] }), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { size: "sm", onClick: addNote, disabled: saving, className: "gap-2", children: [_jsx(Plus, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Toevoegen"] }) })] }), loading ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Laden\u2026" })) : notes.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen notities." })) : (_jsx("div", { className: "space-y-2", children: notes.map((n) => (_jsxs("div", { className: "border rounded-lg p-3", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx("span", { className: "text-xs px-2 py-0.5 rounded-full font-medium " +
+    return (_jsxs(Card, { id: "notities", children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "text-base flex items-center gap-2", children: [_jsx(StickyNote, { className: "w-4 h-4" }), "Notities"] }) }), _jsxs(CardContent, { className: "space-y-4", children: [_jsx(KlantRisicoStatusCard, { customerId: customerId, onChanged: () => {
+                            void load();
+                            onStatusChanged?.();
+                        } }), _jsxs("div", { className: "border rounded-lg p-4 space-y-3 bg-muted/20", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-[200px_1fr] gap-3", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsx(Label, { className: "text-xs font-medium text-muted-foreground", children: "Type" }), _jsxs(Select, { value: noteType, onValueChange: (v) => setNoteType(v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: TYPE_OPTIONS.map((o) => (_jsx(SelectItem, { value: o.value, children: o.label }, o.value))) })] })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsx(Label, { className: "text-xs font-medium text-muted-foreground", children: "Notitie" }), _jsx(Textarea, { value: body, onChange: (e) => setBody(e.target.value), placeholder: "Bijv. Klant gebeld over aflever\u00ADafspraak\u2026", rows: 3 })] })] }), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { size: "sm", onClick: addNote, disabled: saving, className: "gap-2", children: [_jsx(Plus, { className: "w-4 h-4" }), saving ? "Opslaan…" : "Toevoegen"] }) })] }), loading ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Laden\u2026" })) : notes.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen notities." })) : (_jsx("div", { className: "space-y-2", children: notes.map((n) => (_jsxs("div", { className: "border rounded-lg p-3", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx("span", { className: "text-xs px-2 py-0.5 rounded-full font-medium " +
                                                         TYPE_STYLE[n.note_type], children: typeLabel(n.note_type) }), _jsx("span", { className: "text-xs text-muted-foreground", children: formatDateTime(n.created_at) }), n.created_by && authors[n.created_by] && (_jsxs("span", { className: "text-xs text-muted-foreground", children: ["\u00B7 ", authors[n.created_by]] }))] }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => removeNote(n.id), className: "text-destructive gap-2 h-7", children: _jsx(Trash2, { className: "w-3.5 h-3.5" }) })] }), _jsx("p", { className: "text-sm text-foreground/90 mt-2 whitespace-pre-wrap", children: n.body })] }, n.id))) }))] })] }));
 }

package/dist-lib/components/klanten/KlantRisicoBanner.d.ts

@@ -0,0 +1,18 @@
+interface Props {
+    status: unknown;
+    reason?: string | null;
+    className?: string;
+}
+/** Waarschuwingsbalk voor Risicoklant / Geblokkeerd. Toont niets bij een normale klant. */
+export declare function KlantRisicoBanner({ status, reason, className }: Props): import("react").JSX.Element | null;
+export declare function KlantRisicoBadge({ status }: {
+    status: unknown;
+}): import("react").JSX.Element | null;
+/** Laadt de klantstatus zelf; handig in pop-up, klantpagina en andere modules. */
+export declare function KlantRisicoBannerById({ customerId, refreshKey, className }: {
+    customerId: string;
+    refreshKey?: number;
+    className?: string;
+}): import("react").JSX.Element | null;
+export {};
+//# sourceMappingURL=KlantRisicoBanner.d.ts.map

package/dist-lib/components/klanten/KlantRisicoBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KlantRisicoBanner.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantRisicoBanner.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAK;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,2FAA2F;AAC3F,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,SAAc,EAAE,EAAE,KAAK,sCAyB1E;AAED,wBAAgB,gBAAgB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,OAAO,CAAA;CAAE,sCAY/D;AAED,kFAAkF;AAClF,wBAAgB,qBAAqB,CAAC,EAAE,UAAU,EAAE,UAAc,EAAE,SAAS,EAAE,EAAE;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,sCAgB/I"}

package/dist-lib/components/klanten/KlantRisicoBanner.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { db } from "../../lib/itkClient";
+import { AlertTriangle, Ban } from "lucide-react";
+import { normalizeRiskStatus } from "../../lib/klantRules";
+/** Waarschuwingsbalk voor Risicoklant / Geblokkeerd. Toont niets bij een normale klant. */
+export function KlantRisicoBanner({ status, reason, className = "" }) {
+    const s = normalizeRiskStatus(status);
+    if (s === "none")
+        return null;
+    const blocked = s === "blocked";
+    const Icon = blocked ? Ban : AlertTriangle;
+    return (_jsxs("div", { role: "alert", className: `flex items-start gap-3 rounded-md border p-3 text-sm ${blocked
+            ? "border-destructive/40 bg-destructive/10 text-destructive"
+            : "border-orange-500/40 bg-orange-500/10 text-orange-700 dark:text-orange-300"} ${className}`, children: [_jsx(Icon, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "font-semibold", children: blocked
+                            ? "Geblokkeerd — geen nieuwe werkbonnen mogelijk"
+                            : "Risicoklant — let op bij nieuwe aanvragen" }), reason && _jsxs("p", { className: "mt-0.5 whitespace-pre-wrap text-foreground/80", children: ["Reden: ", reason] })] })] }));
+}
+export function KlantRisicoBadge({ status }) {
+    const s = normalizeRiskStatus(status);
+    if (s === "none")
+        return null;
+    return s === "blocked" ? (_jsx("span", { className: "ml-2 rounded-full bg-destructive/15 px-2 py-0.5 text-[10px] font-semibold text-destructive", children: "Geblokkeerd" })) : (_jsx("span", { className: "ml-2 rounded-full bg-orange-500/15 px-2 py-0.5 text-[10px] font-semibold text-orange-700 dark:text-orange-300", children: "Risicoklant" }));
+}
+/** Laadt de klantstatus zelf; handig in pop-up, klantpagina en andere modules. */
+export function KlantRisicoBannerById({ customerId, refreshKey = 0, className }) {
+    const [row, setRow] = useState(null);
+    useEffect(() => {
+        let alive = true;
+        void db
+            .from("itk_customers")
+            .select("risk_status, risk_reason")
+            .eq("id", customerId)
+            .maybeSingle()
+            .then(({ data }) => alive && setRow(data ?? null));
+        return () => {
+            alive = false;
+        };
+    }, [customerId, refreshKey]);
+    if (!row)
+        return null;
+    return _jsx(KlantRisicoBanner, { status: row.risk_status, reason: row.risk_reason, className: className });
+}

package/dist-lib/components/klanten/KlantRisicoStatusCard.d.ts

@@ -0,0 +1,7 @@
+interface Props {
+    customerId: string;
+    onChanged?: () => void;
+}
+export declare function KlantRisicoStatusCard({ customerId, onChanged }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=KlantRisicoStatusCard.d.ts.map

package/dist-lib/components/klanten/KlantRisicoStatusCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KlantRisicoStatusCard.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantRisicoStatusCard.tsx"],"names":[],"mappings":"AAmBA,UAAU,KAAK;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,wBAAgB,qBAAqB,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,KAAK,+BA2GrE"}

package/dist-lib/components/klanten/KlantRisicoStatusCard.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Button, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Textarea, supabase, toast, } from "@flowselections/core";
+import { ShieldAlert } from "lucide-react";
+import { db } from "../../lib/itkClient";
+import { CUSTOMER_RISK_LABELS } from "../../lib/statusConfig";
+import { normalizeRiskStatus, riskReasonMissing } from "../../lib/klantRules";
+import { KlantRisicoBanner } from "./KlantRisicoBanner";
+export function KlantRisicoStatusCard({ customerId, onChanged }) {
+    const [current, setCurrent] = useState({
+        status: "none",
+        reason: null,
+    });
+    const [status, setStatus] = useState("none");
+    const [reason, setReason] = useState("");
+    const [saving, setSaving] = useState(false);
+    const [failed, setFailed] = useState(false);
+    const load = async () => {
+        const { data, error } = await db
+            .from("itk_customers")
+            .select("risk_status, risk_reason")
+            .eq("id", customerId)
+            .maybeSingle();
+        if (error) {
+            setFailed(true);
+            return;
+        }
+        setFailed(false);
+        const s = normalizeRiskStatus(data?.risk_status);
+        setCurrent({ status: s, reason: data?.risk_reason ?? null });
+        setStatus(s);
+        setReason(data?.risk_reason ?? "");
+    };
+    useEffect(() => {
+        void load();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [customerId]);
+    const dirty = status !== current.status || (status !== "none" && reason.trim() !== (current.reason ?? ""));
+    const save = async () => {
+        if (riskReasonMissing(status, reason)) {
+            toast.error("Vul een interne reden in");
+            return;
+        }
+        setSaving(true);
+        try {
+            const { error } = await supabase.rpc("itk_set_customer_risk", {
+                _customer_id: customerId,
+                _status: status,
+                _reason: status === "none" ? null : reason.trim(),
+            });
+            if (error)
+                throw error;
+            toast.success("Klantstatus opgeslagen");
+            await load();
+            onChanged?.();
+        }
+        catch (e) {
+            toast.error(e?.message ?? "Opslaan mislukt");
+        }
+        finally {
+            setSaving(false);
+        }
+    };
+    return (_jsxs("div", { className: "space-y-3 rounded-lg border p-4", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-foreground", children: [_jsx(ShieldAlert, { className: "h-4 w-4" }), "Blacklist"] }), failed ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Blacklist-status kon niet geladen worden." })) : (_jsxs(_Fragment, { children: [_jsx(KlantRisicoBanner, { status: current.status, reason: current.reason }), _jsxs("div", { className: "grid grid-cols-1 gap-3 md:grid-cols-[200px_1fr]", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsx(Label, { className: "text-xs font-medium text-muted-foreground", children: "Status" }), _jsxs(Select, { value: status, onValueChange: (v) => setStatus(v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: Object.keys(CUSTOMER_RISK_LABELS).map((k) => (_jsx(SelectItem, { value: k, children: CUSTOMER_RISK_LABELS[k] }, k))) })] })] }), status !== "none" && (_jsxs("div", { className: "space-y-1.5", children: [_jsxs(Label, { className: "text-xs font-medium text-muted-foreground", children: ["Interne reden ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(Textarea, { value: reason, onChange: (e) => setReason(e.target.value), placeholder: "Bijv. Factuur na 3 herinneringen niet betaald", rows: 2 })] }))] }), _jsx("div", { className: "flex justify-end", children: _jsx(Button, { size: "sm", onClick: save, disabled: saving || !dirty, children: saving ? "Opslaan…" : "Status opslaan" }) })] }))] }));
+}

package/dist-lib/components/klanten/KlantStatsCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KlantStatsCard.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantStatsCard.tsx"],"names":[],"mappings":"AAIA,wBAAgB,cAAc,CAAC,EAAE,UAAU,EAAE,EAAE;IAAE,UAAU,EAAE,MAAM,CAAA;CAAE,+BA2CpE"}
+{"version":3,"file":"KlantStatsCard.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantStatsCard.tsx"],"names":[],"mappings":"AAwBA,wBAAgB,cAAc,CAAC,EAAE,UAAU,EAAE,EAAE;IAAE,UAAU,EAAE,MAAM,CAAA;CAAE,+BA0FpE"}

package/dist-lib/components/klanten/KlantStatsCard.js

@@ -1,7 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import { Euro, Wrench } from "lucide-react";
-import { fetchKlantStats, formatEuro, emptyStats } from "../../lib/klantStatsClient";
+import { CalendarClock, Clock, Euro, TrendingUp, Wrench } from "lucide-react";
+import { emptyStats, fetchKlantStats, formatEuro, } from "../../lib/klantStatsClient";
+import { berekenWinst } from "../../lib/klantRules";
+function Tile({ icon, label, children }) {
+    return (_jsxs("div", { className: "rounded-md border p-3 min-w-0", children: [_jsxs("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [icon, " ", label] }), children] }));
+}
+const big = "text-xl font-semibold text-foreground tabular-nums";
+const muted = "text-sm text-muted-foreground pt-1";
 export function KlantStatsCard({ customerId }) {
     const [stats, setStats] = useState(null);
     const [failed, setFailed] = useState(false);
@@ -17,5 +23,9 @@ export function KlantStatsCard({ customerId }) {
         };
     }, [customerId]);
     const placeholder = failed ? "Niet beschikbaar" : "…";
-    return (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "rounded-md border p-3", children: [_jsxs("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [_jsx(Euro, { className: "w-3.5 h-3.5" }), " Totale omzet"] }), _jsx("p", { className: stats ? "text-xl font-semibold text-foreground" : "text-sm text-muted-foreground pt-1", children: stats ? formatEuro(stats.omzetCents) : placeholder })] }), _jsxs("div", { className: "rounded-md border p-3", children: [_jsxs("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [_jsx(Wrench, { className: "w-3.5 h-3.5" }), " Aantal klussen"] }), _jsx("p", { className: stats ? "text-xl font-semibold text-foreground" : "text-sm text-muted-foreground pt-1", children: stats ? stats.klussen : placeholder }), stats && (_jsxs("p", { className: "text-xs text-muted-foreground", children: [stats.open, " open \u00B7 ", stats.bezig, " bezig \u00B7 ", stats.afgerond, " afgerond"] }))] })] }));
+    const winst = stats
+        ? berekenWinst({ omzetCents: stats.omzetCents, materiaalCents: stats.materiaalKostenCents, arbeidCents: stats.arbeidKostenCents })
+        : null;
+    const zonderLoon = stats?.monteursZonderLoon ?? [];
+    return (_jsx("div", { className: "space-y-3", children: _jsxs("div", { className: "grid grid-cols-2 lg:grid-cols-3 gap-3", children: [_jsx(Tile, { icon: _jsx(Euro, { className: "w-3.5 h-3.5" }), label: "Totale omzet", children: _jsx("p", { className: stats ? big : muted, children: stats ? formatEuro(stats.omzetCents) : placeholder }) }), _jsxs(Tile, { icon: _jsx(Wrench, { className: "w-3.5 h-3.5" }), label: "Aantal klussen", children: [_jsx("p", { className: stats ? big : muted, children: stats ? stats.klussen : placeholder }), stats && (_jsxs("p", { className: "text-xs text-muted-foreground", children: [stats.open, " open \u00B7 ", stats.bezig, " bezig \u00B7 ", stats.afgerond, " afgerond"] }))] }), _jsx(Tile, { icon: _jsx(Clock, { className: "w-3.5 h-3.5" }), label: "Te laat betaald", children: stats && stats.teLaat != null ? (_jsxs(_Fragment, { children: [_jsx("p", { className: stats.teLaat > 0 ? `${big} text-destructive` : big, children: stats.teLaat }), (stats.teLaatOpen ?? 0) > 0 && (_jsxs("p", { className: "text-xs text-muted-foreground", children: ["waarvan ", stats.teLaatOpen, " nog open"] }))] })) : (_jsx("p", { className: muted, children: stats ? "n.b." : placeholder })) }), _jsx(Tile, { icon: _jsx(CalendarClock, { className: "w-3.5 h-3.5" }), label: "Gem. betaaltermijn", children: stats && stats.gemBetaaltermijnDagen != null ? (_jsxs("p", { className: big, children: [Math.round(stats.gemBetaaltermijnDagen), " ", Math.round(stats.gemBetaaltermijnDagen) === 1 ? "dag" : "dagen"] })) : (_jsx("p", { className: muted, children: stats ? "n.b." : placeholder })) }), _jsxs("div", { className: "col-span-2 rounded-md border p-3 min-w-0", children: [_jsx("div", { className: "flex items-center justify-between gap-2", children: _jsxs("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [_jsx(TrendingUp, { className: "w-3.5 h-3.5" }), " Winstgevendheid"] }) }), winst ? (_jsxs(_Fragment, { children: [_jsxs("p", { className: winst.winstCents < 0 ? `${big} text-destructive` : big, children: [formatEuro(winst.winstCents), winst.marge != null && (_jsxs("span", { className: "ml-2 text-sm font-normal text-muted-foreground", children: [Math.round(winst.marge * 100), "%"] }))] }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Kosten ", formatEuro(winst.kostenCents), ": materialen ", formatEuro(winst.materiaalCents), " \u00B7 uren en reistijd", " ", formatEuro(winst.arbeidCents), " (uurloon per monteur)"] }), zonderLoon.length > 0 && (_jsxs("p", { className: "text-xs text-destructive", children: ["Uurloon ontbreekt voor: ", zonderLoon.join(", ")] }))] })) : (_jsx("p", { className: muted, children: !stats ? placeholder : "Stel uurlonen in bij de urenregistratie" }))] })] }) }));
 }

package/dist-lib/components/klanten/KlantenTrendCard.d.ts

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

package/dist-lib/components/klanten/KlantenTrendCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KlantenTrendCard.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/KlantenTrendCard.tsx"],"names":[],"mappings":"AA4DA,wBAAgB,gBAAgB,gCAqD/B"}

package/dist-lib/components/klanten/KlantenTrendCard.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Card, CardContent } from "@flowselections/core";
+import { TrendingDown, TrendingUp } from "lucide-react";
+import { fetchMonthTrend, formatEuro } from "../../lib/klantStatsClient";
+import { berekenWinst, projectMonth, trend } from "../../lib/klantRules";
+const pad = (n) => String(n).padStart(2, "0");
+const isoLocal = (d) => `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
+const monthLabel = (iso) => new Intl.DateTimeFormat("nl-NL", { month: "short", year: "numeric" }).format(new Date(`${iso}T12:00:00`));
+function winstVan(p) {
+    return berekenWinst({ omzetCents: p.omzetCents, materiaalCents: p.materiaalKostenCents, arbeidCents: p.arbeidKostenCents })?.winstCents ?? null;
+}
+function TrendTile({ titel, vorig, verwachting, vorigLabel, nuLabel, melding, }) {
+    const ok = melding == null && vorig != null && verwachting != null;
+    const t = ok ? trend(verwachting, vorig) : null;
+    const up = (t?.verschilCents ?? 0) >= 0;
+    const Icon = up ? TrendingUp : TrendingDown;
+    return (_jsx(Card, { children: _jsxs(CardContent, { className: "p-4 space-y-1", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("h3", { className: "text-sm font-medium text-muted-foreground", children: titel }), t && t.procent != null && (_jsxs("span", { className: `inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-semibold tabular-nums ${up ? "bg-[var(--success-soft)] text-[var(--success-soft-foreground)]" : "bg-destructive/10 text-destructive"}`, children: [_jsx(Icon, { className: "w-3.5 h-3.5" }), up ? "+" : "−", Math.abs(Math.round(t.procent * 100)), "%"] })), t && t.procent == null && _jsx("span", { className: "text-xs text-muted-foreground", children: "geen vergelijking" })] }), ok ? (_jsxs(_Fragment, { children: [_jsx("p", { className: "text-2xl font-semibold text-foreground tabular-nums", children: formatEuro(verwachting) }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Verwachting ", nuLabel] }), _jsxs("p", { className: "pt-2 text-sm text-muted-foreground tabular-nums", children: [vorigLabel, ": ", _jsx("span", { className: "text-foreground", children: formatEuro(vorig) })] }), _jsxs("p", { className: `text-sm tabular-nums ${up ? "text-[var(--success-text)]" : "text-destructive"}`, children: [up ? "+" : "−", " ", formatEuro(Math.abs(t.verschilCents)), " t.o.v. vorig jaar"] })] })) : (_jsx("p", { className: "pt-2 text-sm text-muted-foreground", children: melding }))] }) }));
+}
+export function KlantenTrendCard() {
+    const [data, setData] = useState(null);
+    const [failed, setFailed] = useState(false);
+    const today = new Date();
+    useEffect(() => {
+        let active = true;
+        fetchMonthTrend(isoLocal(new Date()))
+            .then((d) => active && setData(d))
+            .catch(() => active && setFailed(true));
+        return () => {
+            active = false;
+        };
+    }, []);
+    const dag = today.getDate();
+    const dagen = new Date(today.getFullYear(), today.getMonth() + 1, 0).getDate();
+    if (failed)
+        return _jsx("p", { className: "text-sm text-muted-foreground", children: "Maandvergelijking niet beschikbaar" });
+    if (!data)
+        return _jsx("p", { className: "text-sm text-muted-foreground", children: "Maandvergelijking laden\u2026" });
+    const omzetNu = projectMonth(data.nu.omzetCents, dag, dagen);
+    const omzetVorig = data.vorigJaar.omzetCents;
+    const wNuRaw = winstVan(data.nu);
+    const wNuKosten = wNuRaw == null ? null : data.nu.omzetCents - wNuRaw;
+    const winstNu = wNuKosten == null ? null : omzetNu - projectMonth(wNuKosten, dag, dagen);
+    const winstVorig = winstVan(data.vorigJaar);
+    const zonderLoon = Array.from(new Set([...data.nu.monteursZonderLoon, ...data.vorigJaar.monteursZonderLoon]));
+    const vorigLabel = monthLabel(data.vorigJaar.van);
+    const nuLabel = monthLabel(data.nu.van);
+    const winstMelding = winstNu != null && winstVorig != null
+        ? undefined
+        : "Stel uurlonen in bij de urenregistratie";
+    return (_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: [_jsx(TrendTile, { titel: "Omzet", vorig: omzetVorig, verwachting: omzetNu, vorigLabel: vorigLabel, nuLabel: nuLabel }), _jsx(TrendTile, { titel: "Winst", vorig: winstVorig ?? undefined, verwachting: winstNu ?? undefined, vorigLabel: vorigLabel, nuLabel: nuLabel, melding: winstMelding })] }), _jsxs("p", { className: "text-xs text-muted-foreground", children: [zonderLoon.length > 0 && _jsxs("span", { className: "text-destructive", children: ["Uurloon ontbreekt voor: ", zonderLoon.join(", "), ". "] }), "Verwachting = stand t/m vandaag (", dag, " van ", dagen, " dagen) doorgetrokken naar de hele maand, vergeleken met dezelfde maand vorig jaar. Alle klanten samen."] })] }));
+}

package/dist-lib/components/klanten/useKlantForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useKlantForm.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/useKlantForm.ts"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,QAAQ,EACb,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,YAAY,EAElB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,MAAM,cAAc,GAAG,IAAI,CAC/B,QAAQ,EACR,IAAI,GAAG,YAAY,GAAG,YAAY,GAAG,iBAAiB,CACvD,CAAC;AACF,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,aAAa,CAAC,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACrF,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,GAAG,aAAa,CAAC,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAErF,eAAO,MAAM,aAAa,EAAE,cAS3B,CAAC;AAEF,UAAU,OAAO;IACf,uCAAuC;IACvC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,YAAY,CAAC,EAC3B,UAAU,EACV,OAAc,EACd,OAAO,EACP,SAAS,EACT,UAAU,GACX,EAAE,OAAO;;;;;;;;;yBA2EoB,MAAM,SAAS,OAAO,CAAC,UAAU,CAAC;yBAElC,MAAM;;;0BAgBL,MAAM,SAAS,OAAO,CAAC,WAAW,CAAC;0BAEnC,MAAM;;;;;;;EA0IpC"}
+{"version":3,"file":"useKlantForm.d.ts","sourceRoot":"","sources":["../../../src/components/klanten/useKlantForm.ts"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,QAAQ,EACb,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,YAAY,EAElB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,MAAM,cAAc,GAAG,IAAI,CAC/B,QAAQ,EACR,IAAI,GAAG,YAAY,GAAG,YAAY,GAAG,iBAAiB,CACvD,CAAC;AACF,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,aAAa,CAAC,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACrF,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,GAAG,aAAa,CAAC,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAErF,eAAO,MAAM,aAAa,EAAE,cAW3B,CAAC;AAEF,UAAU,OAAO;IACf,uCAAuC;IACvC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,YAAY,CAAC,EAC3B,UAAU,EACV,OAAc,EACd,OAAO,EACP,SAAS,EACT,UAAU,GACX,EAAE,OAAO;;;;;;;;;yBA6EoB,MAAM,SAAS,OAAO,CAAC,UAAU,CAAC;yBAElC,MAAM;;;0BAgBL,MAAM,SAAS,OAAO,CAAC,WAAW,CAAC;0BAEnC,MAAM;;;;;;;EAiJpC"}

package/dist-lib/components/klanten/useKlantForm.js

@@ -1,4 +1,4 @@
-import { missingRequiredFields } from "../../lib/klantRules";
+import { missingRequiredFields, vatReverseChargeError } from "../../lib/klantRules";
 import { useCallback, useEffect, useState } from "react";
 import { toast } from "@flowselections/core";
 import { db, } from "../../lib/itkClient";
@@ -11,6 +11,8 @@ export const emptyCustomer = {
     general_email: "",
     general_phone: "",
     legacy_customer_id: null,
+    vat_number: "",
+    vat_reverse_charge: false,
 };
 export function useKlantForm({ customerId, enabled = true, onSaved, onDeleted, onNotFound, }) {
     const isNew = !customerId || customerId === "nieuw";
@@ -56,6 +58,8 @@ export function useKlantForm({ customerId, enabled = true, onSaved, onDeleted, o
             general_email: c.general_email ?? "",
             general_phone: c.general_phone ?? "",
             legacy_customer_id: c.legacy_customer_id ?? null,
+            vat_number: c.vat_number ?? "",
+            vat_reverse_charge: !!c.vat_reverse_charge,
         });
         setCustomerNumber(c.customer_number ?? null);
         setContacts(Array.isArray(cons.data) ? cons.data : []);
@@ -107,6 +111,11 @@ export function useKlantForm({ customerId, enabled = true, onSaved, onDeleted, o
             toast.error(`Vul de verplichte velden in: ${missing.join(", ")}`);
             return;
         }
+        const vatErr = vatReverseChargeError(form);
+        if (vatErr) {
+            toast.error(vatErr);
+            return;
+        }
         setSaving(true);
         try {
             let newId = customerId;
@@ -118,6 +127,8 @@ export function useKlantForm({ customerId, enabled = true, onSaved, onDeleted, o
                 billing_street: form.billing_street?.trim() || null,
                 billing_city: form.billing_city?.trim() || null,
                 billing_postcode: form.billing_postcode?.trim() || null,
+                vat_number: form.vat_number?.trim() || null,
+                vat_reverse_charge: form.segment === "Business" ? !!form.vat_reverse_charge : false,
             };
             if (isNew) {
                 const { data, error } = await db

package/dist-lib/index.d.ts

@@ -2,6 +2,7 @@ import type { FlowModule } from "@flowselections/core";
 export * from "./_core-safelist";
 export { KlantenListPage as KlantenListPagePlanner } from "./components/KlantenListPage";
 export { KlantenDetailPage as KlantenDetailPagePlanner } from "./components/KlantenDetailPage";
+export { KlantRisicoBanner, KlantRisicoBannerById, KlantRisicoBadge } from "./components/klanten/KlantRisicoBanner";
 export { WerkbonDetailPage as WerkbonDetailPagePlanner } from "./components/WerkbonDetailPage";
 export declare const klantenInstallatieTechniekPlannerModule: FlowModule;
 export declare const KlantenInstallatieTechniekPlanner: FlowModule;

package/dist-lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,eAAe,IAAI,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AACzF,OAAO,EAAE,iBAAiB,IAAI,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC/F,OAAO,EAAE,iBAAiB,IAAI,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAE/F,eAAO,MAAM,uCAAuC,EAAE,UAUrD,CAAC;AAGF,eAAO,MAAM,iCAAiC,YAA0C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,eAAe,IAAI,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AACzF,OAAO,EAAE,iBAAiB,IAAI,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC/F,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AACpH,OAAO,EAAE,iBAAiB,IAAI,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAE/F,eAAO,MAAM,uCAAuC,EAAE,UAUrD,CAAC;AAGF,eAAO,MAAM,iCAAiC,YAA0C,CAAC"}