@flowselections/mailbox-orders 1.0.55 → 1.0.58

package/dist-lib/components/fs-ui/NoticeBar.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { AlertTriangle, ChevronDown, Info, XCircle } from "lucide-react";
+const TONE = {
+    warning: "border-border bg-warning-soft text-warning-soft-foreground",
+    error: "border-destructive/30 bg-destructive/5 text-foreground [&_.nb-icon]:text-destructive",
+    info: "border-border bg-muted/50 text-foreground [&_.nb-icon]:text-muted-foreground",
+};
+/** Eén melding op één regel; details klappen uit (stijl NoticeBar uit Verkooporders). */
+export function NoticeRow({ notice }) {
+    const [open, setOpen] = useState(false);
+    const tone = notice.tone ?? "warning";
+    const Icon = tone === "error" ? XCircle : tone === "info" ? Info : AlertTriangle;
+    return (_jsxs("div", { role: tone === "error" ? "alert" : "status", className: "shrink-0 rounded-lg border text-sm " + TONE[tone], children: [_jsxs("div", { className: "flex items-center gap-2 pr-2", children: [_jsxs("button", { type: "button", "aria-expanded": notice.details ? open : undefined, onClick: () => notice.details && setOpen((o) => !o), className: "flex min-w-0 flex-1 items-center gap-2 rounded-lg px-3 py-2 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring " + (notice.details ? "" : "cursor-default"), children: [_jsx(Icon, { className: "nb-icon h-4 w-4 shrink-0", "aria-hidden": true }), _jsx("span", { className: "min-w-0 flex-1 truncate font-medium", title: notice.title, children: notice.title }), notice.details && _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 transition-transform " + (open ? "rotate-180" : ""), "aria-hidden": true })] }), notice.action && _jsx("div", { className: "shrink-0", children: notice.action })] }), open && notice.details && (_jsx("div", { className: "border-t border-border/60 px-3 py-2 pl-9 opacity-90", children: notice.details }))] }));
+}
+/** Meldingen direct onder de kop: hooguit 2 zichtbaar, de rest achter "+ n meldingen". */
+export function NoticeBar({ notices }) {
+    const [all, setAll] = useState(false);
+    if (notices.length === 0)
+        return null;
+    const visible = all ? notices : notices.slice(0, 2);
+    const rest = notices.length - visible.length;
+    return (_jsxs("div", { className: "flex shrink-0 flex-col gap-2", "aria-live": "polite", children: [visible.map((n) => _jsx(NoticeRow, { notice: n }, n.key)), rest > 0 && (_jsxs("button", { type: "button", onClick: () => setAll(true), className: "self-start rounded-md px-1 text-xs font-medium text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: ["+ ", rest, " ", rest === 1 ? "melding" : "meldingen"] }))] }));
+}

package/dist-lib/components/fs-ui/PageHeader.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-/** Paginakop: titel + bijgewerkt-tijd links, acties rechts. Alleen weergave. */
+/** Paginakop exact als Verkooporders: h1, daaronder alleen "Bijgewerkt", acties rechts. */
 export declare function PageHeader({ title, meta, actions, }: {
     title: string;
     meta?: ReactNode;

package/dist-lib/components/fs-ui/PageHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,gFAAgF;AAChF,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,IAAI,EACJ,OAAO,GACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,+BAUA"}
+{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,2FAA2F;AAC3F,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,IAAI,EACJ,OAAO,GACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,+BAcA"}

package/dist-lib/components/fs-ui/PageHeader.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/** Paginakop: titel + bijgewerkt-tijd links, acties rechts. Alleen weergave. */
+/** Paginakop exact als Verkooporders: h1, daaronder alleen "Bijgewerkt", acties rechts. */
 export function PageHeader({ title, meta, actions, }) {
-    return (_jsxs("div", { className: "flex shrink-0 flex-wrap items-start justify-between gap-2", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("h1", { className: "truncate text-xl font-bold leading-tight text-foreground sm:text-2xl", children: title }), meta && _jsx("div", { className: "mt-0.5 text-xs text-muted-foreground", children: meta })] }), actions && _jsx("div", { className: "flex flex-wrap items-center gap-2", children: actions })] }));
+    return (_jsxs("header", { className: "shrink-0 grid grid-cols-[minmax(0,1fr)_auto] items-center gap-3 sm:flex sm:flex-wrap sm:justify-between", children: [_jsx("div", { className: "flex min-w-0 items-center gap-3", children: _jsxs("div", { className: "min-w-0", children: [_jsx("h1", { className: "truncate text-xl font-bold leading-tight sm:text-2xl tracking-tight text-foreground", children: title }), _jsx("p", { className: "flex flex-wrap items-center gap-x-2 text-xs text-muted-foreground", "aria-live": "polite", children: meta })] }) }), actions && _jsx("div", { className: "contents sm:flex sm:flex-wrap sm:items-center sm:gap-2", children: actions })] }));
 }

package/dist-lib/components/fs-ui/PillTabs.d.ts

@@ -1,11 +1,12 @@
-import type { ReactNode } from "react";
+import { type ReactNode } from "react";
 export interface PillTab {
     key: string;
     label: string;
     icon?: ReactNode;
     count?: number | null;
+    hint?: string;
 }
-/** Tabbladen als pillen met icoon, label en teller. Veegbaar op mobiel. */
+/** Tabbladen exact als StatusTabs in Verkooporders: één regel, veegbaar met vervaging. */
 export declare function PillTabs({ tabs, active, onSelect, ariaLabel, }: {
     tabs: PillTab[];
     active: string;

package/dist-lib/components/fs-ui/PillTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PillTabs.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/PillTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,OAAO;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB;AAED,2EAA2E;AAC3E,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAS,GACV,EAAE;IACD,IAAI,EAAE,OAAO,EAAE,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BA6CA"}
+{"version":3,"file":"PillTabs.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/PillTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA2B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhE,MAAM,WAAW,OAAO;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,0FAA0F;AAC1F,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAS,GACV,EAAE;IACD,IAAI,EAAE,OAAO,EAAE,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAyDA"}

package/dist-lib/components/fs-ui/PillTabs.js

@@ -1,14 +1,29 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/** Tabbladen als pillen met icoon, label en teller. Veegbaar op mobiel. */
+import { useLayoutEffect, useRef } from "react";
+/** Tabbladen exact als StatusTabs in Verkooporders: één regel, veegbaar met vervaging. */
 export function PillTabs({ tabs, active, onSelect, ariaLabel, }) {
-    return (_jsxs("div", { className: "relative shrink-0", children: [_jsx("div", { role: "tablist", "aria-label": ariaLabel, className: "-mx-4 flex gap-2 overflow-x-auto px-4 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden sm:mx-0 sm:px-0", children: tabs.map((t) => {
-                    const isActive = t.key === active;
-                    const empty = (t.count ?? null) === 0;
-                    return (_jsxs("button", { type: "button", role: "tab", "aria-selected": isActive, onClick: () => onSelect(t.key), className: "inline-flex h-9 shrink-0 items-center gap-2 rounded-lg border px-3 text-sm font-medium transition-colors duration-150 ease-out motion-reduce:transition-none " +
-                            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:h-4 [&_svg]:w-4 " +
-                            (isActive
-                                ? "border-primary/40 bg-primary/10 text-primary"
-                                : "border-transparent text-foreground hover:bg-muted " + (empty ? "text-muted-foreground" : "")), children: [t.icon, _jsx("span", { children: t.label }), t.count != null && (_jsx("span", { className: "inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold tabular-nums " +
-                                    (isActive ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"), children: t.count }))] }, t.key));
-                }) }), _jsx("div", { className: "pointer-events-none absolute inset-y-0 right-0 w-8 bg-gradient-to-l from-background sm:hidden", "aria-hidden": true })] }));
+    const listRef = useRef(null);
+    useLayoutEffect(() => {
+        const measure = () => {
+            const el = listRef.current?.querySelector(`[data-tab="${active}"]`);
+            const list = listRef.current;
+            if (el && list && (el.offsetLeft < list.scrollLeft || el.offsetLeft + el.offsetWidth > list.scrollLeft + list.clientWidth)) {
+                list.scrollLeft = el.offsetLeft - 8;
+            }
+        };
+        measure();
+        window.addEventListener("resize", measure);
+        return () => window.removeEventListener("resize", measure);
+    }, [active]);
+    return (_jsx("div", { className: "shrink-0", children: _jsx("div", { ref: listRef, role: "tablist", "aria-label": ariaLabel, className: "relative -mx-4 flex items-center gap-2 overflow-x-auto px-4 pb-1 [scrollbar-width:none] [mask-image:linear-gradient(to_right,black_85%,transparent)] [&::-webkit-scrollbar]:hidden sm:mx-0 sm:px-0 sm:[mask-image:none]", children: tabs.map((t) => {
+                const isActive = active === t.key;
+                const count = t.count ?? null;
+                return (_jsxs("button", { "data-tab": t.key, type: "button", role: "tab", "aria-selected": isActive, onClick: () => onSelect(t.key), title: t.hint, style: { transitionProperty: "color, background-color, border-color", transitionDuration: "150ms" }, className: "relative flex h-9 items-center gap-2 whitespace-nowrap rounded-lg border px-3 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring " +
+                        (isActive
+                            ? "border-primary/30 bg-primary/10 font-semibold text-foreground"
+                            : count === 0
+                                ? "border-border bg-card text-muted-foreground/70 hover:text-foreground"
+                                : "border-border bg-card text-foreground/80 hover:bg-muted hover:text-foreground"), children: [t.icon && _jsx("span", { className: "inline-flex shrink-0 [&_svg]:h-4 [&_svg]:w-4", "aria-hidden": true, children: t.icon }), _jsx("span", { children: t.label }), count != null && (_jsx("span", { className: "inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-[11px] font-semibold tabular-nums " +
+                                (isActive ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"), children: count }))] }, t.key));
+            }) }) }));
 }

package/dist-lib/components/fs-ui/RowMenu.d.ts

@@ -0,0 +1,13 @@
+export interface RowMenuItem {
+    label: string;
+    onSelect: () => void;
+    disabled?: boolean;
+    destructive?: boolean;
+    title?: string;
+}
+/** Rijmenu exact als Verkooporders (drie puntjes, acties in een menu). */
+export declare function RowMenu({ label, items }: {
+    label: string;
+    items: RowMenuItem[];
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=RowMenu.d.ts.map

package/dist-lib/components/fs-ui/RowMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowMenu.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/RowMenu.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,0EAA0E;AAC1E,wBAAgB,OAAO,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,WAAW,EAAE,CAAA;CAAE,sCA0BhF"}

package/dist-lib/components/fs-ui/RowMenu.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MoreVertical } from "lucide-react";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@flowselections/core";
+/** Rijmenu exact als Verkooporders (drie puntjes, acties in een menu). */
+export function RowMenu({ label, items }) {
+    if (items.length === 0)
+        return null;
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { "aria-label": label, onClick: (e) => e.stopPropagation(), className: "inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: _jsx(MoreVertical, { className: "h-4 w-4" }) }), _jsx(DropdownMenuContent, { align: "end", onClick: (e) => e.stopPropagation(), children: items.map((it) => (_jsx(DropdownMenuItem, { disabled: it.disabled, title: it.title, className: it.destructive ? "text-destructive focus:text-destructive" : undefined, onClick: () => { if (!it.disabled)
+                        it.onSelect(); }, children: it.label }, it.label))) })] }));
+}

package/dist-lib/components/fs-ui/SearchInput.d.ts

@@ -1,6 +1,6 @@
 /**
- * Zoekveld: filtert tijdens typen (250 ms), wis-kruisje, Esc wist.
- * De sneltoets "/" wordt door de pagina geregeld (useListHotkeys).
+ * Zoekveld exact als Verkooporders: h-9, sm:w-80, breder bij focus.
+ * Filtert tijdens typen (250 ms), wis-kruisje, Esc wist. "/" regelt de pagina.
  */
 export declare const SearchInput: import("react").ForwardRefExoticComponent<{
     value: string;

package/dist-lib/components/fs-ui/SearchInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/SearchInput.tsx"],"names":[],"mappings":"AAGA;;;GAGG;AACH,eAAO,MAAM,WAAW;WACf,MAAM;cACH,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;kBACf,MAAM;YACZ,MAAM;gBACF,MAAM;oDAgDlB,CAAC"}
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/SearchInput.tsx"],"names":[],"mappings":"AAGA;;;GAGG;AACH,eAAO,MAAM,WAAW;WACf,MAAM;cACH,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;kBACf,MAAM;YACZ,MAAM;gBACF,MAAM;oDAqElB,CAAC"}

package/dist-lib/components/fs-ui/SearchInput.js

@@ -2,10 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useEffect, useRef, useState } from "react";
 import { Search, X } from "lucide-react";
 /**
- * Zoekveld: filtert tijdens typen (250 ms), wis-kruisje, Esc wist.
- * De sneltoets "/" wordt door de pagina geregeld (useListHotkeys).
+ * Zoekveld exact als Verkooporders: h-9, sm:w-80, breder bij focus.
+ * Filtert tijdens typen (250 ms), wis-kruisje, Esc wist. "/" regelt de pagina.
  */
-export const SearchInput = forwardRef(function SearchInput({ value, onChange, placeholder = "Zoeken…", delay = 250, ariaLabel }, ref) {
+export const SearchInput = forwardRef(function SearchInput({ value, onChange, placeholder = "Zoeken", delay = 250, ariaLabel }, ref) {
     const [local, setLocal] = useState(value);
     const timer = useRef(null);
     useEffect(() => { setLocal(value); }, [value]);
@@ -20,7 +20,10 @@ export const SearchInput = forwardRef(function SearchInput({ value, onChange, pl
     };
     useEffect(() => () => { if (timer.current)
         clearTimeout(timer.current); }, []);
-    return (_jsxs("div", { className: "relative w-full max-w-md", children: [_jsx(Search, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground", "aria-hidden": true }), _jsx("input", { ref: ref, type: "search", value: local, "aria-label": ariaLabel ?? placeholder, placeholder: placeholder, onChange: (e) => push(e.target.value), onKeyDown: (e) => {
+    return (_jsxs("div", { className: "group relative flex h-10 sm:h-9 w-full items-center overflow-hidden rounded-md border border-border bg-card " +
+            "transition-[box-shadow,border-color,width] duration-[180ms] ease-out motion-reduce:transition-none " +
+            "focus-within:border-primary focus-within:ring-[3px] focus-within:ring-ring/20 " +
+            "sm:w-80 sm:focus-within:w-[400px]", children: [_jsx(Search, { className: "ml-3 h-4 w-4 shrink-0 text-muted-foreground transition-colors duration-[120ms] group-focus-within:text-primary", "aria-hidden": true }), _jsx("input", { ref: ref, type: "search", placeholder: placeholder, "aria-label": ariaLabel ?? "Zoeken", value: local, maxLength: 100, autoComplete: "off", spellCheck: false, onChange: (e) => push(e.target.value), onKeyDown: (e) => {
                     if (e.key === "Escape") {
                         e.preventDefault();
                         if (local)
@@ -28,6 +31,8 @@ export const SearchInput = forwardRef(function SearchInput({ value, onChange, pl
                         else
                             e.target.blur();
                     }
-                }, className: "h-10 w-full rounded-lg border border-input bg-background pl-9 pr-16 text-base text-foreground placeholder:text-muted-foreground sm:h-9 sm:text-sm " +
-                    "transition-shadow duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring [&::-webkit-search-cancel-button]:hidden" }), local ? (_jsx("button", { type: "button", "aria-label": "Zoekopdracht wissen", onClick: () => push("", true), className: "absolute right-2 top-1/2 inline-flex h-7 w-7 -translate-y-1/2 items-center justify-center rounded text-muted-foreground hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: _jsx(X, { className: "h-4 w-4" }) })) : (_jsx("kbd", { className: "pointer-events-none absolute right-2 top-1/2 hidden -translate-y-1/2 rounded-sm border border-border px-1.5 text-[11px] text-muted-foreground sm:inline-block", children: "/" }))] }));
+                }, className: "h-full min-w-0 flex-1 appearance-none border-0 bg-transparent px-2 text-base sm:text-sm text-foreground outline-none ring-0 shadow-none focus:outline-none focus:ring-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 " +
+                    "placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden" }), _jsxs("span", { className: "relative mr-1.5 flex h-7 w-7 shrink-0 items-center justify-center", children: [_jsx("kbd", { className: "pointer-events-none absolute hidden rounded border border-border px-1.5 font-mono text-[11px] leading-5 text-muted-foreground transition-opacity duration-[120ms] md:inline-block " +
+                            (local ? "opacity-0" : "opacity-100 group-focus-within:opacity-0"), "aria-hidden": true, children: "/" }), _jsx("button", { type: "button", onClick: () => push("", true), tabIndex: local ? 0 : -1, "aria-label": "Zoekopdracht wissen", className: "absolute inline-flex h-7 w-7 items-center justify-center rounded text-muted-foreground transition-[opacity,transform,background-color] duration-[120ms] ease-out hover:bg-muted hover:text-foreground " +
+                            (local ? "scale-100 opacity-100" : "pointer-events-none scale-90 opacity-0"), children: _jsx(X, { className: "h-4 w-4" }) })] })] }));
 });

package/dist-lib/components/fs-ui/ShortcutHelp.d.ts

@@ -1,7 +1,7 @@
-/** Overzicht van de sneltoetsen (opent met "?"). */
+/** Overzicht van de sneltoetsen, exact als Verkooporders (opent met "?"). */
 export declare function ShortcutHelp({ open, onOpenChange, items }: {
     open: boolean;
-    onOpenChange: (v: boolean) => void;
-    items: Array<[string, string]>;
+    onOpenChange: (o: boolean) => void;
+    items: Array<[string[], string]>;
 }): import("react").JSX.Element;
 //# sourceMappingURL=ShortcutHelp.d.ts.map

package/dist-lib/components/fs-ui/ShortcutHelp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ShortcutHelp.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/ShortcutHelp.tsx"],"names":[],"mappings":"AAEA,oDAAoD;AACpD,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,YAAY,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;CAAE,+BAgBhJ"}
+{"version":3,"file":"ShortcutHelp.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/ShortcutHelp.tsx"],"names":[],"mappings":"AAEA,6EAA6E;AAC7E,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,YAAY,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,EAAE,EAAE,MAAM,CAAC,CAAC,CAAA;CAAE,+BAwBlJ"}

package/dist-lib/components/fs-ui/ShortcutHelp.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@flowselections/core";
-/** Overzicht van de sneltoetsen (opent met "?"). */
+/** Overzicht van de sneltoetsen, exact als Verkooporders (opent met "?"). */
 export function ShortcutHelp({ open, onOpenChange, items }) {
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-w-sm rounded-lg", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Sneltoetsen" }) }), _jsx("ul", { className: "space-y-2 text-sm", children: items.map(([k, label]) => (_jsxs("li", { className: "flex items-center justify-between gap-4", children: [_jsx("span", { className: "text-muted-foreground", children: label }), _jsx("kbd", { className: "rounded-sm border border-border px-1.5 py-0.5 text-xs", children: k })] }, k))) })] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-w-sm", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Sneltoetsen" }) }), _jsx("ul", { className: "divide-y divide-border text-sm", children: items.map(([keys, label]) => (_jsxs("li", { className: "flex items-center justify-between py-2", children: [_jsx("span", { className: "text-foreground", children: label }), _jsx("span", { className: "flex gap-1", children: keys.map((k) => (_jsx("kbd", { className: "inline-flex h-6 min-w-6 items-center justify-center rounded border border-border bg-muted px-1.5 font-mono text-[11px] text-muted-foreground", children: k }, k))) })] }, label))) })] }) }));
 }

package/dist-lib/components/fs-ui/TableSkeleton.d.ts

@@ -1,6 +1,6 @@
-/** Skelet in de vorm van de echte tabel (desktop) of kaarten (mobiel). */
+/** Skelet in de vorm van de echte tabel (desktop) of kaarten (mobiel). Breedtes in px. */
 export declare function TableSkeleton({ columns, rows }: {
-    columns: string[];
+    columns: number[];
     rows?: number;
 }): import("react").JSX.Element;
 //# sourceMappingURL=TableSkeleton.d.ts.map

package/dist-lib/components/fs-ui/TableSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableSkeleton.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/TableSkeleton.tsx"],"names":[],"mappings":"AAEA,0EAA0E;AAC1E,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,IAAQ,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,EAAE,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,+BAwBxF"}
+{"version":3,"file":"TableSkeleton.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/TableSkeleton.tsx"],"names":[],"mappings":"AAEA,0FAA0F;AAC1F,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,IAAQ,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,EAAE,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,+BA2BxF"}

package/dist-lib/components/fs-ui/TableSkeleton.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Skeleton } from "@flowselections/core";
-/** Skelet in de vorm van de echte tabel (desktop) of kaarten (mobiel). */
+/** Skelet in de vorm van de echte tabel (desktop) of kaarten (mobiel). Breedtes in px. */
 export function TableSkeleton({ columns, rows = 8 }) {
-    return (_jsxs("div", { className: "overflow-hidden rounded-xl border border-border bg-card shadow-sm", "aria-busy": "true", "aria-label": "Laden", children: [_jsxs("div", { className: "hidden md:block", children: [_jsx("div", { className: "grid h-10 items-center gap-4 border-b border-border px-4", style: { gridTemplateColumns: columns.join(" ") }, children: columns.map((_, i) => _jsx(Skeleton, { className: "h-3 w-16" }, i)) }), Array.from({ length: rows }).map((_, r) => (_jsx("div", { className: "grid h-[60px] items-center gap-4 border-b border-border px-4 last:border-0", style: { gridTemplateColumns: columns.join(" ") }, children: columns.map((_, i) => _jsx(Skeleton, { className: i === 1 ? "h-4 w-4/5" : "h-4 w-3/5" }, i)) }, r)))] }), _jsx("div", { className: "divide-y divide-border md:hidden", children: Array.from({ length: Math.min(rows, 5) }).map((_, r) => (_jsxs("div", { className: "space-y-2 p-4", children: [_jsx(Skeleton, { className: "h-4 w-1/2" }), _jsx(Skeleton, { className: "h-3 w-4/5" }), _jsx(Skeleton, { className: "h-3 w-1/3" })] }, r))) })] }));
+    return (_jsxs("div", { className: "min-h-0 flex-1 overflow-hidden rounded-xl border border-border bg-card shadow-sm", "aria-busy": "true", "aria-label": "Laden", children: [_jsx("div", { className: "hidden md:block", children: _jsxs("table", { className: "w-full min-w-[900px] table-fixed", children: [_jsx("colgroup", { children: columns.map((w, i) => _jsx("col", { style: { width: `${w}px` } }, i)) }), _jsx("thead", { children: _jsx("tr", { className: "h-10 border-b border-border", children: columns.map((_, i) => _jsx("th", { className: "px-4", children: _jsx(Skeleton, { className: "h-3 w-16" }) }, i)) }) }), _jsx("tbody", { children: Array.from({ length: rows }).map((_, r) => (_jsx("tr", { style: { height: 60 }, className: "border-b border-border last:border-0", children: columns.map((_, i) => _jsx("td", { className: "px-4 py-0", children: _jsx(Skeleton, { className: i === 1 ? "h-4 w-4/5" : "h-4 w-3/5" }) }, i)) }, r))) })] }) }), _jsx("div", { className: "divide-y divide-border md:hidden", children: Array.from({ length: Math.min(rows, 5) }).map((_, r) => (_jsxs("div", { className: "space-y-2 p-4", children: [_jsx(Skeleton, { className: "h-4 w-1/2" }), _jsx(Skeleton, { className: "h-3 w-4/5" }), _jsx(Skeleton, { className: "h-3 w-1/3" })] }, r))) })] }));
 }

package/dist-lib/components/fs-ui/Toolbar.d.ts

@@ -1,8 +1,13 @@
 import type { ReactNode } from "react";
-/** Werkbalk: zoeken + filters links, extra acties rechts; chips eronder. */
-export declare function Toolbar({ children, right, chips }: {
+/**
+ * Werkbalk exact als Verkooporders: zoekveld, direct rechts "Filters" (opent het
+ * zijpaneel), chips op dezelfde regel; uiterst rechts alleen "Kolommen".
+ */
+export declare function Toolbar({ children, onOpenFilters, filterCount, chips, right, }: {
     children: ReactNode;
-    right?: ReactNode;
+    onOpenFilters?: () => void;
+    filterCount?: number;
     chips?: ReactNode;
+    right?: ReactNode;
 }): import("react").JSX.Element;
 //# sourceMappingURL=Toolbar.d.ts.map

package/dist-lib/components/fs-ui/Toolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/Toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,4EAA4E;AAC5E,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,+BAUhH"}
+{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/Toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC;;;GAGG;AACH,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,aAAa,EACb,WAAe,EACf,KAAK,EACL,KAAK,GACN,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,+BAmBA"}

package/dist-lib/components/fs-ui/Toolbar.js

@@ -1,5 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/** Werkbalk: zoeken + filters links, extra acties rechts; chips eronder. */
-export function Toolbar({ children, right, chips }) {
-    return (_jsxs("div", { className: "flex shrink-0 flex-col gap-2", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: children }), right && _jsx("div", { className: "flex items-center gap-2", children: right })] }), chips] }));
+import { SlidersHorizontal } from "lucide-react";
+import { Button } from "@flowselections/core";
+/**
+ * Werkbalk exact als Verkooporders: zoekveld, direct rechts "Filters" (opent het
+ * zijpaneel), chips op dezelfde regel; uiterst rechts alleen "Kolommen".
+ */
+export function Toolbar({ children, onOpenFilters, filterCount = 0, chips, right, }) {
+    return (_jsxs("div", { className: "shrink-0 flex flex-wrap items-center gap-2", children: [_jsx("div", { className: "min-w-0 flex-1 basis-[calc(100%-3.5rem)] sm:basis-auto sm:flex-none", children: children }), onOpenFilters && (_jsxs(Button, { variant: "outline", size: "sm", onClick: onOpenFilters, "aria-label": "Filters", className: "relative h-10 px-3 sm:h-9", children: [_jsx(SlidersHorizontal, { className: "h-4 w-4 sm:mr-2" }), _jsx("span", { className: "hidden sm:inline", children: "Filters" }), filterCount > 0 && (_jsx("span", { className: "ml-2 inline-flex h-5 min-w-5 items-center justify-center rounded-full bg-primary px-1.5 text-[11px] font-semibold text-primary-foreground", children: filterCount }))] })), chips, right && _jsx("div", { className: "ml-auto flex items-center gap-2", children: right })] }));
 }

package/dist-lib/components/fs-ui/UpdatedAt.d.ts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
-/** "Bijgewerkt hh:mm" met optionele extra tekst. */
-export declare function UpdatedAt({ at, extra }: {
+/** "Bijgewerkt hh:mm" met klokicoon (12 px); extra gegevens in de infoballon. */
+export declare function UpdatedAt({ at, stale, info }: {
     at: number | string | Date | null | undefined;
-    extra?: ReactNode;
-}): import("react").JSX.Element;
+    stale?: boolean;
+    info?: ReactNode;
+}): import("react").JSX.Element | null;
 //# sourceMappingURL=UpdatedAt.d.ts.map

package/dist-lib/components/fs-ui/UpdatedAt.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UpdatedAt.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/UpdatedAt.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,oDAAoD;AACpD,wBAAgB,SAAS,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,+BAW5G"}
+{"version":3,"file":"UpdatedAt.d.ts","sourceRoot":"","sources":["../../../src/components/fs-ui/UpdatedAt.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,iFAAiF;AACjF,wBAAgB,SAAS,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,sCAmBlI"}

package/dist-lib/components/fs-ui/UpdatedAt.js

@@ -1,9 +1,17 @@
-import { Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/** "Bijgewerkt hh:mm" met optionele extra tekst. */
-export function UpdatedAt({ at, extra }) {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Clock } from "lucide-react";
+import { HoverTip } from "./HoverTip.js";
+/** "Bijgewerkt hh:mm" met klokicoon (12 px); extra gegevens in de infoballon. */
+export function UpdatedAt({ at, stale, info }) {
     const d = at ? new Date(at) : null;
     const time = d && !Number.isNaN(d.getTime())
         ? d.toLocaleTimeString("nl-NL", { hour: "2-digit", minute: "2-digit" })
         : null;
-    return (_jsxs("span", { className: "tabular-nums", children: [time ? `Bijgewerkt ${time}` : "Nog niet bijgewerkt", extra ? _jsxs(_Fragment, { children: [" \u00B7 ", extra] }) : null] }));
+    if (!time)
+        return null;
+    const label = stale ? `Niet bijgewerkt sinds ${time}` : `Bijgewerkt ${time}`;
+    const body = (_jsxs("span", { className: "inline-flex items-center gap-1 tabular-nums " + (stale ? "text-warning" : ""), children: [_jsx(Clock, { className: "h-3 w-3", "aria-hidden": true }), label] }));
+    if (!info)
+        return body;
+    return (_jsx(HoverTip, { label: label, side: "bottom", align: "start", content: _jsx("div", { className: "space-y-1 text-xs text-muted-foreground", children: info }), children: body }));
 }

package/dist-lib/integrations/supabase/types.d.ts

@@ -33210,6 +33210,25 @@ export type Database = {
                 };
                 Returns: undefined;
             };
+            aanbiedingsmail_campagnes_lijst: {
+                Args: {
+                    p_limit?: number;
+                    p_offset?: number;
+                    p_status?: string;
+                    p_tot?: string;
+                    p_van?: string;
+                    p_zoek?: string;
+                };
+                Returns: Json;
+            };
+            aanbiedingsmail_campagnes_tellers: {
+                Args: {
+                    p_tot?: string;
+                    p_van?: string;
+                    p_zoek?: string;
+                };
+                Returns: Json;
+            };
             aanbiedingsmail_create_order: {
                 Args: {
                     p_offer_order_id: string;
@@ -33246,6 +33265,15 @@ export type Database = {
                 };
                 Returns: Json;
             };
+            aanbiedingsmail_ontvangers_lijst: {
+                Args: {
+                    p_campaign_id: string;
+                    p_limit?: number;
+                    p_offset?: number;
+                    p_zoek?: string;
+                };
+                Returns: Json;
+            };
             aanbiedingsmail_place_offer_order: {
                 Args: {
                     p_code: string;
@@ -33265,6 +33293,12 @@ export type Database = {
                 };
                 Returns: string;
             };
+            aanbiedingsmail_status_sleutel: {
+                Args: {
+                    p_status: string;
+                };
+                Returns: string;
+            };
             aanbiedingsmail_stock_key: {
                 Args: {
                     p_ref: string;
@@ -35882,6 +35916,19 @@ export type Database = {
                 };
                 Returns: Json;
             };
+            inkoop_artikelen_page: {
+                Args: {
+                    _asc?: boolean;
+                    _limit?: number;
+                    _location?: string;
+                    _offset?: number;
+                    _search?: string;
+                    _sort?: string;
+                    _tab?: string;
+                    _unit?: string;
+                };
+                Returns: Json;
+            };
             inkoop_cancel_line: {
                 Args: {
                     _item_id: string;
@@ -35931,6 +35978,18 @@ export type Database = {
                 Args: never;
                 Returns: string;
             };
+            inkoop_orders_page: {
+                Args: {
+                    _delivery_from?: string;
+                    _delivery_to?: string;
+                    _limit?: number;
+                    _offset?: number;
+                    _search?: string;
+                    _supplier_id?: string;
+                    _tab?: string;
+                };
+                Returns: Json;
+            };
             inkoop_process_request: {
                 Args: {
                     _request_id: string;
@@ -44758,6 +44817,12 @@ export type Database = {
                 };
                 Returns: Json;
             };
+            scan_kar_scans_lezen: {
+                Args: {
+                    p_kar_id: string;
+                };
+                Returns: Json;
+            };
             scan_kar_voortgang: {
                 Args: {
                     p_cart_id: string;
@@ -44774,6 +44839,17 @@ export type Database = {
                 };
                 Returns: Json;
             };
+            scan_karren_overzicht: {
+                Args: {
+                    p_limit?: number;
+                    p_offset?: number;
+                    p_status?: string;
+                    p_tot?: string;
+                    p_van?: string;
+                    p_zoek?: string;
+                };
+                Returns: Json;
+            };
             scan_koppelcode_maken: {
                 Args: {
                     p_scanner_id: string;