@flowselections/dashboard-erp-kwekers 1.0.1

package/dist-lib/_core-safelist.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=_core-safelist.d.ts.map

package/dist-lib/_core-safelist.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"_core-safelist.d.ts","sourceRoot":"","sources":["../src/_core-safelist.ts"],"names":[],"mappings":"AAgBA,OAAO,EAAE,CAAC"}

package/dist-lib/_core-safelist.js

@@ -0,0 +1,15 @@
+// Forceert Tailwind classes die uit @flowselections/core komen maar niet
+// voorkomen in de eigen broncode van deze module.
+// Zonder dit bestand worden deze classes weggeoptimaliseerd op de
+// Lovable productie build.
+const _safelist = [
+    // Layout — Sidebar en shell structuur
+    'h-full', 'flex-col', 'flex-1', 'min-h-screen', 'ml-64', 'pt-16',
+    'items-start', 'items-center', 'justify-between', 'border-t',
+    'w-64', 'h-screen', 'h-20', 'overflow-y-auto',
+    // Grid — InstellingenPage
+    'grid', 'lg:grid-cols-2', 'gap-6', 'p-6', 'space-y-6',
+    // Toggle/Switch — aan/uit zichtbaarheid
+    'data-[state=checked]:bg-primary', 'data-[state=unchecked]:bg-input',
+];
+export {};

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

@@ -0,0 +1,6 @@
+interface Props {
+    className?: string;
+}
+export declare function DashboardErpLogo({ className }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=DashboardErpLogo.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardErpLogo.d.ts","sourceRoot":"","sources":["../../src/components/DashboardErpLogo.tsx"],"names":[],"mappings":"AAAA,UAAU,KAAK;IAAG,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE;AAEtC,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,EAAE,KAAK,+BASpD"}

package/dist-lib/components/DashboardErpLogo.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function DashboardErpLogo({ className }) {
+    return (_jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, "aria-hidden": "true", children: [_jsx("rect", { width: "40", height: "40", rx: "8", fill: "currentColor", opacity: "0.12" }), _jsx("path", { d: "M10 28V18l5-4 5 4v10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M22 28V12l4-3 4 3v16", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M6 30h28", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })] }));
+}

package/dist-lib/components/dashboard/AiSettingsCard.d.ts

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

package/dist-lib/components/dashboard/AiSettingsCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiSettingsCard.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/AiSettingsCard.tsx"],"names":[],"mappings":"AAuCA,wBAAgB,cAAc,gCAuG7B"}

package/dist-lib/components/dashboard/AiSettingsCard.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CardContent, CardHeader, CardTitle, Switch, Checkbox, Button } from '@flowselections/core';
+import { Sparkles } from 'lucide-react';
+import { useAiSettings, } from '../../lib/aiSettings';
+const TYPE_LABELS = {
+    dashboard: { label: 'Dashboard-samenvattingen', example: '"De omzet stijgt met 12% t.o.v. de vorige periode."' },
+    voorraad: { label: 'Voorraad-samenvattingen', example: '"5 producten dreigen binnen 7 dagen uitverkocht te raken."' },
+    verkoop: { label: 'Verkoop-samenvattingen', example: '"Productgroep Kamerplanten laat de grootste groei zien."' },
+    klanten: { label: 'Klant-samenvattingen', example: '"3 klanten hebben deze maand aanzienlijk minder besteld."' },
+    forecast: { label: 'Forecast-samenvattingen', example: '"Op basis van de huidige trend wordt 8% omzetgroei verwacht."' },
+    risico: { label: 'Risico-meldingen', example: '"Voorraad van productgroep X raakt binnen 14 dagen op."' },
+    dagelijks: { label: 'Dagelijkse samenvatting', example: 'Elke dag een korte stand van zaken.' },
+    wekelijks: { label: 'Wekelijkse samenvatting', example: 'Elke week een overzicht van trends.' },
+    maandelijks: { label: 'Maandelijkse samenvatting', example: 'Elke maand een uitgebreide analyse.' },
+};
+const FOCUS_LABELS = {
+    omzet: 'Omzet', voorraad: 'Voorraad', orders: 'Orders', klanten: 'Klanten',
+    producten: 'Producten', inkoop: 'Inkoop', leveranciers: 'Leveranciers',
+    forecasts: 'Forecasts', risicos: "Risico's", marge: 'Winst & marge',
+};
+const DETAILS = [
+    { id: 'kort', label: 'Kort', hint: '1 tot 3 regels' },
+    { id: 'normaal', label: 'Normaal', hint: 'Korte managementsamenvatting' },
+    { id: 'uitgebreid', label: 'Uitgebreid', hint: 'Volledige analyse met aanbevelingen' },
+];
+const PERSONALITIES = [
+    { id: 'zakelijk', label: 'Zakelijk' },
+    { id: 'management', label: 'Management' },
+    { id: 'operationeel', label: 'Operationeel' },
+    { id: 'kort', label: 'Kort & bondig' },
+    { id: 'advies', label: 'Adviesgericht' },
+    { id: 'analytisch', label: 'Analytisch' },
+];
+export function AiSettingsCard() {
+    const [s, set] = useAiSettings();
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "flex items-center gap-2", children: [_jsx(Sparkles, { className: "w-4 h-4 text-primary" }), " AI-samenvattingen"] }) }), _jsxs(CardContent, { className: "space-y-6", children: [_jsxs("div", { className: "flex items-center justify-between rounded-lg border p-3", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium text-sm", children: "AI-samenvattingen inschakelen" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Wanneer uit: geen samenvattingen, analyses of automatische inzichten." })] }), _jsx(Switch, { checked: s.enabled, onCheckedChange: (v) => set({ ...s, enabled: !!v }) })] }), _jsxs("div", { className: s.enabled ? '' : 'opacity-50 pointer-events-none', children: [_jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "text-sm font-medium", children: "Soorten samenvattingen" }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-2", children: Object.keys(TYPE_LABELS).map((k) => (_jsxs("label", { className: "flex items-start gap-3 rounded-md border p-3 cursor-pointer", children: [_jsx(Switch, { checked: s.types[k], onCheckedChange: (v) => set({ ...s, types: { ...s.types, [k]: !!v } }) }), _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-sm font-medium", children: TYPE_LABELS[k].label }), _jsx("div", { className: "text-xs text-muted-foreground italic", children: TYPE_LABELS[k].example })] })] }, k))) })] }), _jsxs("div", { className: "space-y-2 mt-6", children: [_jsx("div", { className: "text-sm font-medium", children: "Detailniveau" }), _jsx("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-2", children: DETAILS.map((d) => (_jsxs(Button, { type: "button", variant: s.detail === d.id ? 'default' : 'outline', onClick: () => set({ ...s, detail: d.id }), className: "h-auto py-3 flex flex-col items-start", children: [_jsx("span", { className: "font-medium", children: d.label }), _jsx("span", { className: "text-xs opacity-80", children: d.hint })] }, d.id))) })] }), _jsxs("div", { className: "space-y-2 mt-6", children: [_jsx("div", { className: "text-sm font-medium", children: "Focusgebieden" }), _jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-5 gap-2", children: Object.keys(FOCUS_LABELS).map((k) => (_jsxs("label", { className: "flex items-center gap-2 rounded-md border p-2 cursor-pointer", children: [_jsx(Checkbox, { checked: s.focus[k], onCheckedChange: (v) => set({ ...s, focus: { ...s.focus, [k]: !!v } }) }), _jsx("span", { className: "text-sm", children: FOCUS_LABELS[k] })] }, k))) })] }), _jsxs("div", { className: "space-y-2 mt-6", children: [_jsx("div", { className: "text-sm font-medium", children: "AI-persoonlijkheid" }), _jsx("div", { className: "flex flex-wrap gap-2", children: PERSONALITIES.map((p) => (_jsx(Button, { type: "button", size: "sm", variant: s.personality === p.id ? 'default' : 'outline', onClick: () => set({ ...s, personality: p.id }), children: p.label }, p.id))) })] }), _jsx("p", { className: "text-xs text-muted-foreground mt-6", children: "Tip: per dashboard kun je de AI-samenvatting tonen of verbergen via het oogje rechtsboven de samenvatting." })] })] })] }));
+}

package/dist-lib/components/dashboard/AlertHistoryPanel.d.ts

@@ -0,0 +1,4 @@
+export declare function AlertHistoryPanel({ pageId }: {
+    pageId: string;
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=AlertHistoryPanel.d.ts.map

package/dist-lib/components/dashboard/AlertHistoryPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertHistoryPanel.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/AlertHistoryPanel.tsx"],"names":[],"mappings":"AAUA,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,sCAuC/D"}

package/dist-lib/components/dashboard/AlertHistoryPanel.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CardContent, CardHeader, CardTitle, Button, Badge } from '@flowselections/core';
+import { Bell, Check, Trash2 } from 'lucide-react';
+import { useAlertEvents } from '../../hooks/useAlertEvents';
+const SEV_COLOR = {
+    info: 'bg-blue-500/15 text-blue-700 dark:text-blue-300 border-blue-500/30',
+    warning: 'bg-amber-500/15 text-amber-700 dark:text-amber-300 border-amber-500/30',
+    critical: 'bg-destructive/15 text-destructive border-destructive/30',
+};
+export function AlertHistoryPanel({ pageId }) {
+    const { events, loading, acknowledge, remove } = useAlertEvents(pageId);
+    const open = events.filter(e => !e.acknowledged);
+    if (loading)
+        return null;
+    if (!events.length)
+        return null;
+    return (_jsxs(Card, { className: "mb-4 mx-2", children: [_jsx(CardHeader, { className: "pb-2 flex flex-row items-center justify-between space-y-0", children: _jsxs(CardTitle, { className: "text-sm font-medium flex items-center gap-2", children: [_jsx(Bell, { className: "w-4 h-4" }), " Alert-historie", open.length > 0 && _jsxs(Badge, { variant: "destructive", className: "ml-1", children: [open.length, " open"] })] }) }), _jsx(CardContent, { className: "space-y-2 max-h-64 overflow-auto", children: events.map(ev => (_jsxs("div", { className: `flex items-center justify-between gap-2 rounded border p-2 text-xs ${SEV_COLOR[ev.severity] ?? ''} ${ev.acknowledged ? 'opacity-60' : ''}`, children: [_jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("div", { className: "font-medium truncate", children: ev.message || 'Drempel overschreden' }), _jsxs("div", { className: "opacity-70", children: ["Waarde ", ev.value ?? '—', " \u00B7 drempel ", ev.threshold ?? '—', " \u00B7 ", new Date(ev.created_at).toLocaleString('nl-NL')] })] }), _jsxs("div", { className: "flex items-center gap-1 shrink-0", children: [!ev.acknowledged && (_jsx(Button, { size: "icon", variant: "ghost", className: "h-6 w-6", onClick: () => acknowledge(ev.id), title: "Markeer als gezien", children: _jsx(Check, { className: "w-3.5 h-3.5" }) })), _jsx(Button, { size: "icon", variant: "ghost", className: "h-6 w-6", onClick: () => remove(ev.id), title: "Verwijderen", children: _jsx(Trash2, { className: "w-3.5 h-3.5" }) })] })] }, ev.id))) })] }));
+}

package/dist-lib/components/dashboard/BlockEditorDialog.d.ts

@@ -0,0 +1,15 @@
+import type { AnyBlockConfig, BlockRow, BlockType, BlockPermissions } from './types';
+interface Props {
+    open: boolean;
+    onOpenChange: (v: boolean) => void;
+    initial?: BlockRow | null;
+    onSave: (input: {
+        type: BlockType;
+        title: string;
+        config: AnyBlockConfig;
+        permissions: BlockPermissions;
+    }) => void | Promise<void>;
+}
+export declare function BlockEditorDialog({ open, onOpenChange, initial, onSave }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=BlockEditorDialog.d.ts.map

package/dist-lib/components/dashboard/BlockEditorDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockEditorDialog.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/BlockEditorDialog.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAsF,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEzK,UAAU,KAAK;IACb,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAC1B,MAAM,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,SAAS,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,cAAc,CAAC;QAAC,WAAW,EAAE,gBAAgB,CAAA;KAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACpI;AAcD,wBAAgB,iBAAiB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,+BA8X/E"}

package/dist-lib/components/dashboard/BlockEditorDialog.js

@@ -0,0 +1,89 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, Button, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Textarea, toast, Switch, } from '@flowselections/core';
+import { Sparkles, Loader2 } from 'lucide-react';
+import { useServerFn } from '@tanstack/react-start';
+import { useSchema } from '../../hooks/useSchema';
+import { proposeBlockConfig } from '../../lib/ai-insights.functions';
+const AGGS = ['count', 'sum', 'avg', 'min', 'max'];
+const TYPES = [
+    { value: 'kpi', label: 'KPI' },
+    { value: 'table', label: 'Tabel' },
+    { value: 'chart', label: 'Grafiek' },
+    { value: 'ai_analysis', label: 'AI Analyse' },
+    { value: 'forecast', label: 'Forecast' },
+    { value: 'alert', label: 'Alert' },
+];
+const OPERATORS = ['>', '>=', '<', '<=', '==', '!='];
+export function BlockEditorDialog({ open, onOpenChange, initial, onSave }) {
+    const { tables, loading } = useSchema();
+    const [type, setType] = useState(initial?.type ?? 'kpi');
+    const [title, setTitle] = useState(initial?.title ?? '');
+    const [config, setConfig] = useState(initial?.config ?? { table: '', agg: 'count' });
+    const [aiPrompt, setAiPrompt] = useState('');
+    const [aiBusy, setAiBusy] = useState(false);
+    const [permissions, setPermissions] = useState(initial?.permissions ?? { can_view_ai: true, can_edit: true });
+    const propose = useServerFn(proposeBlockConfig);
+    useEffect(() => {
+        if (open) {
+            setType(initial?.type ?? 'kpi');
+            setTitle(initial?.title ?? '');
+            setConfig(initial?.config ?? { table: '', agg: 'count' });
+            setPermissions(initial?.permissions ?? { can_view_ai: true, can_edit: true });
+        }
+    }, [open, initial]);
+    const tableNames = useMemo(() => tables.map(t => t.name), [tables]);
+    const currentCols = useMemo(() => {
+        const t = tables.find(t => t.name === config.table);
+        return t?.columns ?? [];
+    }, [tables, config]);
+    function patchCfg(p) {
+        setConfig(prev => ({ ...prev, ...p }));
+    }
+    function handleTypeChange(v) {
+        setType(v);
+        const t = config.table ?? '';
+        if (v === 'kpi')
+            setConfig({ table: t, agg: 'count' });
+        if (v === 'table')
+            setConfig({ table: t, columns: [], limit: 50 });
+        if (v === 'chart')
+            setConfig({ kind: 'line', table: t, xColumn: '', yColumn: '', agg: 'sum', limit: 100 });
+        if (v === 'ai_analysis')
+            setConfig({ table: t, columns: [], limit: 100 });
+        if (v === 'forecast')
+            setConfig({ table: t, xColumn: '', yColumn: '', agg: 'sum', horizon: 6, history: 200 });
+        if (v === 'alert')
+            setConfig({ table: t, agg: 'count', operator: '>', threshold: 0, severity: 'warning' });
+    }
+    async function generateWithAi() {
+        if (!aiPrompt.trim())
+            return;
+        setAiBusy(true);
+        try {
+            const res = await propose({ data: { prompt: aiPrompt, schema: tables } });
+            if (!res.proposal) {
+                toast.error(res.note || 'Geen voorstel');
+                return;
+            }
+            const p = res.proposal;
+            if (p.type)
+                setType(p.type);
+            if (p.title)
+                setTitle(p.title);
+            if (p.config)
+                setConfig(p.config);
+            toast.success('Voorstel ingevuld — pas aan en sla op');
+        }
+        catch (e) {
+            toast.error('Fout: ' + (e?.message ?? 'onbekend'));
+        }
+        finally {
+            setAiBusy(false);
+        }
+    }
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-w-2xl", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: initial ? 'Blok bewerken' : 'Nieuw blok' }) }), !initial && (_jsxs("div", { className: "rounded-lg border border-primary/30 bg-primary/5 p-3 space-y-2", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-primary", children: [_jsx(Sparkles, { className: "w-4 h-4" }), " Genereer met AI"] }), _jsx(Textarea, { value: aiPrompt, onChange: (e) => setAiPrompt(e.target.value), placeholder: "bijv. Toon een staafgrafiek van de omzet per maand uit tabel orders", rows: 2 }), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { size: "sm", onClick: generateWithAi, disabled: aiBusy || !aiPrompt.trim(), children: [aiBusy ? _jsx(Loader2, { className: "w-3.5 h-3.5 mr-2 animate-spin" }) : _jsx(Sparkles, { className: "w-3.5 h-3.5 mr-2" }), "Voorstel maken"] }) })] })), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Type" }), _jsxs(Select, { value: type, onValueChange: (v) => handleTypeChange(v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: TYPES.map(t => _jsx(SelectItem, { value: t.value, children: t.label }, t.value)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Titel" }), _jsx(Input, { value: title, onChange: (e) => setTitle(e.target.value), placeholder: "bijv. Aantal orders" })] }), _jsxs("div", { className: "space-y-2 col-span-2", children: [_jsx(Label, { children: "Tabel (databron)" }), _jsxs(Select, { value: config.table ?? '', onValueChange: (v) => patchCfg({ table: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: loading ? 'Laden…' : 'Kies een tabel' }) }), _jsx(SelectContent, { className: "max-h-72", children: tableNames.map(n => _jsx(SelectItem, { value: n, children: n }, n)) })] })] }), type === 'kpi' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Aggregatie" }), _jsxs(Select, { value: config.agg, onValueChange: (v) => patchCfg({ agg: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: AGGS.map(a => _jsx(SelectItem, { value: a, children: a.toUpperCase() }, a)) })] })] }), config.agg !== 'count' && (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Kolom" }), _jsxs(Select, { value: config.column ?? '', onValueChange: (v) => patchCfg({ column: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies kolom" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] })), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Formaat" }), _jsxs(Select, { value: config.format ?? 'number', onValueChange: (v) => patchCfg({ format: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "number", children: "Getal" }), _jsx(SelectItem, { value: "currency", children: "\u20AC Bedrag" }), _jsx(SelectItem, { value: "percent", children: "Percentage" })] })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Subtitel" }), _jsx(Input, { value: config.subtitle ?? '', onChange: (e) => patchCfg({ subtitle: e.target.value }) })] })] })), type === 'table' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-2 col-span-2", children: [_jsx(Label, { children: "Kolommen (komma-gescheiden, leeg = alles)" }), _jsx(Input, { value: (config.columns ?? []).join(','), onChange: (e) => patchCfg({ columns: e.target.value.split(',').map(s => s.trim()).filter(Boolean) }), placeholder: "bijv. id,name,created_at" })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Sorteer op" }), _jsxs(Select, { value: config.orderBy ?? '', onValueChange: (v) => patchCfg({ orderBy: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kolom" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Limiet" }), _jsx(Input, { type: "number", value: config.limit ?? 50, onChange: (e) => patchCfg({ limit: Number(e.target.value) }) })] })] })), type === 'chart' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Soort" }), _jsxs(Select, { value: config.kind, onValueChange: (v) => patchCfg({ kind: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "line", children: "Lijn" }), _jsx(SelectItem, { value: "bar", children: "Staaf" }), _jsx(SelectItem, { value: "area", children: "Vlak" }), _jsx(SelectItem, { value: "stacked-bar", children: "Gestapelde staaf" }), _jsx(SelectItem, { value: "pie", children: "Taart" }), _jsx(SelectItem, { value: "donut", children: "Donut" }), _jsx(SelectItem, { value: "scatter", children: "Scatter" }), _jsx(SelectItem, { value: "heatmap", children: "Heatmap" }), _jsx(SelectItem, { value: "funnel", children: "Funnel" })] })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Aggregatie (Y)" }), _jsxs(Select, { value: config.agg, onValueChange: (v) => patchCfg({ agg: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: AGGS.map(a => _jsx(SelectItem, { value: a, children: a.toUpperCase() }, a)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "X-as kolom" }), _jsxs(Select, { value: config.xColumn, onValueChange: (v) => patchCfg({ xColumn: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies X" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Y-as kolom" }), _jsxs(Select, { value: config.yColumn, onValueChange: (v) => patchCfg({ yColumn: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies Y" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] })] })), type === 'ai_analysis' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-2 col-span-2", children: [_jsx(Label, { children: "Kolommen (komma-gescheiden, leeg = alles)" }), _jsx(Input, { value: (config.columns ?? []).join(','), onChange: (e) => patchCfg({ columns: e.target.value.split(',').map(s => s.trim()).filter(Boolean) }), placeholder: "bijv. id,status,created_at" })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Sample-grootte" }), _jsx(Input, { type: "number", value: config.limit ?? 100, onChange: (e) => patchCfg({ limit: Number(e.target.value) }) })] }), _jsxs("div", { className: "space-y-2 col-span-2", children: [_jsx(Label, { children: "Extra vraag voor de AI (optioneel)" }), _jsx(Input, { value: config.question ?? '', onChange: (e) => patchCfg({ question: e.target.value }), placeholder: "bijv. Welke artikelen blijven achter?" })] })] })), type === 'forecast' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "X-as (periode/datum)" }), _jsxs(Select, { value: config.xColumn, onValueChange: (v) => patchCfg({ xColumn: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies kolom" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Y-as (waarde)" }), _jsxs(Select, { value: config.yColumn, onValueChange: (v) => patchCfg({ yColumn: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies kolom" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Aggregatie" }), _jsxs(Select, { value: config.agg, onValueChange: (v) => patchCfg({ agg: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: AGGS.map(a => _jsx(SelectItem, { value: a, children: a.toUpperCase() }, a)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Horizon (periodes)" }), _jsx(Input, { type: "number", value: config.horizon ?? 6, onChange: (e) => patchCfg({ horizon: Number(e.target.value) }) })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Historie-rijen" }), _jsx(Input, { type: "number", value: config.history ?? 200, onChange: (e) => patchCfg({ history: Number(e.target.value) }) })] }), _jsxs("div", { className: "space-y-2 col-span-2", children: [_jsx(Label, { children: "Extra context (optioneel)" }), _jsx(Input, { value: config.question ?? '', onChange: (e) => patchCfg({ question: e.target.value }), placeholder: "bijv. Houd rekening met seizoenseffect" })] })] })), type === 'alert' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Aggregatie" }), _jsxs(Select, { value: config.agg, onValueChange: (v) => patchCfg({ agg: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: AGGS.map(a => _jsx(SelectItem, { value: a, children: a.toUpperCase() }, a)) })] })] }), config.agg !== 'count' && (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Kolom" }), _jsxs(Select, { value: config.column ?? '', onValueChange: (v) => patchCfg({ column: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies kolom" }) }), _jsx(SelectContent, { children: currentCols.map(c => _jsx(SelectItem, { value: c.name, children: c.name }, c.name)) })] })] })), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Operator" }), _jsxs(Select, { value: config.operator, onValueChange: (v) => patchCfg({ operator: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: OPERATORS.map(o => _jsx(SelectItem, { value: o, children: o }, o)) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Drempelwaarde" }), _jsx(Input, { type: "number", value: config.threshold ?? 0, onChange: (e) => patchCfg({ threshold: Number(e.target.value) }) })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Ernst" }), _jsxs(Select, { value: config.severity ?? 'warning', onValueChange: (v) => patchCfg({ severity: v }), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "info", children: "Info" }), _jsx(SelectItem, { value: "warning", children: "Waarschuwing" }), _jsx(SelectItem, { value: "critical", children: "Kritiek" })] })] })] }), _jsxs("div", { className: "space-y-2 col-span-2", children: [_jsx(Label, { children: "Boodschap bij trigger" }), _jsx(Input, { value: config.message ?? '', onChange: (e) => patchCfg({ message: e.target.value }), placeholder: "bijv. Voorraad onder kritieke grens" })] })] }))] }), _jsxs("div", { className: "rounded-lg border bg-muted/30 p-3 space-y-2", children: [_jsx("div", { className: "text-sm font-medium", children: "Rechten" }), _jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsxs(Label, { className: "flex flex-col gap-0.5", children: [_jsx("span", { children: "AI-analyse zichtbaar" }), _jsx("span", { className: "text-xs text-muted-foreground font-normal", children: "Toon AI-inzichten op dit blok" })] }), _jsx(Switch, { checked: permissions.can_view_ai !== false, onCheckedChange: (v) => setPermissions(p => ({ ...p, can_view_ai: v })) })] }), _jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsxs(Label, { className: "flex flex-col gap-0.5", children: [_jsx("span", { children: "Bewerkbaar" }), _jsx("span", { className: "text-xs text-muted-foreground font-normal", children: "Mag in de builder worden aangepast" })] }), _jsx(Switch, { checked: permissions.can_edit !== false, onCheckedChange: (v) => setPermissions(p => ({ ...p, can_edit: v })) })] }), _jsxs("div", { className: "space-y-1 pt-2 border-t", children: [_jsx(Label, { className: "text-sm", children: "Zichtbaar voor rollen (komma-gescheiden, leeg = iedereen)" }), _jsx(Input, { placeholder: "bijv. admin, manager, sales", value: (permissions.viewer_roles ?? []).join(', '), onChange: (e) => setPermissions(p => ({
+                                        ...p,
+                                        viewer_roles: e.target.value.split(',').map(s => s.trim()).filter(Boolean),
+                                    })) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Server-side controle: alleen gebruikers met \u00E9\u00E9n van deze rollen (via has_role) zien dit blok." })] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), children: "Annuleren" }), _jsx(Button, { onClick: async () => { await onSave({ type, title, config, permissions }); onOpenChange(false); }, children: "Opslaan" })] })] }) }));
+}

package/dist-lib/components/dashboard/BlockRenderer.d.ts

@@ -0,0 +1,5 @@
+import type { BlockRow } from './types';
+export declare function BlockRenderer({ block }: {
+    block: BlockRow;
+}): import("react").JSX.Element;
+//# sourceMappingURL=BlockRenderer.d.ts.map

package/dist-lib/components/dashboard/BlockRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/BlockRenderer.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,QAAQ,CAAA;CAAE,+BAoB3D"}

package/dist-lib/components/dashboard/BlockRenderer.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Lock } from 'lucide-react';
+import { KpiBlock } from './blocks/KpiBlock';
+import { TableBlock } from './blocks/TableBlock';
+import { ChartBlock } from './blocks/ChartBlock';
+import { AiAnalysisBlock } from './blocks/AiAnalysisBlock';
+import { ForecastBlock } from './blocks/ForecastBlock';
+import { AlertBlock } from './blocks/AlertBlock';
+import { useUserRoles } from '../../hooks/useUserRoles';
+export function BlockRenderer({ block }) {
+    const { roles, loading } = useUserRoles();
+    const required = block.permissions?.viewer_roles ?? [];
+    if (required.length > 0 && !loading && !required.some(r => roles.includes(r))) {
+        return (_jsxs("div", { className: "h-full flex flex-col items-center justify-center text-xs text-muted-foreground border rounded-lg bg-muted/30 p-4 gap-2", children: [_jsx(Lock, { className: "w-4 h-4" }), "Geen toegang tot dit blok"] }));
+    }
+    switch (block.type) {
+        case 'kpi': return _jsx(KpiBlock, { block: block });
+        case 'table': return _jsx(TableBlock, { block: block });
+        case 'chart': return _jsx(ChartBlock, { block: block });
+        case 'ai_analysis': return _jsx(AiAnalysisBlock, { block: block });
+        case 'forecast': return _jsx(ForecastBlock, { block: block });
+        case 'alert': return _jsx(AlertBlock, { block: block });
+        default: return _jsxs("div", { className: "p-4 text-sm text-muted-foreground", children: ["Onbekend bloktype: ", block.type] });
+    }
+}

package/dist-lib/components/dashboard/DashboardBuilderPage.d.ts

@@ -0,0 +1,4 @@
+import 'react-grid-layout/css/styles.css';
+import 'react-resizable/css/styles.css';
+export declare function DashboardBuilderPage(): import("react").JSX.Element;
+//# sourceMappingURL=DashboardBuilderPage.d.ts.map

package/dist-lib/components/dashboard/DashboardBuilderPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardBuilderPage.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/DashboardBuilderPage.tsx"],"names":[],"mappings":"AAeA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AAExC,wBAAgB,oBAAoB,gCA2InC"}

package/dist-lib/components/dashboard/DashboardBuilderPage.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useParams, useNavigate } from '@tanstack/react-router';
+import { Button } from '@flowselections/core';
+import { Save, Trash2, Pencil, Sparkles, Settings, MessageSquare } from 'lucide-react';
+import GridLayout from 'react-grid-layout/legacy';
+import { useDashboardPages } from '../../hooks/useDashboardPages';
+import { useDashboardBlocks } from '../../hooks/useDashboardBlocks';
+import { BlockRenderer } from './BlockRenderer';
+import { BlockEditorDialog } from './BlockEditorDialog';
+import { BlockGeneratorDialog } from './ai/BlockGeneratorDialog';
+import { QuickAddDialog } from './QuickAddDialog';
+import { SuggestionBanner } from './SuggestionBanner';
+import { TileGallery } from './TileGallery';
+import 'react-grid-layout/css/styles.css';
+import 'react-resizable/css/styles.css';
+export function DashboardBuilderPage() {
+    const params = useParams({ strict: false });
+    const pageId = params.pageId ?? null;
+    const navigate = useNavigate();
+    const { pages } = useDashboardPages();
+    const page = pages.find(p => p.id === pageId);
+    const { blocks, create, update, remove, updateLayouts } = useDashboardBlocks(pageId);
+    const [editorOpen, setEditorOpen] = useState(false);
+    const [editing, setEditing] = useState(null);
+    const [genOpen, setGenOpen] = useState(false);
+    const [quickOpen, setQuickOpen] = useState(false);
+    const layout = blocks.map(b => ({
+        i: b.id,
+        x: b.layout?.x ?? 0,
+        y: b.layout?.y ?? 0,
+        w: b.layout?.w ?? 4,
+        h: b.layout?.h ?? 4,
+    }));
+    async function handleLayoutChange(next) {
+        const patch = next.map(l => ({ id: l.i, layout: { x: l.x, y: l.y, w: l.w, h: l.h } }));
+        await updateLayouts(patch);
+    }
+    return (_jsxs("div", { className: "p-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-4 px-2", children: [_jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: "Bewerken" }), _jsx("h1", { className: "text-xl font-semibold", children: page?.name ?? 'Dashboard' })] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: () => { setEditing(null); setEditorOpen(true); }, title: "Geavanceerd: zelf instellen", children: _jsx(Settings, { className: "w-4 h-4" }) }), _jsxs(Button, { variant: "outline", onClick: () => pageId && navigate({ to: '/dashboard-erp-kwekers/$pageId', params: { pageId } }), children: [_jsx(Save, { className: "w-4 h-4 mr-2" }), " Klaar"] })] })] }), _jsx("div", { className: "px-2", children: _jsx(TileGallery, { onAdd: async ({ type, title, config }) => { await create({ type, title, config }); } }) }), blocks.length === 0 ? (_jsx("div", { className: "p-8 text-center border-2 border-dashed rounded-lg mx-2 text-muted-foreground", children: "Nog geen blokken. Kies hierboven een kant-en-klare tegel, of vraag de AI rechtsonder om een voorstel." })) : (_jsx(GridLayout, { className: "layout", layout: layout, cols: 12, rowHeight: 60, width: 1200, onLayoutChange: handleLayoutChange, draggableHandle: ".drag-handle", children: blocks.map(b => (_jsxs("div", { className: "relative group", children: [_jsx("div", { className: "drag-handle absolute top-1 left-1 right-1 h-6 cursor-move opacity-0 group-hover:opacity-100 transition bg-muted/50 rounded text-xs flex items-center justify-center text-muted-foreground z-10", children: "\u22EE\u22EE slepen" }), _jsxs("div", { className: "absolute top-1 right-1 flex gap-1 opacity-0 group-hover:opacity-100 transition z-10", children: [_jsx(Button, { size: "icon", variant: "secondary", className: "h-7 w-7", onClick: () => { setEditing(b); setEditorOpen(true); }, children: _jsx(Pencil, { className: "w-3.5 h-3.5" }) }), _jsx(Button, { size: "icon", variant: "destructive", className: "h-7 w-7", onClick: () => remove(b.id), children: _jsx(Trash2, { className: "w-3.5 h-3.5" }) })] }), _jsx(BlockRenderer, { block: b })] }, b.id))) })), blocks.length > 0 && (_jsx("div", { className: "px-2 mt-4", children: _jsx(SuggestionBanner, { block: blocks[blocks.length - 1], onAdd: async ({ type, title, config }) => { await create({ type, title, config }); } }) })), _jsxs("div", { className: "fixed bottom-6 right-6 z-40 flex flex-col items-end gap-2", children: [_jsxs(Button, { onClick: () => setQuickOpen(true), className: "shadow-lg rounded-full h-14 pl-4 pr-5", children: [_jsx(Sparkles, { className: "w-5 h-5 mr-2" }), "AI-voorstel"] }), _jsxs(Button, { variant: "secondary", size: "sm", onClick: () => setGenOpen(true), className: "shadow-md rounded-full", children: [_jsx(MessageSquare, { className: "w-4 h-4 mr-2" }), "AI-chat"] })] }), _jsx(QuickAddDialog, { open: quickOpen, onOpenChange: setQuickOpen, onAdd: async ({ type, title, config }) => { await create({ type, title, config }); }, onAdvanced: () => { setEditing(null); setEditorOpen(true); } }), _jsx(BlockEditorDialog, { open: editorOpen, onOpenChange: setEditorOpen, initial: editing, onSave: async ({ type, title, config, permissions }) => {
+                    if (editing) {
+                        await update(editing.id, { title, config, permissions });
+                    }
+                    else {
+                        await create({ type, title, config, permissions });
+                    }
+                } }), _jsx(BlockGeneratorDialog, { open: genOpen, onOpenChange: setGenOpen, onSave: async ({ type, title, config, permissions }) => {
+                    await create({ type, title, config, permissions });
+                } })] }));
+}

package/dist-lib/components/dashboard/DashboardErpLayoutPage.d.ts

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

package/dist-lib/components/dashboard/DashboardErpLayoutPage.d.ts.map

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

package/dist-lib/components/dashboard/DashboardErpLayoutPage.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Outlet, useParams, useNavigate, Link } from '@tanstack/react-router';
+import { Button, Input, Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@flowselections/core';
+import { Plus, LayoutGrid } from 'lucide-react';
+import { useDashboardPages } from '../../hooks/useDashboardPages';
+import { AiChatPanel } from './ai/AiChatPanel';
+export function DashboardErpLayoutPage() {
+    const { pages, loading, create } = useDashboardPages();
+    const params = useParams({ strict: false });
+    const navigate = useNavigate();
+    const [openNew, setOpenNew] = useState(false);
+    const [name, setName] = useState('');
+    const activeId = params.pageId ?? pages[0]?.id;
+    async function handleCreate() {
+        if (!name.trim())
+            return;
+        const page = await create(name.trim());
+        setOpenNew(false);
+        setName('');
+        if (page)
+            navigate({ to: '/dashboard-erp-kwekers/$pageId', params: { pageId: page.id } });
+    }
+    return (_jsxs("div", { className: "flex flex-col h-full", children: [_jsx("div", { className: "border-b bg-card", children: _jsxs("div", { className: "px-6 pt-3 flex items-end gap-1 overflow-x-auto", children: [loading && _jsx("div", { className: "text-sm text-muted-foreground pb-3", children: "Dashboards laden\u2026" }), !loading && pages.length === 0 && (_jsx("div", { className: "text-sm text-muted-foreground pb-3", children: "Nog geen dashboards." })), pages.map(p => {
+                            const isActive = p.id === activeId;
+                            return (_jsxs(Link, { to: '/dashboard-erp-kwekers/$pageId', params: { pageId: p.id }, className: `px-4 py-2 text-sm rounded-t-md border-b-2 -mb-px whitespace-nowrap ${isActive
+                                    ? 'border-primary text-foreground font-medium bg-background'
+                                    : 'border-transparent text-muted-foreground hover:text-foreground'}`, children: [_jsx(LayoutGrid, { className: "inline w-3.5 h-3.5 mr-1.5 -mt-0.5" }), p.name] }, p.id));
+                        }), _jsxs(Button, { variant: "ghost", size: "sm", className: "ml-2 mb-1", onClick: () => setOpenNew(true), children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), " Nieuw dashboard"] })] }) }), _jsx("div", { className: "flex-1 overflow-auto", children: _jsx(Outlet, {}) }), _jsx(AiChatPanel, { pageId: activeId ?? null }), _jsx(Dialog, { open: openNew, onOpenChange: setOpenNew, children: _jsxs(DialogContent, { children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Nieuw dashboard" }) }), _jsx(Input, { value: name, onChange: (e) => setName(e.target.value), placeholder: "Bijv. Voorraad overzicht", autoFocus: true }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: () => setOpenNew(false), children: "Annuleren" }), _jsx(Button, { onClick: handleCreate, children: "Aanmaken" })] })] }) })] }));
+}

package/dist-lib/components/dashboard/DashboardSummary.d.ts

@@ -0,0 +1,9 @@
+import type { BlockRow } from './types';
+interface Props {
+    pageId?: string;
+    pageName: string;
+    blocks: BlockRow[];
+}
+export declare function DashboardSummary({ pageId, pageName, blocks }: Props): import("react").JSX.Element | null;
+export {};
+//# sourceMappingURL=DashboardSummary.d.ts.map

package/dist-lib/components/dashboard/DashboardSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardSummary.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/DashboardSummary.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,QAAQ,EAAuC,MAAM,SAAS,CAAC;AAE7E,UAAU,KAAK;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,QAAQ,EAAE,CAAC;CACpB;AA+CD,wBAAgB,gBAAgB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,KAAK,sCAqHnE"}

package/dist-lib/components/dashboard/DashboardSummary.js

@@ -0,0 +1,136 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from 'react';
+import { Card, CardContent, Button, supabase, toast } from '@flowselections/core';
+import { Sparkles, RefreshCw, Loader2, FileText, Eye, EyeOff } from 'lucide-react';
+import { useServerFn } from '@tanstack/react-start';
+import ReactMarkdown from 'react-markdown';
+import { summarizeDashboard } from '../../lib/ai-insights.functions';
+import { saveDailyReport, listDailyReports } from '../../lib/dashboard-eval.functions';
+import { useAiSettings, useDashboardAiVisible, buildAiInstruction } from '../../lib/aiSettings';
+async function snapshotBlock(b) {
+    const title = b.title || b.type;
+    try {
+        if (b.type === 'kpi') {
+            const c = b.config;
+            if (!c.table)
+                return { title, type: b.type };
+            if (c.agg === 'count') {
+                const { count } = await supabase.from(c.table).select('*', { count: 'exact', head: true });
+                return { title, type: b.type, table: c.table, value: count ?? 0 };
+            }
+            if (!c.column)
+                return { title, type: b.type, table: c.table, value: 0 };
+            const { data } = await supabase.from(c.table).select(c.column).limit(5000);
+            const nums = (data ?? []).map(r => Number(r?.[c.column])).filter(n => !Number.isNaN(n));
+            let value = 0;
+            if (nums.length) {
+                switch (c.agg) {
+                    case 'sum':
+                        value = nums.reduce((a, b) => a + b, 0);
+                        break;
+                    case 'avg':
+                        value = nums.reduce((a, b) => a + b, 0) / nums.length;
+                        break;
+                    case 'min':
+                        value = Math.min(...nums);
+                        break;
+                    case 'max':
+                        value = Math.max(...nums);
+                        break;
+                }
+            }
+            return { title, type: b.type, table: c.table, value };
+        }
+        if (b.type === 'table') {
+            const c = b.config;
+            if (!c.table)
+                return { title, type: b.type };
+            const cols = c.columns && c.columns.length ? c.columns.join(',') : '*';
+            const { data } = await supabase.from(c.table).select(cols).limit(Math.min(c.limit ?? 20, 20));
+            return { title, type: b.type, table: c.table, rows: Array.isArray(data) ? data : [] };
+        }
+        if (b.type === 'chart') {
+            const c = b.config;
+            if (!c.table)
+                return { title, type: b.type };
+            const { data } = await supabase.from(c.table).select(`${c.xColumn},${c.yColumn}`).limit(100);
+            return { title, type: b.type, table: c.table, rows: Array.isArray(data) ? data.slice(0, 20) : [] };
+        }
+    }
+    catch {
+        // ignore
+    }
+    return { title, type: b.type };
+}
+export function DashboardSummary({ pageId, pageName, blocks }) {
+    const [settings] = useAiSettings();
+    const [visible, setVisible] = useDashboardAiVisible(pageId);
+    const run = useServerFn(summarizeDashboard);
+    const save = useServerFn(saveDailyReport);
+    const listReports = useServerFn(listDailyReports);
+    const [text, setText] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const [saving, setSaving] = useState(false);
+    const [reports, setReports] = useState([]);
+    useEffect(() => {
+        if (!pageId)
+            return;
+        (async () => {
+            try {
+                const res = await listReports({ data: { pageId } });
+                setReports(Array.isArray(res?.reports) ? res.reports.slice(0, 3) : []);
+            }
+            catch { /* niet-fataal */ }
+        })();
+    }, [pageId, listReports]);
+    const summarize = useCallback(async () => {
+        if (!settings.enabled || !settings.types.dashboard)
+            return;
+        const dataBlocks = blocks.filter(b => b.type !== 'ai_analysis');
+        if (!dataBlocks.length)
+            return;
+        setLoading(true);
+        setError(null);
+        try {
+            const snapshots = await Promise.all(dataBlocks.map(snapshotBlock));
+            const res = await run({
+                data: { pageName, blocks: snapshots, instruction: buildAiInstruction(settings) },
+            });
+            setText(res.text);
+        }
+        catch (e) {
+            setError(e?.message ?? 'Fout bij samenvatting');
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [run, pageName, blocks, settings]);
+    useEffect(() => { if (visible)
+        summarize(); /* eslint-disable-next-line */ }, [pageName, blocks.length, settings.enabled, settings.detail, settings.personality, visible]);
+    if (!blocks.length)
+        return null;
+    if (!settings.enabled || !settings.types.dashboard)
+        return null;
+    if (!visible) {
+        return (_jsx("div", { className: "mb-2 mx-2 flex justify-end", children: _jsxs(Button, { size: "sm", variant: "ghost", onClick: () => setVisible(true), className: "h-7 text-xs gap-1", children: [_jsx(Eye, { className: "w-3.5 h-3.5" }), " AI-samenvatting tonen"] }) }));
+    }
+    async function handleSave() {
+        if (!pageId || !text)
+            return;
+        setSaving(true);
+        try {
+            await save({ data: { pageId, summary: text } });
+            toast.success('Rapport opgeslagen');
+            const res = await listReports({ data: { pageId } });
+            setReports(Array.isArray(res?.reports) ? res.reports.slice(0, 3) : []);
+        }
+        catch (e) {
+            toast.error('Opslaan mislukt: ' + (e?.message ?? ''));
+        }
+        finally {
+            setSaving(false);
+        }
+    }
+    return (_jsx(Card, { className: "mb-4 mx-2 border-primary/20 bg-gradient-to-br from-primary/5 to-transparent", children: _jsxs(CardContent, { className: "py-4 px-5", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-primary", children: [_jsx(Sparkles, { className: "w-4 h-4" }), " AI-samenvatting"] }), _jsxs("div", { className: "flex items-center gap-1 -mt-1", children: [_jsx(Button, { size: "icon", variant: "ghost", onClick: () => setVisible(false), className: "h-7 w-7", title: "Verbergen op dit dashboard", children: _jsx(EyeOff, { className: "w-3.5 h-3.5" }) }), pageId && text && (_jsx(Button, { size: "sm", variant: "ghost", onClick: handleSave, disabled: saving, className: "h-7 text-xs", children: saving ? 'Opslaan…' : 'Bewaar als dagrapport' })), _jsx(Button, { size: "icon", variant: "ghost", onClick: summarize, disabled: loading, className: "h-7 w-7", children: loading ? _jsx(Loader2, { className: "w-3.5 h-3.5 animate-spin" }) : _jsx(RefreshCw, { className: "w-3.5 h-3.5" }) })] })] }), _jsxs("div", { className: "mt-2 text-sm", children: [error && _jsx("div", { className: "text-destructive", children: error }), loading && !text && _jsx("div", { className: "text-muted-foreground", children: "AI leest het dashboard\u2026" }), text && (_jsx("div", { className: "prose prose-sm dark:prose-invert max-w-none", children: _jsx(ReactMarkdown, { children: text }) }))] }), reports.length > 0 && (_jsxs("div", { className: "mt-3 pt-3 border-t border-primary/10", children: [_jsxs("div", { className: "flex items-center gap-2 text-xs font-medium text-muted-foreground mb-2", children: [_jsx(FileText, { className: "w-3.5 h-3.5" }), " Recente dagrapporten"] }), _jsx("div", { className: "space-y-2", children: reports.map(r => (_jsxs("details", { className: "text-xs", children: [_jsx("summary", { className: "cursor-pointer text-muted-foreground hover:text-foreground", children: new Date(r.created_at).toLocaleString('nl-NL') }), _jsx("div", { className: "mt-1 pl-3 text-foreground/80", children: r.summary })] }, r.id))) })] }))] }) }));
+}

package/dist-lib/components/dashboard/DashboardViewPage.d.ts

@@ -0,0 +1,3 @@
+import 'react-grid-layout/css/styles.css';
+export declare function DashboardViewPage(): import("react").JSX.Element;
+//# sourceMappingURL=DashboardViewPage.d.ts.map

package/dist-lib/components/dashboard/DashboardViewPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardViewPage.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/DashboardViewPage.tsx"],"names":[],"mappings":"AAUA,OAAO,kCAAkC,CAAC;AAE1C,wBAAgB,iBAAiB,gCAMhC"}