@flowselections/floriday-verkoop-module 1.0.7 → 1.0.8

package/dist-lib/components/verkoop/WeekCalendar.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { ChevronDown, ChevronLeft, ChevronRight } from "lucide-react";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from "@flowselections/core";
+const MONTHS_NL = [
+    "januari",
+    "februari",
+    "maart",
+    "april",
+    "mei",
+    "juni",
+    "juli",
+    "augustus",
+    "september",
+    "oktober",
+    "november",
+    "december",
+];
+const WEEKDAYS_NL = ["ma", "di", "wo", "do", "vr", "za", "zo"];
+function isoWeekOf(date) {
+    const target = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));
+    const dayNr = (target.getUTCDay() + 6) % 7;
+    target.setUTCDate(target.getUTCDate() - dayNr + 3);
+    const firstThursday = new Date(Date.UTC(target.getUTCFullYear(), 0, 4));
+    const week = 1 +
+        Math.round(((target.getTime() - firstThursday.getTime()) / 86400000 -
+            3 +
+            ((firstThursday.getUTCDay() + 6) % 7)) /
+            7);
+    return { week, year: target.getUTCFullYear() };
+}
+function mondayOfIsoWeek(week, year) {
+    const jan4 = new Date(Date.UTC(year, 0, 4));
+    const dayNr = (jan4.getUTCDay() + 6) % 7;
+    const monday = new Date(jan4);
+    monday.setUTCDate(jan4.getUTCDate() - dayNr + (week - 1) * 7);
+    return monday;
+}
+export function WeekCalendar({ week, year, onSelect, }) {
+    // Visible month derived from selected week's Monday
+    const initialMonday = mondayOfIsoWeek(week, year);
+    const [viewMonth, setViewMonth] = useState(initialMonday.getUTCMonth());
+    const [viewYear, setViewYear] = useState(initialMonday.getUTCFullYear());
+    const years = useMemo(() => {
+        const arr = [];
+        for (let y = viewYear - 6; y <= viewYear + 6; y++)
+            arr.push(y);
+        return arr;
+    }, [viewYear]);
+    const shiftMonth = (delta) => {
+        let m = viewMonth + delta;
+        let y = viewYear;
+        if (m < 0) {
+            m = 11;
+            y -= 1;
+        }
+        else if (m > 11) {
+            m = 0;
+            y += 1;
+        }
+        setViewMonth(m);
+        setViewYear(y);
+    };
+    // Build 6-week grid starting from Monday on/before the 1st of viewMonth
+    const firstOfMonth = new Date(Date.UTC(viewYear, viewMonth, 1));
+    const firstDayNr = (firstOfMonth.getUTCDay() + 6) % 7;
+    const gridStart = new Date(firstOfMonth);
+    gridStart.setUTCDate(firstOfMonth.getUTCDate() - firstDayNr);
+    const weeks = [];
+    for (let w = 0; w < 6; w++) {
+        const days = [];
+        for (let d = 0; d < 7; d++) {
+            const day = new Date(gridStart);
+            day.setUTCDate(gridStart.getUTCDate() + w * 7 + d);
+            days.push(day);
+        }
+        weeks.push({ weekNum: isoWeekOf(days[0]).week, days });
+    }
+    return (_jsxs("div", { className: "w-[320px] select-none p-3 text-sm", children: [_jsxs("div", { className: "mb-3 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3 text-base font-medium text-primary", children: [_jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: "inline-flex items-center gap-0.5 rounded hover:bg-accent px-1 py-0.5", children: [MONTHS_NL[viewMonth], _jsx(ChevronDown, { className: "h-4 w-4" })] }), _jsx(DropdownMenuContent, { align: "start", className: "max-h-72 overflow-auto", children: MONTHS_NL.map((m, i) => (_jsx(DropdownMenuItem, { onSelect: () => setViewMonth(i), children: m }, m))) })] }), _jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: "inline-flex items-center gap-0.5 rounded hover:bg-accent px-1 py-0.5", children: [viewYear, _jsx(ChevronDown, { className: "h-4 w-4" })] }), _jsx(DropdownMenuContent, { align: "start", className: "max-h-72 overflow-auto", children: years.map((y) => (_jsx(DropdownMenuItem, { onSelect: () => setViewYear(y), children: y }, y))) })] })] }), _jsxs("div", { className: "flex items-center gap-1 text-primary", children: [_jsx("button", { type: "button", onClick: () => shiftMonth(-1), className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-accent", "aria-label": "Vorige maand", children: _jsx(ChevronLeft, { className: "h-4 w-4" }) }), _jsx("button", { type: "button", onClick: () => shiftMonth(1), className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-accent", "aria-label": "Volgende maand", children: _jsx(ChevronRight, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { className: "grid grid-cols-[2rem_repeat(7,1fr)] text-center text-xs text-muted-foreground", children: [_jsx("div", {}), WEEKDAYS_NL.map((d) => (_jsx("div", { className: "py-1", children: d }, d)))] }), _jsx("div", { className: "mt-1 space-y-1", children: weeks.map(({ weekNum, days }) => {
+                    const dayIso = isoWeekOf(days[0]);
+                    const isSelectedWeek = dayIso.week === week && dayIso.year === year;
+                    return (_jsxs("div", { className: "grid grid-cols-[2rem_repeat(7,1fr)] items-center text-center", children: [_jsx("div", { className: "text-xs text-muted-foreground", children: weekNum }), days.map((day, idx) => {
+                                const inMonth = day.getUTCMonth() === viewMonth;
+                                const isFirst = idx === 0;
+                                const isLast = idx === 6;
+                                return (_jsx("button", { type: "button", onClick: () => {
+                                        const iso = isoWeekOf(day);
+                                        onSelect(iso.week, iso.year);
+                                    }, className: [
+                                        "h-8 text-sm transition-colors",
+                                        isSelectedWeek
+                                            ? "bg-primary text-primary-foreground font-medium"
+                                            : inMonth
+                                                ? "text-foreground hover:bg-accent rounded"
+                                                : "text-muted-foreground hover:bg-accent rounded",
+                                        isSelectedWeek && isFirst ? "rounded-l-full" : "",
+                                        isSelectedWeek && isLast ? "rounded-r-full" : "",
+                                    ].join(" "), children: day.getUTCDate() }, day.toISOString()));
+                            })] }, `${dayIso.year}-${weekNum}-${days[0].toISOString()}`));
+                }) })] }));
+}

package/dist-lib/index.d.ts

@@ -1,5 +1,7 @@
 import type { FlowModule } from "@flowselections/core";
 export * from "./_core-safelist";
 export { VerkoopOrdersPage } from "./components/verkoop/VerkoopOrdersPage";
+export { SalesOrderDetailPage } from "./components/verkoop/SalesOrderDetailPage";
+export { CreateOrderPage } from "./components/verkoop/CreateOrderPage";
 export declare const floridayVerkoopModule: FlowModule;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAE3E,eAAO,MAAM,qBAAqB,EAAE,UAiBnC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAEvE,eAAO,MAAM,qBAAqB,EAAE,UAiBnC,CAAC"}

package/dist-lib/index.js

@@ -1,6 +1,8 @@
 import { ShoppingCart, ListOrdered } from "lucide-react";
 export * from "./_core-safelist";
 export { VerkoopOrdersPage } from "./components/verkoop/VerkoopOrdersPage";
+export { SalesOrderDetailPage } from "./components/verkoop/SalesOrderDetailPage";
+export { CreateOrderPage } from "./components/verkoop/CreateOrderPage";
 export const floridayVerkoopModule = {
     id: "verkoop",
     name: "Verkoop",