@eintrek/erp-shell 0.1.51 → 0.1.52

package/dist/index.js

@@ -13,8 +13,8 @@ var navigation = require('next/navigation');
 var Link = require('next/link');
 var reactDom = require('react-dom');
 var nextThemes = require('next-themes');
-var reactQueryDevtools = require('@tanstack/react-query-devtools');
 var axios = require('axios');
+var reactQueryDevtools = require('@tanstack/react-query-devtools');
 
 function _interopNamespaceDefault(e) {
     var n = Object.create(null);
@@ -822,6 +822,64 @@ function isRecordID(segment) {
         /^[0-9a-f]{24,}$/i.test(segment));
 }
 
+let open = false;
+let hosts = 0;
+let declaredApp = null;
+const listeners = new Set();
+function emit() {
+    listeners.forEach(l => l());
+}
+function subscribe(l) {
+    listeners.add(l);
+    return () => {
+        listeners.delete(l);
+    };
+}
+/** Opens the dialog — a no-op when no layout has mounted one. */
+function openHelp() {
+    if (!open) {
+        open = true;
+        emit();
+    }
+}
+function closeHelp() {
+    if (open) {
+        open = false;
+        emit();
+    }
+}
+/** Called by the dialog host on mount; returns its unmount. */
+function registerHelpHost() {
+    hosts += 1;
+    emit();
+    return () => {
+        hosts -= 1;
+        if (hosts <= 0) {
+            hosts = 0;
+            open = false;
+        }
+        emit();
+    };
+}
+function useHelpOpen() {
+    return React.useSyncExternalStore(subscribe, () => open, () => false);
+}
+/** True while a dialog host is mounted, i.e. the ช่วยเหลือ entry works. */
+function useHelpAvailable() {
+    return React.useSyncExternalStore(subscribe, () => hosts > 0, () => false);
+}
+/**
+ * Every app names itself when it builds its app-switcher links
+ * (buildSystemLinks({ activeApp })); the dialog reads that to say which app
+ * a message came from without each app passing it again.
+ */
+function declareHelpApp(app) {
+    declaredApp = app;
+}
+function declaredHelpApp() {
+    return declaredApp;
+}
+
 function isExternalHref(href) {
     return /^https?:\/\//i.test(href) || href.startsWith("//");
 }
@@ -836,6 +894,8 @@ function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref
     const [showAppsMenu, setShowAppsMenu] = React.useState(false);
     const buttonRef = React.useRef(null);
     const [position, setPosition] = React.useState({ top: 0, left: 0 });
+    // Shown where a layout has mounted the help dialog (AppLayoutShell).
+    const helpAvailable = useHelpAvailable();
     const user = session?.user
         ? {
             name: session.user.name || "ผู้ใช้",
@@ -947,7 +1007,10 @@ function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref
                                     setShowAppsMenu(!showAppsMenu);
                                     setShowThemeMenu(false);
                                     setShowLanguageMenu(false);
-                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E41\u0E2D\u0E1B\u0E1E\u0E25\u0E34\u0E40\u0E04\u0E0A\u0E31\u0E19" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showAppsMenu ? "rotate-180" : ""}` })] }), showAppsMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: visibleSystemLinks.map(link => (jsxRuntime.jsxs("button", { type: "button", onClick: () => handleSystemLink(link.href), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [link.icon ?? jsxRuntime.jsx(lucideReact.ExternalLink, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: link.label }), link.active && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, `${link.label}:${link.href}`))) }))] })), jsxRuntime.jsx("button", { onClick: handleSignOut, disabled: isSigningOut, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors disabled:opacity-50 disabled:cursor-not-allowed mt-1", children: isSigningOut ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A..." })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.LogOut, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A" })] })) })] })] })) : null;
+                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E41\u0E2D\u0E1B\u0E1E\u0E25\u0E34\u0E40\u0E04\u0E0A\u0E31\u0E19" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showAppsMenu ? "rotate-180" : ""}` })] }), showAppsMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: visibleSystemLinks.map(link => (jsxRuntime.jsxs("button", { type: "button", onClick: () => handleSystemLink(link.href), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [link.icon ?? jsxRuntime.jsx(lucideReact.ExternalLink, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: link.label }), link.active && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, `${link.label}:${link.href}`))) }))] })), helpAvailable && (jsxRuntime.jsxs("button", { type: "button", onClick: () => {
+                            setIsOpen(false);
+                            openHelp();
+                        }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.CircleHelp, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })), jsxRuntime.jsx("button", { onClick: handleSignOut, disabled: isSigningOut, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors disabled:opacity-50 disabled:cursor-not-allowed mt-1", children: isSigningOut ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A..." })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.LogOut, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A" })] })) })] })] })) : null;
     if (variant === "workspace") {
         return (jsxRuntime.jsx("div", { className: "mt-3.5 border-t border-sidebar-border pt-3", children: jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), "aria-expanded": isOpen, className: "flex w-full items-center gap-[11px] rounded-lg px-3 py-1.5 text-left transition-colors hover:bg-sidebar-accent/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sidebar-ring", children: [jsxRuntime.jsxs(erpTheme.Avatar, { className: "size-[34px] shrink-0 rounded-full border-[3px] border-sidebar-accent", children: [user.avatar ? (jsxRuntime.jsx(erpTheme.AvatarImage, { src: user.avatar, alt: user.name })) : null, jsxRuntime.jsx(erpTheme.AvatarFallback, { className: "rounded-full bg-sidebar-accent text-sm font-medium text-sidebar-accent-foreground", children: getInitials(user.name) })] }), jsxRuntime.jsxs("span", { className: "grid min-w-0 flex-1 leading-tight", children: [jsxRuntime.jsx("strong", { className: "truncate text-[13px] font-semibold", title: user.name, children: user.name }), jsxRuntime.jsx("small", { className: "truncate text-[11px] text-muted-foreground", title: user.email, children: user.email })] }), jsxRuntime.jsx(lucideReact.ChevronsUpDown, { className: "size-3.5 shrink-0 text-muted-foreground" })] }), typeof window !== "undefined" &&
                         reactDom.createPortal(dropdownContent, document.body)] }) }));
@@ -1070,6 +1133,9 @@ const APPS = [
  * disagree with the screen.
  */
 function buildSystemLinks({ orgCode, activeApp, features, }) {
+    // The app names itself here; the help dialog says which app a message
+    // came from by it.
+    declareHelpApp(activeApp);
     if (!orgCode)
         return [];
     return APPS.filter(app => app.id === activeApp ||
@@ -1341,993 +1407,1359 @@ const WORKSPACE_LIGHT_HEADER_VARS = {
 };
 
 /**
- * Top-level app chrome: sticky header, sidebar slot, content gutter and the
- * session/org-context plumbing that both Accounting and HR need. Apps wrap
- * it inside their `SidebarProvider` (server-rendered with the cookie-backed
- * `defaultOpen`) and their `ERPProvider`, then pass app-specific bits as
- * props.
- *
- * The padding contract is deliberately owned here so future style tweaks
- * (e.g. the recent left/right/bottom gutter pass) propagate to both apps via
- * an erp-shell bump — domain components must NOT add their own root padding
- * or content gets indented twice.
+ * The ช่วยเหลือ button in the top bar. Drawn in the header's ink (the
+ * --header-* variables of the workspace chrome, white on the brand chrome).
  */
-function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, signInUrl, selectOrganizationUrl, chrome = "brand", workspaceHeader = "brand", headerEnd, mobileBrand, }) {
-    const { data: session, status } = react.useSession();
-    const { open, setOpen } = useSidebar();
-    const router = navigation.useRouter();
-    const params = navigation.useParams();
-    const code = params?.code;
-    const extendedSession = session;
-    // Track once-authenticated so a transient accessToken drop during the
-    // periodic session refresh (SessionRefreshTrigger every 4 min) doesn't
-    // blank the whole page. The initial-load gate below still handles cold
-    // start; once we've seen a real token we render children optimistically
-    // and let the API layer surface a real 401 if the token actually died.
-    const hasSeenAccessTokenRef = React.useRef(false);
-    React.useEffect(() => {
-        if (extendedSession?.accessToken)
-            hasSeenAccessTokenRef.current = true;
-    }, [extendedSession?.accessToken]);
-    // Find the org from the URL `[code]` so we can detect a context mismatch
-    // (the user bookmarked a different org than the cookie remembers).
-    const orgFromCode = React__namespace.useMemo(() => {
-        if (!code || !organizations.length)
-            return null;
-        return (organizations.find(org => org.code === code || String(org.id) === code) ?? null);
-    }, [code, organizations]);
-    // Sync state: when the URL code points at a different org than the cookie,
-    // trust the URL and update the cookie. Otherwise do nothing — the user
-    // wins ties via the in-app org switcher.
-    React.useEffect(() => {
-        if (!code)
-            return;
-        if (!organizations.length)
-            return;
-        if (!orgFromCode)
-            return;
-        if (String(organizationId) !== String(orgFromCode.id)) {
-            void setOrganizationId(orgFromCode.id);
-        }
-    }, [
-        orgFromCode,
-        organizationId,
-        setOrganizationId,
-        code,
-        organizations.length,
-    ]);
-    // Key for the content subtree. It exists so switching organizations throws
-    // away the previous org's component state — but it must react ONLY to a real
-    // switch. organizationId legitimately passes through null while the context
-    // re-settles (session resolving, cookie write in flight), and keying on that
-    // unmounted and remounted the entire page: forms lost their loaded values,
-    // in-flight edits vanished, and settings pickers snapped back to defaults.
-    //
-    // Holding the last known id makes a transient null a no-op while a genuine
-    // org-to-org switch still changes the key.
-    const lastOrgKeyRef = React__namespace.useRef("no-org");
-    const currentOrgKey = organizationId === null ||
-        organizationId === undefined ||
-        String(organizationId).trim() === ""
-        ? null
-        : String(organizationId);
-    if (currentOrgKey !== null) {
-        lastOrgKeyRef.current = currentOrgKey;
-    }
-    const contentOrgKey = lastOrgKeyRef.current;
-    // Hold the page back until the active organisation is the one the URL names.
-    //
-    // The sync effect above writes the cookie through a server action, which is
-    // a round trip. Until it lands, getOrgFromCookie() still answers with the
-    // previous organisation and every request the page fires on mount carries
-    // it — so /O26000021/work-record asked about O26000033 and was correctly
-    // told there was nothing there. An empty table is the mild version: the
-    // create form posts to the same header, so a record could be filed against
-    // a company the user was not looking at.
-    //
-    // Only while the two genuinely disagree. A code naming no organisation of
-    // the caller's is left to the app to refuse, and a page with no code in its
-    // path is unaffected.
-    const orgContextIsStale = !!orgFromCode &&
-        organizationId !== null &&
-        organizationId !== undefined &&
-        String(organizationId) !== String(orgFromCode.id);
-    // ≤1024px: sidebar renders as a modal overlay (backdrop dims content). >1024px:
-    // sidebar is docked and the content gets a left margin to clear it.
-    const [isSidebarModalLayout, setIsSidebarModalLayout] = React__namespace.useState(false);
-    React.useEffect(() => {
-        const mq = window.matchMedia("(max-width: 1024px)");
-        const sync = () => setIsSidebarModalLayout(mq.matches);
-        sync();
-        mq.addEventListener("change", sync);
-        return () => mq.removeEventListener("change", sync);
-    }, []);
-    // Wait for session to load (initial load only). When refetching/updating we
-    // already have a session — don't flash the full-screen loader.
-    if (status === "loading" && !session) {
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
-    }
-    // Session loaded but no accessToken AND we've never seen one → real auth
-    // failure (token refresh gave nothing back on cold start), bounce through
-    // signin. If we HAVE seen one before, the drop is almost certainly the
-    // in-flight periodic refresh (SessionRefreshTrigger). Don't redirect on
-    // that transient — the JWT callback will settle in a moment and API
-    // calls will keep working with the still-valid cookie.
-    if (status === "authenticated" &&
-        !extendedSession?.accessToken &&
-        !hasSeenAccessTokenRef.current) {
-        if (typeof window !== "undefined") {
-            const url = new URL(signInUrl, window.location.origin);
-            url.searchParams.set("error", "NoAccessToken");
-            url.searchParams.set("callbackUrl", window.location.pathname);
-            window.location.href = url.toString();
-        }
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
-    }
-    // Only blank the page when we've never seen a token — otherwise the
-    // periodic session refresh would visibly flash the loader every 4 min.
-    if (!extendedSession?.accessToken && !hasSeenAccessTokenRef.current) {
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
-    }
-    if (!code) {
-        router.push(selectOrganizationUrl);
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
-    }
-    // When the sidebar is docked-open it consumes 21.5rem on the left; otherwise
-    // the content takes the full width and we add a left gutter inside.
-    const workspace = chrome === "workspace";
-    const contentMargin = open && !isSidebarModalLayout
-        ? workspace
-            ? "ml-[244px]"
-            : "ml-[21.5rem]"
-        : "";
-    const needsLeftGutter = workspace || !(open && !isSidebarModalLayout);
-    const wrap = permissionProvider ?? ((c) => c);
-    return (jsxRuntime.jsxs("div", { className: "flex min-h-screen w-full bg-background", children: [open && (jsxRuntime.jsx("div", { className: "fixed left-0 top-0 z-50 h-screen", children: sidebar })), open && isSidebarModalLayout && (jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E1B\u0E34\u0E14\u0E40\u0E21\u0E19\u0E39", className: "fixed inset-0 z-40 bg-black/50", onClick: () => setOpen(false) })), jsxRuntime.jsx("div", { className: cx("relative flex min-w-0 flex-1 flex-col transition-all", contentMargin), children: jsxRuntime.jsxs("main", { className: cx("flex flex-1 flex-col min-h-screen", workspace ? "gap-0" : "gap-4"), children: [workspace ? (jsxRuntime.jsxs("div", { className: cx("sticky top-0 z-30 shrink-0 w-full", workspaceHeader === "light" &&
-                                "border-b border-border bg-card/85 backdrop-blur-sm"), style: workspaceHeader === "light"
-                                ? WORKSPACE_LIGHT_HEADER_VARS
-                                : WORKSPACE_HEADER_VARS, children: [workspaceHeader === "light" ? null : (jsxRuntime.jsx(HeaderBackground, { className: "rounded-none" })), jsxRuntime.jsxs("header", { className: cx("relative z-10 flex w-full items-center gap-3 text-[var(--header-fg)]", workspaceHeader === "light"
-                                        ? "min-h-[66px] px-3 py-2 sm:min-h-[72px] sm:px-[22px] lg:min-h-[82px] lg:px-8"
-                                        : "min-h-[72px] px-[18px] py-3 sm:px-6 lg:min-h-[88px] lg:px-10"), children: [isSidebarModalLayout ? (
-                                        // As in the design: the mark, then a menu button, and the
-                                        // organisation on the right — no trail, no title, so the
-                                        // organisation's name has the room it needs on a phone.
-                                        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [mobileBrand ? (jsxRuntime.jsx("div", { className: "shrink-0", children: mobileBrand })) : null, jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(!open), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted)] transition-colors hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted)]", children: jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "size-5", strokeWidth: 1.65 }) })] })) : (jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-[var(--header-fg-muted)] hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] [&_svg]:!text-current" })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-0.5", children: [jsxRuntime.jsx("div", { className: "hidden min-w-0 sm:block", children: breadcrumb }), jsxRuntime.jsx("div", { id: "header-title", className: "min-w-0 max-sm:hidden" })] }), headerEnd ? (jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-3 sm:gap-5", children: headerEnd })) : null] })] })) : (jsxRuntime.jsxs("div", { className: "sticky top-0 z-30 shrink-0 w-full", children: [jsxRuntime.jsx(HeaderBackground, {}), jsxRuntime.jsxs("header", { className: "relative shrink-0 gap-2 py-4 h-auto min-h-[123.5px] w-full z-10", children: [jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2 px-3 sm:px-4 lg:px-6", children: [jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-white hover:bg-white/10" }), jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: breadcrumb }), headerEnd ? (jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-3", children: headerEnd })) : null] }), jsxRuntime.jsx("div", { id: "header-title" })] })] })), jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { className: "relative z-10 min-h-[calc(100vh-8rem)]", children: jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center", children: jsxRuntime.jsxs("div", { className: "space-y-4 text-center", children: [jsxRuntime.jsx("div", { className: "mx-auto h-8 w-8 animate-spin rounded-full border-b-2 border-primary" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14..." })] }) }) }), children: jsxRuntime.jsx("div", { className: workspace
-                                    ? "relative z-10 px-[18px] pt-[26px] pb-4 sm:px-6 lg:px-10 lg:pt-[38px]"
-                                    : cx("relative z-10 pr-6", needsLeftGutter && "pl-6"), children: orgContextIsStale ? loadingComponent : wrap(children) }, `org-${contentOrgKey}`) })] }) })] }));
-}
-/** Local tiny classnames helper — avoids pulling clsx/tailwind-merge into
- *  the shell just for the layout file. Falsy values are skipped. */
-function cx(...parts) {
-    return parts.filter(Boolean).join(" ");
+function HelpButton({ className }) {
+    return (jsxRuntime.jsx("button", { type: "button", onClick: openHelp, "aria-label": "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", title: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted,#ffffffc7)] transition-colors hover:bg-[var(--header-hover,#ffffff1f)] hover:text-[var(--header-fg,#ffffff)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted,#ffffffc7)]" +
+            (className ? ` ${className}` : ""), children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
 }
 
 /**
- * The product mark at the top of the workspace sidebar: the app icon, the
- * name, and a spaced caption beneath it.
+ * This package's version, attached to help messages so the back office can
+ * tell which shell a report came from. Keep in step with package.json.
  */
-function WorkspaceBrand({ name, caption, mark, href, compact = false, className, }) {
-    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: erpTheme.cn("grid shrink-0 place-items-center overflow-hidden rounded-[14px] [&>img]:size-full [&>img]:object-cover", compact ? "size-9 rounded-[11px]" : "size-11"), children: mark }), compact ? (jsxRuntime.jsx("span", { className: "sr-only", children: name })) : (jsxRuntime.jsxs("span", { className: "min-w-0", children: [jsxRuntime.jsx("span", { className: "block truncate text-[25px] leading-tight font-extrabold tracking-[-0.05em]", children: name }), caption ? (jsxRuntime.jsx("small", { className: "-mt-0.5 block truncate text-[9px] font-semibold tracking-[0.29em] text-muted-foreground", children: caption })) : null] }))] }));
-    const cls = erpTheme.cn("flex items-center gap-[11px] rounded-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", !compact && "px-4", className);
-    return href ? (jsxRuntime.jsx(Link, { href: href, className: cls, "aria-label": compact ? name : undefined, children: body })) : (jsxRuntime.jsx("div", { className: cls, children: body }));
-}
+const SHELL_VERSION = "0.1.52";
 
-function isExternal(href) {
-    return /^https?:\/\//i.test(href);
+const HELP_APP_LABEL = {
+    platform: "แพลตฟอร์ม",
+    accounx: "Accounx",
+    peoplx: "Peoplx",
+    plannex: "Plannex",
+    invenx: "Invenx",
+    other: "อื่น ๆ",
+};
+function originOf(value) {
+    if (!value)
+        return null;
+    try {
+        return new URL(value).origin;
+    }
+    catch {
+        return null;
+    }
 }
 /**
- * The card at the foot of the workspace sidebar that points someone who
- * does not know where to start at the place that will tell them.
+ * Which app this page is: what the host said, what the app declared to the
+ * app switcher, then the production sub-domain, then the app URLs the build
+ * was given (local development). "other" when none of them tells.
  */
-function SidebarHelpCard({ title, description, actionLabel, href, icon, className, }) {
-    const external = isExternal(href);
-    const action = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [actionLabel, jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-[15px]" })] }));
-    const actionClass = "mt-3 flex w-full items-center justify-between text-xs font-semibold text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded";
-    return (jsxRuntime.jsxs("div", { className: erpTheme.cn("mx-1.5 mb-5 rounded-[13px] border border-primary/10 bg-gradient-to-br from-primary/[0.06] to-primary/[0.02] px-3.5 py-4", className), children: [jsxRuntime.jsx("span", { className: "mb-[7px] block text-primary/70", children: icon ?? jsxRuntime.jsx(lucideReact.Compass, { className: "size-6", strokeWidth: 1.6 }) }), jsxRuntime.jsx("strong", { className: "block text-xs font-semibold", children: title }), description ? (jsxRuntime.jsx("p", { className: "mt-[7px] text-xs leading-[1.7] text-muted-foreground", children: description })) : null, external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: actionClass, children: action })) : (jsxRuntime.jsx(Link, { href: href, className: actionClass, children: action }))] }));
-}
-/** A quiet row under the help card — the manual, the support chat. */
-function SidebarHelpLink({ label, href, icon, className }) {
-    const external = isExternal(href);
-    const cls = erpTheme.cn("flex w-full items-center gap-3 rounded-[10px] px-3.5 py-[11px] text-xs font-medium text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", className);
-    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon ? jsxRuntime.jsx("span", { className: "shrink-0 [&>svg]:size-[18px]", children: icon }) : null, jsxRuntime.jsx("span", { className: "flex-1 truncate", children: label }), external ? jsxRuntime.jsx(lucideReact.ArrowUpRight, { className: "size-4 shrink-0" }) : null] }));
-    return external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: cls, children: body })) : (jsxRuntime.jsx(Link, { href: href, className: cls, children: body }));
+function detectHelpApp(explicit) {
+    if (explicit)
+        return explicit;
+    const declared = declaredHelpApp();
+    if (declared)
+        return declared;
+    if (typeof window === "undefined")
+        return "other";
+    const host = window.location.hostname.toLowerCase();
+    if (/^(accounx|erp|www\.erp)\./.test(host))
+        return "accounx";
+    if (/^(peoplx|hr)\./.test(host))
+        return "peoplx";
+    if (host.startsWith("plannex."))
+        return "plannex";
+    if (host.startsWith("invenx."))
+        return "invenx";
+    if (host.startsWith("platform.") || host === "antniti.com" || host === "www.antniti.com") {
+        return "platform";
+    }
+    const here = window.location.origin;
+    const configured = [
+        ["platform", process.env.NEXT_PUBLIC_PLATFORM_URL],
+        ["accounx", process.env.NEXT_PUBLIC_ACCOUNTING_URL],
+        ["invenx", process.env.NEXT_PUBLIC_INVENX_URL],
+        ["plannex", process.env.NEXT_PUBLIC_PLANNEX_URL],
+        ["peoplx", process.env.NEXT_PUBLIC_HR_URL],
+    ];
+    for (const [id, url] of configured) {
+        if (originOf(url) === here)
+            return id;
+    }
+    return "other";
+}
+/** "Chrome 141" and "macOS" from a user agent — enough to reproduce. */
+function describeBrowser(ua) {
+    const pick = (re) => ua.match(re)?.[1] ?? "";
+    let browser = "";
+    if (/\bLine\//i.test(ua))
+        browser = `LINE ${pick(/\bLine\/([\d.]+)/i)}`;
+    else if (/\bEdg(A|iOS)?\//.test(ua))
+        browser = `Edge ${pick(/\bEdg(?:A|iOS)?\/(\d+)/)}`;
+    else if (/\bOPR\//.test(ua))
+        browser = `Opera ${pick(/\bOPR\/(\d+)/)}`;
+    else if (/SamsungBrowser\//.test(ua))
+        browser = `Samsung Internet ${pick(/SamsungBrowser\/(\d+)/)}`;
+    else if (/\b(Firefox|FxiOS)\//.test(ua))
+        browser = `Firefox ${pick(/\b(?:Firefox|FxiOS)\/(\d+)/)}`;
+    else if (/\bCriOS\//.test(ua))
+        browser = `Chrome ${pick(/\bCriOS\/(\d+)/)}`;
+    else if (/(\b|Headless)Chrome\//.test(ua))
+        browser = `Chrome ${pick(/(?:\b|Headless)Chrome\/(\d+)/)}`;
+    else if (/\bSafari\//.test(ua))
+        browser = `Safari ${pick(/\bVersion\/([\d.]+)/)}`;
+    let platform = "";
+    if (/\b(iPhone|iPad|iPod)\b/.test(ua)) {
+        platform = `iOS ${pick(/\bOS (\d+[_\d]*)/).replace(/_/g, ".")}`;
+    }
+    else if (/\bAndroid\b/.test(ua)) {
+        platform = `Android ${pick(/\bAndroid ([\d.]+)/)}`;
+    }
+    else if (/\bWindows\b/.test(ua)) {
+        platform = "Windows";
+    }
+    else if (/\bMac OS X\b/.test(ua)) {
+        platform = "macOS";
+    }
+    else if (/\bCrOS\b/.test(ua)) {
+        platform = "ChromeOS";
+    }
+    else if (/\bLinux\b/.test(ua)) {
+        platform = "Linux";
+    }
+    return { browser: browser.trim(), platform: platform.trim() };
 }
-
 /**
- * Central "no access" screen shared by every policy check (route-level
- * PermissionProvider and page-level PermissionGateShell). One look everywhere:
- * an illustration, a 403 headline, the page-specific reason, and recovery
- * actions.
+ * The deployed build: NEXT_PUBLIC_APP_VERSION when the app sets one, else
+ * the Next build id in the page's own script paths (the build time, as every
+ * app's generateBuildId writes it).
  */
-function AccessDenied({ title = "ขออภัย, คุณไม่มีสิทธิ์เข้าถึงหน้านี้ (403)", message = "คุณไม่มีสิทธิ์เข้าถึงหน้านี้ ขออภัยในความไม่สะดวก", homeHref, homeLabel = "กลับไปหน้าหลัก", supportHref, supportLabel = "ติดต่อฝ่ายสนับสนุน", fullScreen = true, className, }) {
-    // "/" is not the home page inside an app — it bounces to organization
-    // selection, so the button read "กลับไปหน้าหลัก" and dropped the user into a
-    // picker for the org they were already in. Send them to that org's home.
-    const params = navigation.useParams();
-    const code = typeof params?.code === "string" ? params.code : "";
-    const homeTarget = homeHref ?? (code ? `/${code}` : "/");
-    const go = (href) => {
-        if (typeof window !== "undefined")
-            window.location.href = href;
+function readAppVersion() {
+    const declared = process.env.NEXT_PUBLIC_APP_VERSION?.trim();
+    if (declared)
+        return declared;
+    if (typeof document === "undefined")
+        return "";
+    const ignore = new Set(["chunks", "css", "media", "development", "webpack"]);
+    for (const s of Array.from(document.querySelectorAll("script[src]"))) {
+        const m = s.src.match(/\/_next\/static\/([^/]+)\//);
+        if (m && !ignore.has(m[1]))
+            return m[1];
+    }
+    return "";
+}
+function pageUrl() {
+    if (typeof window === "undefined")
+        return "";
+    const { origin, pathname, search } = window.location;
+    return `${origin}${pathname}${search}`;
+}
+/** Everything attached to a message, read at the moment it is sent. */
+function collectHelpContext(orgCode) {
+    if (typeof window === "undefined")
+        return { shell_version: SHELL_VERSION };
+    const { browser, platform } = describeBrowser(window.navigator.userAgent || "");
+    let timeZone = "";
+    try {
+        timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone || "";
+    }
+    catch {
+        timeZone = "";
+    }
+    const ctx = {
+        page_url: pageUrl(),
+        page_title: document.title || undefined,
+        org_code: orgCode || undefined,
+        app_version: readAppVersion() || undefined,
+        shell_version: SHELL_VERSION,
+        browser: browser || undefined,
+        platform: platform || undefined,
+        screen: `${window.screen.width}x${window.screen.height}`,
+        viewport: `${window.innerWidth}x${window.innerHeight}`,
+        language: window.navigator.language || undefined,
+        time_zone: timeZone || undefined,
     };
-    const wrapperClass = [
-        "flex min-w-0 flex-1 items-center justify-center p-4",
-        fullScreen ? "min-h-[70vh]" : "",
-        className ?? "",
+    return ctx;
+}
+/** The short line under the form, "ข้อมูลที่แนบ: …". */
+function describeAttached(app, ctx, email) {
+    let path = "";
+    if (ctx.page_url) {
+        try {
+            path = new URL(ctx.page_url).pathname;
+        }
+        catch {
+            path = ctx.page_url;
+        }
+    }
+    // The organisation code is shown on its own; the path after it says where.
+    if (ctx.org_code && path.startsWith(`/${ctx.org_code}`)) {
+        path = path.slice(ctx.org_code.length + 1);
+    }
+    if (path === "/")
+        path = "";
+    const browser = [ctx.browser, ctx.platform && `(${ctx.platform})`].filter(Boolean).join(" ");
+    return [
+        HELP_APP_LABEL[app],
+        ctx.org_code,
+        path,
+        email || undefined,
+        browser || undefined,
+        ctx.app_version,
     ]
         .filter(Boolean)
-        .join(" ");
-    return (jsxRuntime.jsx("div", { className: wrapperClass, children: jsxRuntime.jsx("div", { className: "relative w-full max-w-3xl overflow-hidden rounded-2xl border border-border/60 bg-card/60 p-8 shadow-sm backdrop-blur sm:p-10", children: jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-8 text-center sm:flex-row sm:text-left", children: [jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 rounded-full bg-destructive/20 blur-2xl" }), jsxRuntime.jsx("div", { className: "relative flex h-28 w-28 items-center justify-center rounded-3xl border border-border/60 bg-gradient-to-br from-muted/40 to-background shadow-inner", children: jsxRuntime.jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-full border border-destructive/40 bg-destructive/10", children: jsxRuntime.jsx(lucideReact.Ban, { className: "h-8 w-8 text-destructive", strokeWidth: 2.5 }) }) })] }), jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [jsxRuntime.jsx("h1", { className: "text-xl font-bold text-foreground sm:text-2xl", children: title }), message ? (jsxRuntime.jsx("p", { className: "mt-3 whitespace-pre-line text-sm leading-relaxed text-muted-foreground sm:text-base", children: message })) : null, jsxRuntime.jsxs("div", { className: "mt-6 flex flex-col gap-3 sm:flex-row", children: [jsxRuntime.jsxs(erpTheme.Button, { type: "button", onClick: () => go(homeTarget), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Home, { className: "mr-2 h-4 w-4" }), homeLabel] }), supportHref ? (jsxRuntime.jsxs(erpTheme.Button, { type: "button", variant: "outline", onClick: () => go(supportHref), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Headset, { className: "mr-2 h-4 w-4" }), supportLabel] })) : null] })] })] }) }) }));
+        .join(" · ");
 }
 
-const EMPLOYEE_RECORD_REQUIRED = "EMPLOYEE_RECORD_REQUIRED";
-const EMPLOYEE_RECORD_REQUIRED_EVENT = "erp:employee-record-required";
-const EMPLOYEE_RECORD_OK_EVENT = "erp:employee-record-ok";
-/**
- * Shown when the API refuses every request because the signed-in account has
- * no employee record in this organisation.
- *
- * A gate rather than a banner. Leave, attendance, approvals and payslips all
- * identify a person by that record, so once the server started enforcing it
- * every call fails — and without something that says so, the app becomes a
- * screen of error toasts with no explanation and no way forward.
- */
-function EmployeeRequiredGate({ platformBaseUrl, }) {
-    const [blocked, setBlocked] = React.useState(false);
-    const params = navigation.useParams();
-    const code = params?.code ?? "";
-    React.useEffect(() => {
-        const onBlocked = () => setBlocked(true);
-        const onOk = () => setBlocked(false);
-        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
-        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
-        return () => {
-            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
-            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
-        };
-    }, []);
-    if (!blocked)
+const TOKEN_TTL_MS = 30000;
+let cachedToken = null;
+let cachedAt = 0;
+let inFlightTokenPromise = null;
+const readSessionToken = async () => {
+    const response = await fetch("/api/auth/session", {
+        credentials: "include",
+        cache: "no-store",
+    });
+    if (!response.ok)
         return null;
-    const base = platformBaseUrl?.replace(/\/$/, "") ?? "";
-    const createHref = code ? `${base}/${code}/employee/create` : `${base}/`;
-    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-[100] flex items-center justify-center bg-background/95 p-6 backdrop-blur-sm", children: jsxRuntime.jsxs("div", { className: "w-full max-w-md space-y-5 text-center", children: [jsxRuntime.jsx(lucideReact.ContactRound, { className: "mx-auto h-12 w-12 text-muted-foreground" }), jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "\u0E1A\u0E31\u0E0D\u0E0A\u0E35\u0E19\u0E35\u0E49\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49\u0E1C\u0E39\u0E01\u0E01\u0E31\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E25\u0E32 \u0E25\u0E07\u0E40\u0E27\u0E25\u0E32 \u0E40\u0E1A\u0E34\u0E01\u0E40\u0E07\u0E34\u0E19 \u0E41\u0E25\u0E30\u0E01\u0E32\u0E23\u0E2D\u0E19\u0E38\u0E21\u0E31\u0E15\u0E34 \u0E23\u0E30\u0E1A\u0E38\u0E15\u0E31\u0E27\u0E04\u0E19\u0E08\u0E32\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19 \u0E08\u0E36\u0E07\u0E22\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E43\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49" })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap justify-center gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { onClick: () => window.location.reload(), children: "\u0E25\u0E2D\u0E07\u0E43\u0E2B\u0E21\u0E48" }), jsxRuntime.jsx(erpTheme.Button, { variant: "outline", asChild: true, children: jsxRuntime.jsxs("a", { href: createHref, children: [jsxRuntime.jsx(lucideReact.UserPlus, { className: "mr-1 h-4 w-4" }), "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19"] }) })] }), jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "\u0E16\u0E49\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E41\u0E01\u0E49\u0E44\u0E02 \u0E43\u0E2B\u0E49\u0E41\u0E08\u0E49\u0E07\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] }) }));
-}
-
-const shellClassName = "flex min-w-0 flex-1 flex-col gap-6 overflow-x-hidden";
-/**
- * Shared layout for “กำลังตรวจสอบสิทธิ์” (skeleton) and “ไม่มีสิทธิ์” (message).
- * Renders `children` only when policy is loaded and access is granted.
- */
-function PermissionGateShell({ policyLoading, hasPolicyAccess, deniedMessage, children, skeletonCount = 6, skeletonGridClassName = "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3", skeletonVariant = "kpi", }) {
-    if (policyLoading) {
-        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx("div", { className: skeletonGridClassName, children: Array.from({ length: skeletonCount }).map((_, i) => (jsxRuntime.jsx(erpTheme.Card, { children: skeletonVariant === "kpi" ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(erpTheme.CardHeader, { className: "flex flex-row items-center justify-between pb-2", children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-4 rounded" })] }), jsxRuntime.jsxs(erpTheme.CardContent, { children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-32 mb-2" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-3 w-20" })] })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(erpTheme.CardHeader, { className: "pb-2", children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }) }), jsxRuntime.jsx(erpTheme.CardContent, { children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-16" }) })] })) }, i))) }) }));
+    const session = (await response.json());
+    return session.accessToken ?? null;
+};
+const getAccessToken = async (forceRefresh = false) => {
+    const now = Date.now();
+    if (!forceRefresh && cachedToken && now - cachedAt < TOKEN_TTL_MS) {
+        return cachedToken;
     }
-    if (!hasPolicyAccess) {
-        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx(AccessDenied, { message: deniedMessage }) }));
+    if (!inFlightTokenPromise) {
+        inFlightTokenPromise = readSessionToken()
+            .then(token => {
+            cachedToken = token;
+            cachedAt = Date.now();
+            return token;
+        })
+            .finally(() => {
+            inFlightTokenPromise = null;
+        });
+    }
+    return inFlightTokenPromise;
+};
+const clearAccessTokenCache = () => {
+    cachedToken = null;
+    cachedAt = 0;
+};
+
+class ApiError extends Error {
+    constructor(message, options) {
+        super(message);
+        Object.defineProperty(this, "status", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "code", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "field", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "details", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.name = "ApiError";
+        this.status = options?.status;
+        this.code = options?.code;
+        this.field = options?.field;
+        this.details = options?.details;
     }
-    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
 }
+const toApiError = (error) => {
+    if (error instanceof ApiError)
+        return error;
+    if (axios.isAxiosError(error)) {
+        const axiosErr = error;
+        const message = axiosErr.response?.data?.message ||
+            axiosErr.response?.data?.error ||
+            axiosErr.message ||
+            "Request failed";
+        return new ApiError(message, {
+            status: axiosErr.response?.status,
+            code: axiosErr.response?.data?.code,
+            field: axiosErr.response?.data?.field,
+            details: axiosErr.response?.data?.details,
+        });
+    }
+    if (error instanceof Error) {
+        return new ApiError(error.message);
+    }
+    return new ApiError(String(error));
+};
 
-const PermissionRulesContext = React.createContext(undefined);
-/**
- * Generic provider — the consumer app passes in `data` (live fetch) and
- * `fallbackPolicies` (static JSON). All apps share the same mapping logic
- * (build a flat map of route_key/policy_key → required child groups).
- */
-function PermissionRulesProvider({ children, data, isLoading = false, isError = false, fallbackPolicies = [], }) {
-    const rulesMap = React.useMemo(() => {
-        const m = {};
-        if (!data?.routes)
-            return m;
-        for (const row of data.routes) {
-            m[row.route_key] = row.required_child_groups ?? [];
+const isPlainObject = (value) => Object.prototype.toString.call(value) === "[object Object]";
+const visit = (value, cb) => {
+    if (Array.isArray(value)) {
+        value.forEach(item => visit(item, cb));
+        return;
+    }
+    if (!isPlainObject(value)) {
+        return;
+    }
+    cb(value);
+    Object.values(value).forEach(item => visit(item, cb));
+};
+const validateGoodsReceiptChecks = (data) => {
+    let invalidPath = null;
+    const isCheckStatus = (v) => v === undefined || v === null || v === "pass" || v === "fail";
+    const isCompareStatus = (v) => v === undefined || v === null || v === "match" || v === "mismatch";
+    visit(data, node => {
+        if (invalidPath)
+            return;
+        if ("quantity_check" in node && !isCheckStatus(node.quantity_check)) {
+            invalidPath = "quantity_check";
+            return;
         }
-        return m;
-    }, [data]);
-    const policiesMap = React.useMemo(() => {
-        const m = {};
-        for (const row of fallbackPolicies) {
-            m[row.policy_key] = row.required_child_groups ?? [];
+        if ("quality_check" in node && !isCheckStatus(node.quality_check)) {
+            invalidPath = "quality_check";
+            return;
         }
-        if (data?.policies?.length) {
-            for (const row of data.policies) {
-                m[row.policy_key] = row.required_child_groups ?? [];
-            }
+        if ("compare_with_reference" in node &&
+            !isCompareStatus(node.compare_with_reference)) {
+            invalidPath = "compare_with_reference";
         }
-        return m;
-    }, [data, fallbackPolicies]);
-    const value = React.useMemo(() => ({
-        rulesMap,
-        policiesMap,
-        isLoading,
-        isError,
-        updatedAt: data?.updated_at ?? null,
-    }), [rulesMap, policiesMap, isLoading, isError, data?.updated_at]);
-    return (jsxRuntime.jsx(PermissionRulesContext.Provider, { value: value, children: children }));
-}
-/**
- * Read the permission rules. Outside the provider, report loading so
- * fail-closed consumers (nav / gates) do not treat empty maps as "allow all".
- */
-function usePermissionRules() {
-    const ctx = React.useContext(PermissionRulesContext);
-    if (!ctx) {
+    });
+    if (invalidPath) {
         return {
-            rulesMap: {},
-            policiesMap: {},
-            isLoading: true,
-            isError: false,
-            updatedAt: null,
+            valid: false,
+            message: "รูปแบบข้อมูลไม่ถูกต้อง: ฟิลด์ตรวจรับต้องเป็น enum string (quantity/quality: pass|fail, compare: match|mismatch)",
         };
     }
-    return ctx;
-}
-
-/**
- * Strip the org `[code]` prefix from a pathname so we can look it up in the
- * permission rules map. `/O12345/setting/foo` → `/setting/foo`. Single-segment
- * paths (e.g. `/select-organization`) keep their leading slash.
- *
- * Also normalizes the user-role subtab aliases — both `purchase-doc` and
- * `sales-doc` are gated by the same `members` rule because the UI shows
- * the same management screen with different filters.
- */
-function normalizePathnameForPermissionRules(pathname) {
-    const parts = pathname.split("/").filter(Boolean);
-    const path = parts.length <= 1 ? "/" : "/" + parts.slice(1).join("/");
-    return path.replace(/\/user-role\/(purchase-doc|sales-doc)$/, "/user-role/members");
-}
-function hasRule(rulesMap, routeKey) {
-    return Object.prototype.hasOwnProperty.call(rulesMap, routeKey);
-}
-/**
- * Resolve UI route permissions for a pathname.
- *
- * - Exact / `[param]` pattern match → matched
- * - Parent-prefix inherit only when the parent rule has a **non-empty**
- *   role list (restrictive inherit). Explicitly public parents (`[]`) do
- *   not open all children.
- * - No match → `{ matched: false }` (fail closed — never treat as public)
- */
-function resolveUiRoutePermission(pathname, rulesMap) {
-    const normalized = normalizePathnameForPermissionRules(pathname);
-    if (hasRule(rulesMap, normalized)) {
-        return { matched: true, roles: rulesMap[normalized] ?? [] };
+    return { valid: true };
+};
+const runGlobalRequestPrecheck = (config) => {
+    const method = (config.method || "get").toLowerCase();
+    const isWriteMethod = ["post", "put", "patch"].includes(method);
+    if (!isWriteMethod || config.data === undefined || config.data === null) {
+        return { valid: true };
     }
-    const pathSegments = normalized.split("/").filter(Boolean);
-    for (const [pattern, roles] of Object.entries(rulesMap)) {
-        const patternSegments = pattern.split("/").filter(Boolean);
-        if (patternSegments.length !== pathSegments.length)
-            continue;
-        let matches = true;
-        for (let i = 0; i < patternSegments.length; i++) {
-            const patternSegment = patternSegments[i];
-            const pathSegment = pathSegments[i];
-            if (patternSegment.startsWith("[") && patternSegment.endsWith("]")) {
-                if (!pathSegment) {
-                    matches = false;
-                    break;
-                }
-            }
-            else if (patternSegment !== pathSegment) {
-                matches = false;
-                break;
-            }
-        }
-        if (matches) {
-            return { matched: true, roles: roles ?? [] };
-        }
+    if (typeof FormData !== "undefined" && config.data instanceof FormData) {
+        return { valid: true };
     }
-    // Parent-prefix: /leave/types/abc → /leave/types (non-empty roles only)
-    for (let len = pathSegments.length - 1; len >= 1; len--) {
-        const parent = "/" + pathSegments.slice(0, len).join("/");
-        if (hasRule(rulesMap, parent) && (rulesMap[parent]?.length ?? 0) > 0) {
-            return { matched: true, roles: rulesMap[parent] ?? [] };
+    return validateGoodsReceiptChecks(config.data);
+};
+
+const isBrowser = () => typeof window !== "undefined";
+const isAuthEndpoint = (url) => !!url && url.includes("/api/auth/");
+const isAuthPage = () => isBrowser() && window.location.pathname.startsWith("/auth/");
+const getOrgFromCookie = () => {
+    if (!isBrowser())
+        return null;
+    const cookies = document.cookie.split(";").map(cookie => cookie.trim());
+    const orgCookie = cookies.find(cookie => cookie.startsWith("erp.organizationId="));
+    if (!orgCookie)
+        return null;
+    const raw = orgCookie.substring("erp.organizationId=".length);
+    return raw ? decodeURIComponent(raw) : null;
+};
+const redirectToLogout = async () => {
+    if (!isBrowser() || isAuthPage())
+        return;
+    localStorage.clear();
+    sessionStorage.clear();
+    setOrganizationId(null);
+    clearAccessTokenCache();
+    await react.signOut({ callbackUrl: "/auth/signin" });
+};
+const instance = axios.create({
+    baseURL: process.env.NEXT_PUBLIC_API_URL,
+    headers: { "Content-Type": "application/json" },
+    paramsSerializer: params => {
+        const searchParams = new URLSearchParams();
+        Object.entries(params || {}).forEach(([key, value]) => {
+            if (Array.isArray(value)) {
+                value.forEach(v => searchParams.append(key, String(v)));
+            }
+            else if (value !== undefined && value !== null) {
+                searchParams.append(key, String(value));
+            }
+        });
+        return searchParams.toString();
+    },
+});
+instance.interceptors.request.use(async (config) => {
+    if (!config.headers) {
+        config.headers = new axios.AxiosHeaders();
+    }
+    if (config.data instanceof FormData && config.headers) {
+        delete config.headers["Content-Type"];
+    }
+    if (!isBrowser())
+        return config;
+    const token = await getAccessToken(false);
+    if (token) {
+        config.headers.Authorization = `Bearer ${token}`;
+    }
+    // localStorage first, cookie second.
+    //
+    // Both are written by the same state machine, but not at the same moment:
+    // setOrganizationId writes localStorage synchronously and then awaits a
+    // server action for the cookie. Preferring the cookie meant every request
+    // fired during that round trip carried the previous organisation — while
+    // the query params, built from React state, already carried the new one.
+    //
+    // The backend scopes by this header and ignores organization_id in the
+    // query, so those requests asked for organisation A and were handed B, and
+    // the answer landed in the cache under A's key. No amount of cache clearing
+    // reaches that: the entry is wrong, not stale.
+    const organizationId = getOrganizationId() || getOrgFromCookie();
+    if (organizationId) {
+        config.headers["X-Organization-ID"] = organizationId;
+    }
+    const precheck = runGlobalRequestPrecheck(config);
+    if (!precheck.valid) {
+        throw new ApiError(precheck.message || "Invalid request payload");
+    }
+    return config;
+});
+let refreshPromise = null;
+const refreshTokenSingleFlight = async () => {
+    if (!refreshPromise) {
+        refreshPromise = getAccessToken(true).finally(() => {
+            refreshPromise = null;
+        });
+    }
+    return refreshPromise;
+};
+instance.interceptors.response.use(response => {
+    // Any successful call means the session can act in this organisation
+    // after all. Without this the gate, once raised, stayed up through a
+    // whole working session — including the seconds between an administrator
+    // adding somebody and the employee record existing.
+    if (typeof window !== "undefined") {
+        window.dispatchEvent(new CustomEvent("erp:employee-record-ok"));
+    }
+    return response;
+}, async (error) => {
+    const originalRequest = error.config;
+    const requestUrl = originalRequest?.url || error.config?.url;
+    if (error.response?.status === 401 &&
+        originalRequest &&
+        !originalRequest._retry &&
+        !isAuthEndpoint(requestUrl) &&
+        !isAuthPage()) {
+        originalRequest._retry = true;
+        const newToken = await refreshTokenSingleFlight();
+        if (newToken && originalRequest.headers) {
+            originalRequest.headers.Authorization = `Bearer ${newToken}`;
+            return instance(originalRequest);
         }
+        await redirectToLogout();
+        return Promise.reject(toApiError(error));
     }
-    return { matched: false, roles: [] };
-}
-/**
- * Returns the required child-group segments for a page pathname.
- *
- * Prefer {@link resolveUiRoutePermission} when you need to distinguish
- * "explicitly public (`[]`)" from "no rule (deny)". This helper returns
- * `[]` for both cases and is kept for backward compatibility.
- */
-function getRequiredChildGroups(pathname, rulesMap) {
-    return resolveUiRoutePermission(pathname, rulesMap).roles;
-}
+    // The server refuses every organisation-scoped call when the account has
+    // no employee record. Announce it once so a gate can explain it, instead
+    // of letting each failed query raise its own toast.
+    if (error.response?.status === 403) {
+        const body = error.response.data;
+        if (body?.code === "EMPLOYEE_RECORD_REQUIRED" && typeof window !== "undefined") {
+            window.dispatchEvent(new CustomEvent("erp:employee-record-required"));
+        }
+    }
+    return Promise.reject(toApiError(error));
+});
+
+const hasPaginationShape = (payload) => {
+    return ("total" in payload ||
+        "page" in payload ||
+        "per_page" in payload ||
+        "total_pages" in payload ||
+        "has_next" in payload ||
+        "has_prev" in payload ||
+        "pagination" in payload);
+};
+const isEnvelope = (payload) => {
+    return ("success" in payload || "message" in payload) && !hasPaginationShape(payload);
+};
+const unwrapApiResponse = (payload) => {
+    if (!payload || typeof payload !== "object") {
+        return payload;
+    }
+    const record = payload;
+    if ("data" in record &&
+        record.data !== undefined &&
+        isEnvelope(record)) {
+        return record.data;
+    }
+    return payload;
+};
 
-function DeniedCard() {
-    return (jsxRuntime.jsx(AccessDenied, { message: "\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49 \u0E2B\u0E32\u0E01\u0E04\u0E34\u0E14\u0E27\u0E48\u0E32\u0E04\u0E27\u0E23\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E44\u0E14\u0E49 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E23\u0E30\u0E1A\u0E1A\u0E02\u0E2D\u0E07\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }));
-}
 /**
- * Permission gate for a page subtree. Looks up the current pathname in the
- * permission rules map (live rules from `PermissionRulesProvider`, layered
- * over the optional `fallbackRulesMap`), passes the resolved required roles
- * into the host's `usePermission` probe, and renders one of:
- *
- * 1. rules / probe still loading → `null` on FIRST load only (let Suspense /
- *    loading.tsx show); once this subtree has been granted access, a later
- *    loading state keeps the children mounted — see the note below
- * 2. no rule covers this path → deny (fail closed)
- * 3. rule is explicit public (`[]`) → children
- * 4. probe says no access → deny card
- * 5. otherwise → children
+ * The help channel lives on platform-api (POST /support/messages): every app
+ * already calls it with the user's token and the organisation header, and
+ * its CORS admits every app. The shared axios instance carries both and
+ * refreshes a stale token.
  */
-function PermissionProvider({ children, usePermission, fallbackRulesMap, }) {
-    const pathname = navigation.usePathname();
-    const { rulesMap, isLoading: rulesLoading } = usePermissionRules();
-    const mergedMap = React.useMemo(() => {
-        if (!fallbackRulesMap)
-            return rulesMap;
-        // live rules win over fallback when both define the same key
-        return { ...fallbackRulesMap, ...rulesMap };
-    }, [rulesMap, fallbackRulesMap]);
-    const lookup = React.useMemo(() => resolveUiRoutePermission(pathname, mergedMap), [pathname, mergedMap]);
-    // Hook must run unconditionally (rules of hooks).
-    const { hasPermission, isLoading } = usePermission({
-        requiredRoles: lookup.roles,
-    });
-    // Returning null unmounts the page. That is fine before anything has been
-    // shown, and destructive afterwards: next-auth flips its status back to
-    // "loading" on every session update() — one runs every 4 minutes — and a
-    // rules hook that reports loading on that transient took the page down with
-    // it. Users filling a long form watched everything they had typed vanish,
-    // which reads as a spontaneous page refresh.
-    //
-    // So a loading state only blanks the subtree until access has been granted
-    // once. After that the children stay mounted while the check re-settles; the
-    // API still enforces access on every request, and a genuine loss of
-    // permission surfaces as a denied response rather than a wiped form.
-    //
-    // The grant is remembered per pathname, not per mount. This provider lives in
-    // the layout, so it survives every in-app navigation — a bare boolean would
-    // carry one page's grant onto the next route and flash a page the user may
-    // not be allowed to see while its own check is still running.
-    const grantedForPathRef = React.useRef(null);
-    const grantedHere = grantedForPathRef.current === pathname;
-    if (rulesLoading && !grantedHere) {
-        return null;
+const DEFAULT_PLATFORM_API_URL = "https://platform-api.antniti.com/api/v1";
+function helpApiBase(app) {
+    const explicit = process.env.NEXT_PUBLIC_PLATFORM_API_URL?.trim();
+    if (explicit)
+        return explicit.replace(/\/$/, "");
+    // Platform's own API is platform-api.
+    if (app === "platform") {
+        const own = process.env.NEXT_PUBLIC_API_URL?.trim();
+        if (own)
+            return own.replace(/\/$/, "");
+    }
+    return DEFAULT_PLATFORM_API_URL;
+}
+/** A failure the dialog shows as is. */
+class HelpSendError extends Error {
+    constructor(message, status) {
+        super(message);
+        Object.defineProperty(this, "status", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: status
+        });
+        this.name = "HelpSendError";
     }
-    // Unknown route → deny. Only explicit `required_child_groups: []` is public.
-    if (!lookup.matched) {
-        return jsxRuntime.jsx(DeniedCard, {});
+}
+function friendly(err, fallback) {
+    const e = toApiError(err);
+    if (e.status === 429) {
+        return new HelpSendError("ส่งบ่อยเกินไป กรุณาลองใหม่ภายหลัง", 429);
     }
-    if (lookup.roles.length === 0) {
-        grantedForPathRef.current = pathname;
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+    if (e.status && e.status >= 400 && e.status < 500 && e.message && e.status !== 401 && e.status !== 404) {
+        return new HelpSendError(e.message, e.status);
     }
-    if (isLoading && !grantedHere) {
-        return null;
+    return new HelpSendError(fallback, e.status);
+}
+async function sendHelpMessage(input) {
+    try {
+        const res = await instance.post(`${helpApiBase(input.app)}/support/messages`, {
+            kind: input.kind,
+            message: input.message,
+            app: input.app === "other" ? "" : input.app,
+            context: input.context,
+        });
+        return unwrapApiResponse(res.data);
     }
-    if (!hasPermission && !isLoading) {
-        return jsxRuntime.jsx(DeniedCard, {});
+    catch (err) {
+        throw friendly(err, "ส่งไม่สำเร็จ");
+    }
+}
+async function listMyHelpMessages(app) {
+    try {
+        const res = await instance.get(`${helpApiBase(app)}/support/messages`, {
+            params: { limit: 20 },
+        });
+        const data = unwrapApiResponse(res.data);
+        return data?.messages ?? [];
+    }
+    catch (err) {
+        throw friendly(err, "โหลดข้อมูลไม่สำเร็จ");
     }
-    grantedForPathRef.current = pathname;
-    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
 }
 
-/** Cookie name for the cross-subdomain theme choice. */
-const THEME_COOKIE = "erp-theme";
+const KINDS = [
+    { value: "help", label: "ขอความช่วยเหลือ", placeholder: "ต้องการให้ช่วยเรื่องอะไร" },
+    { value: "problem", label: "แจ้งปัญหา", placeholder: "เกิดอะไรขึ้น และกำลังทำอะไรอยู่" },
+    { value: "feedback", label: "ข้อเสนอแนะ", placeholder: "อยากให้ปรับหรือเพิ่มอะไร" },
+];
+const KIND_LABEL = Object.fromEntries(KINDS.map(k => [k.value, k.label]));
+const STATUS_LABEL = {
+    new: "รอตอบ",
+    answered: "ตอบแล้ว",
+    closed: "ปิดแล้ว",
+};
+const STATUS_TONE = {
+    new: "bg-amber-100 text-amber-900 dark:bg-amber-950 dark:text-amber-200",
+    answered: "bg-emerald-100 text-emerald-900 dark:bg-emerald-950 dark:text-emerald-200",
+    closed: "bg-muted text-muted-foreground",
+};
+const MAX_MESSAGE = 4000;
+function when(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return "";
+    return d.toLocaleString("th-TH", {
+        day: "numeric",
+        month: "short",
+        year: "numeric",
+        hour: "2-digit",
+        minute: "2-digit",
+        hour12: false,
+    });
+}
 /**
- * Parent domain to scope the cookie to, so every `*.antniti.com` app reads the
- * same value. Returns `null` on localhost / bare IPs (host-only cookie).
+ * The ช่วยเหลือ dialog. AppLayoutShell mounts one; the top-bar button and
+ * the user menu open it with openHelp(). It sends to platform-api, which
+ * puts the message in the back office's queue on admin.antniti.com.
  */
-function sharedCookieDomain() {
-    if (typeof window === "undefined")
-        return null;
-    const host = window.location.hostname;
-    if (host === "localhost" || /^[0-9.]+$/.test(host))
-        return null;
-    const parts = host.split(".");
-    if (parts.length < 2)
-        return null;
-    return "." + parts.slice(-2).join(".");
-}
-function readThemeCookie() {
-    if (typeof document === "undefined")
-        return null;
-    const match = document.cookie.match(new RegExp("(?:^|; )" + THEME_COOKIE + "=([^;]*)"));
-    return match ? decodeURIComponent(match[1]) : null;
-}
-function writeThemeCookie(value) {
-    if (typeof document === "undefined")
-        return;
-    const domain = sharedCookieDomain();
-    const parts = [
-        `${THEME_COOKIE}=${encodeURIComponent(value)}`,
-        "path=/",
-        "max-age=31536000", // 1 year
-        "SameSite=Lax",
-    ];
-    if (domain)
-        parts.push(`domain=${domain}`);
-    document.cookie = parts.join("; ");
-}
-/**
- * Bridges next-themes (per-origin localStorage) with a cookie scoped to the
- * parent domain, so the light/dark/system choice is shared across the
- * accounting / HR / platform subdomains.
- *
- * Local storage wins when it already has a value (H57): adopting the shared
- * cookie first used to overwrite an explicit choice — including one set via
- * DevTools — and write `theme=light` back on every load whenever the cookie
- * still said light. Push the local value into the cookie instead so sibling
- * apps catch up.
- */
-function ThemeCookieSync() {
-    const { theme, setTheme } = nextThemes.useTheme();
-    const skipFirstWrite = React__namespace.useRef(true);
+function HelpDialogHost({ app, orgCode }) {
+    const open = useHelpOpen();
+    const { data: session } = react.useSession();
+    const [view, setView] = React__namespace.useState("form");
+    const [kind, setKind] = React__namespace.useState("help");
+    const [message, setMessage] = React__namespace.useState("");
+    const [sending, setSending] = React__namespace.useState(false);
+    const [error, setError] = React__namespace.useState(null);
+    const [sent, setSent] = React__namespace.useState(null);
+    const [mine, setMine] = React__namespace.useState(null);
+    const [mineError, setMineError] = React__namespace.useState(null);
+    React__namespace.useEffect(() => registerHelpHost(), []);
+    // Read when the dialog opens: the page and the window as they are now.
+    // open is a dependency on purpose: the app is read again each time.
+    const appId = React__namespace.useMemo(() => detectHelpApp(app), [app, open]);
+    const context = React__namespace.useMemo(() => (open ? collectHelpContext(orgCode) : null), [open, orgCode]);
     React__namespace.useEffect(() => {
-        const local = typeof window !== "undefined"
-            ? window.localStorage.getItem("theme")
-            : null;
-        const cookie = readThemeCookie();
-        if (local) {
-            if (local !== theme)
-                setTheme(local);
-            writeThemeCookie(local);
+        if (open) {
+            setView("form");
+            setError(null);
         }
-        else if (cookie) {
-            if (cookie !== theme)
-                setTheme(cookie);
+    }, [open]);
+    const loadMine = React__namespace.useCallback(() => {
+        setView("mine");
+        setMine(null);
+        setMineError(null);
+        listMyHelpMessages(appId)
+            .then(setMine)
+            .catch((e) => setMineError(e instanceof Error ? e.message : "โหลดข้อมูลไม่สำเร็จ"));
+    }, [appId]);
+    const trimmed = message.trim();
+    const canSend = trimmed.length > 0 && !sending;
+    const send = async (e) => {
+        e?.preventDefault();
+        if (!canSend || !context)
+            return;
+        setSending(true);
+        setError(null);
+        try {
+            const res = await sendHelpMessage({ app: appId, kind, message: trimmed, context });
+            setSent(res);
+            setMessage("");
+            setKind("help");
+            setView("sent");
         }
-        else if (theme) {
-            writeThemeCookie(theme);
+        catch (err) {
+            setError(err instanceof Error ? err.message : "ส่งไม่สำเร็จ");
         }
-        // Run once on mount — `theme` is intentionally not a dependency here.
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    React__namespace.useEffect(() => {
-        // Skip the initial render; only persist genuine changes (incl. the
-        // setTheme() triggered by adopting storage above — harmless re-write).
-        if (skipFirstWrite.current) {
-            skipFirstWrite.current = false;
-            return;
+        finally {
+            setSending(false);
         }
-        if (theme)
-            writeThemeCookie(theme);
-    }, [theme]);
-    return null;
-}
-function ThemeProvider({ children, ...props }) {
-    return (jsxRuntime.jsxs(nextThemes.ThemeProvider, { ...props, children: [jsxRuntime.jsx(ThemeCookieSync, {}), children] }));
-}
-
-const defaultFlags = {
-    enableAdvancedReporting: true,
-    enableMultiCurrency: false,
-    enableThaiTaxCalculation: true,
-    enableProcurementWorkflow: true,
-    enableInventoryTracking: true,
-    enableAuditTrail: true,
-    enableAdvancedFilter: true,
-    filterFlag: false,
-    setFilterFlag: () => { },
-};
-const FeatureFlagsContext = React.createContext(defaultFlags);
-function FeatureFlagsProvider({ children, flags = {}, }) {
-    const [filterFlag, setFilterFlag] = React.useState(false);
-    const mergedFlags = {
-        ...defaultFlags,
-        ...flags,
-        filterFlag: flags.filterFlag ?? filterFlag,
-        setFilterFlag: (flag) => {
-            setFilterFlag(flag);
-            if (typeof flags.setFilterFlag === "function") {
-                flags.setFilterFlag(flag);
-            }
-        },
     };
-    return (jsxRuntime.jsx(FeatureFlagsContext.Provider, { value: mergedFlags, children: children }));
-}
-function useFeatureFlags() {
-    const context = React.useContext(FeatureFlagsContext);
-    if (!context) {
-        throw new Error("useFeatureFlags must be used within a FeatureFlagsProvider");
-    }
-    return context;
-}
-function useFeatureFlag(flag) {
-    const flags = useFeatureFlags();
-    return flags[flag];
-}
-
-const getAxiosErrorMessage$1 = (error) => {
-    if (error.response?.data?.message) {
-        return error.response.data.message;
-    }
-    if (error.message) {
-        return error.message;
-    }
-    return "An unknown error occurred";
-};
-const formatError = (handlerName, error) => {
-    const axiosError = error;
-    const message = getAxiosErrorMessage$1(axiosError);
-    const isOrgRequired = message.includes("Organization context is required") ||
-        message.includes("organization_id") ||
-        message.includes("X-Organization-ID");
-    if (isOrgRequired) {
-        // Expected when no org selected yet (e.g. select-organization page).
-        console.warn(`[React Query] ${handlerName} skipped (no organization context): ${message}`);
-        return;
-    }
-};
-/**
- * Default React Query config used across ERP apps:
- *   - 2 retries on queries / 1 on mutations, exponential backoff
- *   - 5 min staleTime, refetchOnWindowFocus
- *   - swallows "no org context" errors to silence noise on the
- *     select-organization page
- *
- * Apps can compose on top of this — pass the returned config to `new QueryClient(...)`
- * directly or spread + override default options.
- */
-const getQueryClientConfig = () => ({
-    defaultOptions: {
-        queries: {
-            retry: 2,
-            retryDelay: attemptIndex => Math.min(1000 * 2 ** attemptIndex, 30000),
-            staleTime: 5 * 60 * 1000,
-            refetchOnWindowFocus: true,
-        },
-        mutations: {
-            // NEVER auto-retry a mutation. Unlike a query, a mutation is a side
-            // effect on a non-idempotent endpoint (submit, create, approve), and
-            // React Query cannot tell "the network dropped" from "the server
-            // rejected this on business grounds".
-            //
-            // With retry: 1 every failed mutation fired twice. Two visible
-            // consequences: a rejected submit showed up as two failed POSTs in the
-            // network tab, and — far worse — a create whose response was lost in
-            // flight would be re-sent and duplicate the record server-side.
-            //
-            // Retrying is the caller's decision, not a global default: the user
-            // sees the error and presses the button again.
-            retry: 0,
-        },
-    },
-    queryCache: new reactQuery.QueryCache({
-        onError: error => formatError("Query", error),
-    }),
-    mutationCache: new reactQuery.MutationCache({
-        onError: error => formatError("Mutation", error),
-    }),
-});
-
-function ReactQueryProvider({ children }) {
-    // Create a new QueryClient instance for each render to avoid SSR issues.
-    const [queryClient] = React.useState(() => new reactQuery.QueryClient(getQueryClientConfig()));
-    return (jsxRuntime.jsxs(reactQuery.QueryClientProvider, { client: queryClient, children: [children, jsxRuntime.jsx(reactQueryDevtools.ReactQueryDevtools, { client: queryClient, initialIsOpen: false })] }));
+    const email = session?.user?.email ?? null;
+    const placeholder = KINDS.find(k => k.value === kind)?.placeholder;
+    return (jsxRuntime.jsx(erpTheme.Dialog, { open: open, onOpenChange: o => (o ? openHelp() : closeHelp()), children: jsxRuntime.jsxs(erpTheme.DialogContent, { className: "max-h-[calc(100dvh-2rem)] overflow-y-auto sm:max-w-lg", children: [view === "form" ? (jsxRuntime.jsxs("form", { onSubmit: send, className: "grid gap-4", children: [jsxRuntime.jsx(erpTheme.DialogHeader, { children: jsxRuntime.jsx(erpTheme.DialogTitle, { children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" }) }), jsxRuntime.jsxs("div", { className: "grid gap-2", children: [jsxRuntime.jsx(erpTheme.Label, { id: "erp-help-kind", children: "\u0E1B\u0E23\u0E30\u0E40\u0E20\u0E17" }), jsxRuntime.jsx("div", { role: "radiogroup", "aria-labelledby": "erp-help-kind", className: "flex gap-1 rounded-lg bg-muted p-1", children: KINDS.map(k => (jsxRuntime.jsx("button", { type: "button", role: "radio", "aria-checked": kind === k.value, onClick: () => setKind(k.value), className: "flex-auto whitespace-nowrap rounded-md px-2 py-2 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:text-sm " +
+                                            (kind === k.value
+                                                ? "bg-background text-foreground shadow-sm"
+                                                : "text-muted-foreground hover:text-foreground"), children: k.label }, k.value))) })] }), jsxRuntime.jsxs("div", { className: "grid gap-2", children: [jsxRuntime.jsx(erpTheme.Label, { htmlFor: "erp-help-message", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" }), jsxRuntime.jsx(erpTheme.Textarea, { id: "erp-help-message", rows: 6, maxLength: MAX_MESSAGE, required: true, value: message, placeholder: placeholder, onChange: e => setMessage(e.target.value), className: "min-h-[140px] resize-y" })] }), context ? (jsxRuntime.jsxs("p", { className: "break-words text-xs leading-relaxed text-muted-foreground", children: ["\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E17\u0E35\u0E48\u0E41\u0E19\u0E1A: ", describeAttached(appId, context, email)] })) : null, error ? (jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: error })) : null, jsxRuntime.jsxs(erpTheme.DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [jsxRuntime.jsx("button", { type: "button", onClick: loadMine, className: "mr-auto text-sm text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxRuntime.jsxs("div", { className: "flex gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { type: "button", variant: "outline", onClick: closeHelp, children: "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01" }), jsxRuntime.jsxs(erpTheme.Button, { type: "submit", disabled: !canSend, children: [sending ? jsxRuntime.jsx(lucideReact.Loader2, { className: "mr-1 h-4 w-4 animate-spin" }) : null, "\u0E2A\u0E48\u0E07"] })] })] })] })) : null, view === "sent" && sent ? (jsxRuntime.jsxs("div", { className: "grid gap-4", children: [jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-2 py-4 text-center", children: [jsxRuntime.jsx(lucideReact.CircleCheck, { className: "h-12 w-12 text-primary", strokeWidth: 1.6 }), jsxRuntime.jsx(erpTheme.DialogTitle, { className: "text-lg font-semibold", children: "\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxRuntime.jsxs("p", { className: "text-sm text-muted-foreground", children: ["\u0E40\u0E25\u0E02\u0E17\u0E35\u0E48\u0E2D\u0E49\u0E32\u0E07\u0E2D\u0E34\u0E07", " ", jsxRuntime.jsx("span", { className: "font-mono text-base font-semibold text-foreground", children: sent.ref })] })] }), jsxRuntime.jsxs(erpTheme.DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [jsxRuntime.jsx("button", { type: "button", onClick: loadMine, className: "mr-auto text-sm text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxRuntime.jsx(erpTheme.Button, { type: "button", onClick: closeHelp, children: "\u0E1B\u0E34\u0E14" })] })] })) : null, view === "mine" ? (jsxRuntime.jsxs("div", { className: "grid gap-4", children: [jsxRuntime.jsx(erpTheme.DialogHeader, { children: jsxRuntime.jsxs(erpTheme.DialogTitle, { className: "flex items-center gap-2", children: [jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E01\u0E25\u0E31\u0E1A", onClick: () => setView("form"), className: "-ml-1 grid size-8 place-items-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: jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "h-4 w-4" }) }), "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27"] }) }), mine === null && !mineError ? (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 py-6 text-sm text-muted-foreground", children: [jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }), "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14"] })) : null, mineError ? (jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: mineError })) : null, mine && mine.length === 0 ? (jsxRuntime.jsx("p", { className: "py-6 text-sm text-muted-foreground", children: "\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E21\u0E35\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" })) : null, mine && mine.length > 0 ? (jsxRuntime.jsx("ul", { className: "grid gap-3", children: mine.map(m => (jsxRuntime.jsxs("li", { className: "rounded-lg border border-border p-3", children: [jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground", children: [jsxRuntime.jsx("span", { className: "font-mono font-semibold text-foreground", children: m.ref }), jsxRuntime.jsx("span", { children: KIND_LABEL[m.kind] ?? m.kind }), jsxRuntime.jsx("span", { children: when(m.created_at) }), jsxRuntime.jsx("span", { className: `ml-auto rounded-full px-2 py-0.5 font-medium ${STATUS_TONE[m.status] ?? ""}`, children: STATUS_LABEL[m.status] ?? m.status })] }), jsxRuntime.jsx("p", { className: "mt-2 line-clamp-4 whitespace-pre-wrap break-words text-sm", children: m.message }), m.replies.map((r, i) => (jsxRuntime.jsxs("div", { className: "mt-2 rounded-md bg-muted px-3 py-2", children: [jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: ["\u0E17\u0E35\u0E21 AntNiti \u00B7 ", when(r.created_at)] }), jsxRuntime.jsx("p", { className: "mt-1 whitespace-pre-wrap break-words text-sm", children: r.body })] }, i)))] }, m.id))) })) : null] })) : null] }) }));
 }
 
 /**
- * Renders nothing. Runs during render (after SessionProvider, inside
- * QueryClientProvider) to seed the cached profile slot from the JWT-backed
- * session — so `useMyProfile` doesn't fire a redundant GET on initial load.
+ * Top-level app chrome: sticky header, sidebar slot, content gutter and the
+ * session/org-context plumbing that both Accounting and HR need. Apps wrap
+ * it inside their `SidebarProvider` (server-rendered with the cookie-backed
+ * `defaultOpen`) and their `ERPProvider`, then pass app-specific bits as
+ * props.
  *
- * Generic over the profile shape; each app passes its own queryKey + mapper.
+ * The padding contract is deliberately owned here so future style tweaks
+ * (e.g. the recent left/right/bottom gutter pass) propagate to both apps via
+ * an erp-shell bump — domain components must NOT add their own root padding
+ * or content gets indented twice.
  */
-function SessionBackedProfileCacheSeeder({ queryKey, mapper, }) {
+function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, signInUrl, selectOrganizationUrl, chrome = "brand", workspaceHeader = "brand", headerEnd, mobileBrand, showHelp = true, helpApp, }) {
     const { data: session, status } = react.useSession();
-    const queryClient = reactQuery.useQueryClient();
-    if (status === "authenticated" && session) {
-        const mapped = mapper(session);
-        if (mapped) {
-            const existing = queryClient.getQueryData(queryKey);
-            if (!existing) {
-                // updatedAt: 0 → immediately stale so observers still GET /myprofile
-                // for fields the JWT seed omits (avatar/signature paths).
-                queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
-            }
-            else {
-                // Only overwrite when the mapped id changed — we don't know T's shape
-                // so we rely on a shallow id check via JSON tag if present.
-                const existingId = existing?.id;
-                const mappedId = mapped?.id;
-                if (existingId !== mappedId) {
-                    queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
-                }
-            }
+    const { open, setOpen } = useSidebar();
+    const router = navigation.useRouter();
+    const params = navigation.useParams();
+    const code = params?.code;
+    const extendedSession = session;
+    // Track once-authenticated so a transient accessToken drop during the
+    // periodic session refresh (SessionRefreshTrigger every 4 min) doesn't
+    // blank the whole page. The initial-load gate below still handles cold
+    // start; once we've seen a real token we render children optimistically
+    // and let the API layer surface a real 401 if the token actually died.
+    const hasSeenAccessTokenRef = React.useRef(false);
+    React.useEffect(() => {
+        if (extendedSession?.accessToken)
+            hasSeenAccessTokenRef.current = true;
+    }, [extendedSession?.accessToken]);
+    // Find the org from the URL `[code]` so we can detect a context mismatch
+    // (the user bookmarked a different org than the cookie remembers).
+    const orgFromCode = React__namespace.useMemo(() => {
+        if (!code || !organizations.length)
+            return null;
+        return (organizations.find(org => org.code === code || String(org.id) === code) ?? null);
+    }, [code, organizations]);
+    // Sync state: when the URL code points at a different org than the cookie,
+    // trust the URL and update the cookie. Otherwise do nothing — the user
+    // wins ties via the in-app org switcher.
+    React.useEffect(() => {
+        if (!code)
+            return;
+        if (!organizations.length)
+            return;
+        if (!orgFromCode)
+            return;
+        if (String(organizationId) !== String(orgFromCode.id)) {
+            void setOrganizationId(orgFromCode.id);
         }
+    }, [
+        orgFromCode,
+        organizationId,
+        setOrganizationId,
+        code,
+        organizations.length,
+    ]);
+    // Key for the content subtree. It exists so switching organizations throws
+    // away the previous org's component state — but it must react ONLY to a real
+    // switch. organizationId legitimately passes through null while the context
+    // re-settles (session resolving, cookie write in flight), and keying on that
+    // unmounted and remounted the entire page: forms lost their loaded values,
+    // in-flight edits vanished, and settings pickers snapped back to defaults.
+    //
+    // Holding the last known id makes a transient null a no-op while a genuine
+    // org-to-org switch still changes the key.
+    const lastOrgKeyRef = React__namespace.useRef("no-org");
+    const currentOrgKey = organizationId === null ||
+        organizationId === undefined ||
+        String(organizationId).trim() === ""
+        ? null
+        : String(organizationId);
+    if (currentOrgKey !== null) {
+        lastOrgKeyRef.current = currentOrgKey;
     }
-    if (status === "unauthenticated") {
-        queryClient.removeQueries({ queryKey });
-    }
-    return null;
-}
-
-const TOKEN_TTL_MS = 30000;
-let cachedToken = null;
-let cachedAt = 0;
-let inFlightTokenPromise = null;
-const readSessionToken = async () => {
-    const response = await fetch("/api/auth/session", {
-        credentials: "include",
-        cache: "no-store",
-    });
-    if (!response.ok)
-        return null;
-    const session = (await response.json());
-    return session.accessToken ?? null;
-};
-const getAccessToken = async (forceRefresh = false) => {
-    const now = Date.now();
-    if (!forceRefresh && cachedToken && now - cachedAt < TOKEN_TTL_MS) {
-        return cachedToken;
-    }
-    if (!inFlightTokenPromise) {
-        inFlightTokenPromise = readSessionToken()
-            .then(token => {
-            cachedToken = token;
-            cachedAt = Date.now();
-            return token;
-        })
-            .finally(() => {
-            inFlightTokenPromise = null;
-        });
+    const contentOrgKey = lastOrgKeyRef.current;
+    // Hold the page back until the active organisation is the one the URL names.
+    //
+    // The sync effect above writes the cookie through a server action, which is
+    // a round trip. Until it lands, getOrgFromCookie() still answers with the
+    // previous organisation and every request the page fires on mount carries
+    // it — so /O26000021/work-record asked about O26000033 and was correctly
+    // told there was nothing there. An empty table is the mild version: the
+    // create form posts to the same header, so a record could be filed against
+    // a company the user was not looking at.
+    //
+    // Only while the two genuinely disagree. A code naming no organisation of
+    // the caller's is left to the app to refuse, and a page with no code in its
+    // path is unaffected.
+    const orgContextIsStale = !!orgFromCode &&
+        organizationId !== null &&
+        organizationId !== undefined &&
+        String(organizationId) !== String(orgFromCode.id);
+    // ≤1024px: sidebar renders as a modal overlay (backdrop dims content). >1024px:
+    // sidebar is docked and the content gets a left margin to clear it.
+    const [isSidebarModalLayout, setIsSidebarModalLayout] = React__namespace.useState(false);
+    React.useEffect(() => {
+        const mq = window.matchMedia("(max-width: 1024px)");
+        const sync = () => setIsSidebarModalLayout(mq.matches);
+        sync();
+        mq.addEventListener("change", sync);
+        return () => mq.removeEventListener("change", sync);
+    }, []);
+    // Help opened from the drawer's user menu: the drawer steps aside so the
+    // dialog is the only thing on a phone's screen.
+    const helpOpen = useHelpOpen();
+    React.useEffect(() => {
+        if (helpOpen && isSidebarModalLayout && open)
+            setOpen(false);
+    }, [helpOpen, isSidebarModalLayout, open, setOpen]);
+    // Wait for session to load (initial load only). When refetching/updating we
+    // already have a session — don't flash the full-screen loader.
+    if (status === "loading" && !session) {
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
     }
-    return inFlightTokenPromise;
-};
-const clearAccessTokenCache = () => {
-    cachedToken = null;
-    cachedAt = 0;
-};
-
-class ApiError extends Error {
-    constructor(message, options) {
-        super(message);
-        Object.defineProperty(this, "status", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "code", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "field", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "details", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        this.name = "ApiError";
-        this.status = options?.status;
-        this.code = options?.code;
-        this.field = options?.field;
-        this.details = options?.details;
+    // Session loaded but no accessToken AND we've never seen one → real auth
+    // failure (token refresh gave nothing back on cold start), bounce through
+    // signin. If we HAVE seen one before, the drop is almost certainly the
+    // in-flight periodic refresh (SessionRefreshTrigger). Don't redirect on
+    // that transient — the JWT callback will settle in a moment and API
+    // calls will keep working with the still-valid cookie.
+    if (status === "authenticated" &&
+        !extendedSession?.accessToken &&
+        !hasSeenAccessTokenRef.current) {
+        if (typeof window !== "undefined") {
+            const url = new URL(signInUrl, window.location.origin);
+            url.searchParams.set("error", "NoAccessToken");
+            url.searchParams.set("callbackUrl", window.location.pathname);
+            window.location.href = url.toString();
+        }
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
+    }
+    // Only blank the page when we've never seen a token — otherwise the
+    // periodic session refresh would visibly flash the loader every 4 min.
+    if (!extendedSession?.accessToken && !hasSeenAccessTokenRef.current) {
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
     }
+    if (!code) {
+        router.push(selectOrganizationUrl);
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
+    }
+    // When the sidebar is docked-open it consumes 21.5rem on the left; otherwise
+    // the content takes the full width and we add a left gutter inside.
+    const workspace = chrome === "workspace";
+    const contentMargin = open && !isSidebarModalLayout
+        ? workspace
+            ? "ml-[244px]"
+            : "ml-[21.5rem]"
+        : "";
+    const needsLeftGutter = workspace || !(open && !isSidebarModalLayout);
+    const wrap = permissionProvider ?? ((c) => c);
+    return (jsxRuntime.jsxs("div", { className: "flex min-h-screen w-full bg-background", children: [open && (jsxRuntime.jsx("div", { className: "fixed left-0 top-0 z-50 h-screen", children: sidebar })), open && isSidebarModalLayout && (jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E1B\u0E34\u0E14\u0E40\u0E21\u0E19\u0E39", className: "fixed inset-0 z-40 bg-black/50", onClick: () => setOpen(false) })), jsxRuntime.jsx("div", { className: cx("relative flex min-w-0 flex-1 flex-col transition-all", contentMargin), children: jsxRuntime.jsxs("main", { className: cx("flex flex-1 flex-col min-h-screen", workspace ? "gap-0" : "gap-4"), children: [workspace ? (jsxRuntime.jsxs("div", { className: cx("sticky top-0 z-30 shrink-0 w-full", workspaceHeader === "light" &&
+                                "border-b border-border bg-card/85 backdrop-blur-sm"), style: workspaceHeader === "light"
+                                ? WORKSPACE_LIGHT_HEADER_VARS
+                                : WORKSPACE_HEADER_VARS, children: [workspaceHeader === "light" ? null : (jsxRuntime.jsx(HeaderBackground, { className: "rounded-none" })), jsxRuntime.jsxs("header", { className: cx("relative z-10 flex w-full items-center gap-3 text-[var(--header-fg)]", workspaceHeader === "light"
+                                        ? "min-h-[66px] px-3 py-2 sm:min-h-[72px] sm:px-[22px] lg:min-h-[82px] lg:px-8"
+                                        : "min-h-[72px] px-[18px] py-3 sm:px-6 lg:min-h-[88px] lg:px-10"), children: [isSidebarModalLayout ? (
+                                        // As in the design: the mark, then a menu button, and the
+                                        // organisation on the right — no trail, no title, so the
+                                        // organisation's name has the room it needs on a phone.
+                                        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [mobileBrand ? (jsxRuntime.jsx("div", { className: "shrink-0", children: mobileBrand })) : null, jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(!open), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted)] transition-colors hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted)]", children: jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "size-5", strokeWidth: 1.65 }) })] })) : (jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-[var(--header-fg-muted)] hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] [&_svg]:!text-current" })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-0.5", children: [jsxRuntime.jsx("div", { className: "hidden min-w-0 sm:block", children: breadcrumb }), jsxRuntime.jsx("div", { id: "header-title", className: "min-w-0 max-sm:hidden" })] }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3 sm:gap-5", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] })] })) : (jsxRuntime.jsxs("div", { className: "sticky top-0 z-30 shrink-0 w-full", children: [jsxRuntime.jsx(HeaderBackground, {}), jsxRuntime.jsxs("header", { className: "relative shrink-0 gap-2 py-4 h-auto min-h-[123.5px] w-full z-10", children: [jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2 px-3 sm:px-4 lg:px-6", children: [jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-white hover:bg-white/10" }), jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: breadcrumb }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] }), jsxRuntime.jsx("div", { id: "header-title" })] })] })), jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { className: "relative z-10 min-h-[calc(100vh-8rem)]", children: jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center", children: jsxRuntime.jsxs("div", { className: "space-y-4 text-center", children: [jsxRuntime.jsx("div", { className: "mx-auto h-8 w-8 animate-spin rounded-full border-b-2 border-primary" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14..." })] }) }) }), children: jsxRuntime.jsx("div", { className: workspace
+                                    ? "relative z-10 px-[18px] pt-[26px] pb-4 sm:px-6 lg:px-10 lg:pt-[38px]"
+                                    : cx("relative z-10 pr-6", needsLeftGutter && "pl-6"), children: orgContextIsStale ? loadingComponent : wrap(children) }, `org-${contentOrgKey}`) })] }) }), showHelp ? jsxRuntime.jsx(HelpDialogHost, { app: helpApp, orgCode: code }) : null] }));
 }
-const toApiError = (error) => {
-    if (error instanceof ApiError)
-        return error;
-    if (axios.isAxiosError(error)) {
-        const axiosErr = error;
-        const message = axiosErr.response?.data?.message ||
-            axiosErr.response?.data?.error ||
-            axiosErr.message ||
-            "Request failed";
-        return new ApiError(message, {
-            status: axiosErr.response?.status,
-            code: axiosErr.response?.data?.code,
-            field: axiosErr.response?.data?.field,
-            details: axiosErr.response?.data?.details,
-        });
+/** Local tiny classnames helper — avoids pulling clsx/tailwind-merge into
+ *  the shell just for the layout file. Falsy values are skipped. */
+function cx(...parts) {
+    return parts.filter(Boolean).join(" ");
+}
+
+/**
+ * The product mark at the top of the workspace sidebar: the app icon, the
+ * name, and a spaced caption beneath it.
+ */
+function WorkspaceBrand({ name, caption, mark, href, compact = false, className, }) {
+    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: erpTheme.cn("grid shrink-0 place-items-center overflow-hidden rounded-[14px] [&>img]:size-full [&>img]:object-cover", compact ? "size-9 rounded-[11px]" : "size-11"), children: mark }), compact ? (jsxRuntime.jsx("span", { className: "sr-only", children: name })) : (jsxRuntime.jsxs("span", { className: "min-w-0", children: [jsxRuntime.jsx("span", { className: "block truncate text-[25px] leading-tight font-extrabold tracking-[-0.05em]", children: name }), caption ? (jsxRuntime.jsx("small", { className: "-mt-0.5 block truncate text-[9px] font-semibold tracking-[0.29em] text-muted-foreground", children: caption })) : null] }))] }));
+    const cls = erpTheme.cn("flex items-center gap-[11px] rounded-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", !compact && "px-4", className);
+    return href ? (jsxRuntime.jsx(Link, { href: href, className: cls, "aria-label": compact ? name : undefined, children: body })) : (jsxRuntime.jsx("div", { className: cls, children: body }));
+}
+
+function isExternal(href) {
+    return /^https?:\/\//i.test(href);
+}
+/**
+ * The card at the foot of the workspace sidebar that points someone who
+ * does not know where to start at the place that will tell them.
+ */
+function SidebarHelpCard({ title, description, actionLabel, href, icon, className, }) {
+    const external = isExternal(href);
+    const action = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [actionLabel, jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-[15px]" })] }));
+    const actionClass = "mt-3 flex w-full items-center justify-between text-xs font-semibold text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded";
+    return (jsxRuntime.jsxs("div", { className: erpTheme.cn("mx-1.5 mb-5 rounded-[13px] border border-primary/10 bg-gradient-to-br from-primary/[0.06] to-primary/[0.02] px-3.5 py-4", className), children: [jsxRuntime.jsx("span", { className: "mb-[7px] block text-primary/70", children: icon ?? jsxRuntime.jsx(lucideReact.Compass, { className: "size-6", strokeWidth: 1.6 }) }), jsxRuntime.jsx("strong", { className: "block text-xs font-semibold", children: title }), description ? (jsxRuntime.jsx("p", { className: "mt-[7px] text-xs leading-[1.7] text-muted-foreground", children: description })) : null, external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: actionClass, children: action })) : (jsxRuntime.jsx(Link, { href: href, className: actionClass, children: action }))] }));
+}
+/** A quiet row under the help card — the manual, the support chat. */
+function SidebarHelpLink({ label, href, icon, className }) {
+    const external = isExternal(href);
+    const cls = erpTheme.cn("flex w-full items-center gap-3 rounded-[10px] px-3.5 py-[11px] text-xs font-medium text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", className);
+    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon ? jsxRuntime.jsx("span", { className: "shrink-0 [&>svg]:size-[18px]", children: icon }) : null, jsxRuntime.jsx("span", { className: "flex-1 truncate", children: label }), external ? jsxRuntime.jsx(lucideReact.ArrowUpRight, { className: "size-4 shrink-0" }) : null] }));
+    return external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: cls, children: body })) : (jsxRuntime.jsx(Link, { href: href, className: cls, children: body }));
+}
+
+/**
+ * Central "no access" screen shared by every policy check (route-level
+ * PermissionProvider and page-level PermissionGateShell). One look everywhere:
+ * an illustration, a 403 headline, the page-specific reason, and recovery
+ * actions.
+ */
+function AccessDenied({ title = "ขออภัย, คุณไม่มีสิทธิ์เข้าถึงหน้านี้ (403)", message = "คุณไม่มีสิทธิ์เข้าถึงหน้านี้ ขออภัยในความไม่สะดวก", homeHref, homeLabel = "กลับไปหน้าหลัก", supportHref, supportLabel = "ติดต่อฝ่ายสนับสนุน", fullScreen = true, className, }) {
+    // "/" is not the home page inside an app — it bounces to organization
+    // selection, so the button read "กลับไปหน้าหลัก" and dropped the user into a
+    // picker for the org they were already in. Send them to that org's home.
+    const params = navigation.useParams();
+    const code = typeof params?.code === "string" ? params.code : "";
+    const homeTarget = homeHref ?? (code ? `/${code}` : "/");
+    const go = (href) => {
+        if (typeof window !== "undefined")
+            window.location.href = href;
+    };
+    const wrapperClass = [
+        "flex min-w-0 flex-1 items-center justify-center p-4",
+        fullScreen ? "min-h-[70vh]" : "",
+        className ?? "",
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsxRuntime.jsx("div", { className: wrapperClass, children: jsxRuntime.jsx("div", { className: "relative w-full max-w-3xl overflow-hidden rounded-2xl border border-border/60 bg-card/60 p-8 shadow-sm backdrop-blur sm:p-10", children: jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-8 text-center sm:flex-row sm:text-left", children: [jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 rounded-full bg-destructive/20 blur-2xl" }), jsxRuntime.jsx("div", { className: "relative flex h-28 w-28 items-center justify-center rounded-3xl border border-border/60 bg-gradient-to-br from-muted/40 to-background shadow-inner", children: jsxRuntime.jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-full border border-destructive/40 bg-destructive/10", children: jsxRuntime.jsx(lucideReact.Ban, { className: "h-8 w-8 text-destructive", strokeWidth: 2.5 }) }) })] }), jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [jsxRuntime.jsx("h1", { className: "text-xl font-bold text-foreground sm:text-2xl", children: title }), message ? (jsxRuntime.jsx("p", { className: "mt-3 whitespace-pre-line text-sm leading-relaxed text-muted-foreground sm:text-base", children: message })) : null, jsxRuntime.jsxs("div", { className: "mt-6 flex flex-col gap-3 sm:flex-row", children: [jsxRuntime.jsxs(erpTheme.Button, { type: "button", onClick: () => go(homeTarget), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Home, { className: "mr-2 h-4 w-4" }), homeLabel] }), supportHref ? (jsxRuntime.jsxs(erpTheme.Button, { type: "button", variant: "outline", onClick: () => go(supportHref), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Headset, { className: "mr-2 h-4 w-4" }), supportLabel] })) : null] })] })] }) }) }));
+}
+
+const EMPLOYEE_RECORD_REQUIRED = "EMPLOYEE_RECORD_REQUIRED";
+const EMPLOYEE_RECORD_REQUIRED_EVENT = "erp:employee-record-required";
+const EMPLOYEE_RECORD_OK_EVENT = "erp:employee-record-ok";
+/**
+ * Shown when the API refuses every request because the signed-in account has
+ * no employee record in this organisation.
+ *
+ * A gate rather than a banner. Leave, attendance, approvals and payslips all
+ * identify a person by that record, so once the server started enforcing it
+ * every call fails — and without something that says so, the app becomes a
+ * screen of error toasts with no explanation and no way forward.
+ */
+function EmployeeRequiredGate({ platformBaseUrl, }) {
+    const [blocked, setBlocked] = React.useState(false);
+    const params = navigation.useParams();
+    const code = params?.code ?? "";
+    React.useEffect(() => {
+        const onBlocked = () => setBlocked(true);
+        const onOk = () => setBlocked(false);
+        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
+        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+        return () => {
+            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
+            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+        };
+    }, []);
+    if (!blocked)
+        return null;
+    const base = platformBaseUrl?.replace(/\/$/, "") ?? "";
+    const createHref = code ? `${base}/${code}/employee/create` : `${base}/`;
+    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-[100] flex items-center justify-center bg-background/95 p-6 backdrop-blur-sm", children: jsxRuntime.jsxs("div", { className: "w-full max-w-md space-y-5 text-center", children: [jsxRuntime.jsx(lucideReact.ContactRound, { className: "mx-auto h-12 w-12 text-muted-foreground" }), jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "\u0E1A\u0E31\u0E0D\u0E0A\u0E35\u0E19\u0E35\u0E49\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49\u0E1C\u0E39\u0E01\u0E01\u0E31\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E25\u0E32 \u0E25\u0E07\u0E40\u0E27\u0E25\u0E32 \u0E40\u0E1A\u0E34\u0E01\u0E40\u0E07\u0E34\u0E19 \u0E41\u0E25\u0E30\u0E01\u0E32\u0E23\u0E2D\u0E19\u0E38\u0E21\u0E31\u0E15\u0E34 \u0E23\u0E30\u0E1A\u0E38\u0E15\u0E31\u0E27\u0E04\u0E19\u0E08\u0E32\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19 \u0E08\u0E36\u0E07\u0E22\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E43\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49" })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap justify-center gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { onClick: () => window.location.reload(), children: "\u0E25\u0E2D\u0E07\u0E43\u0E2B\u0E21\u0E48" }), jsxRuntime.jsx(erpTheme.Button, { variant: "outline", asChild: true, children: jsxRuntime.jsxs("a", { href: createHref, children: [jsxRuntime.jsx(lucideReact.UserPlus, { className: "mr-1 h-4 w-4" }), "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19"] }) })] }), jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "\u0E16\u0E49\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E41\u0E01\u0E49\u0E44\u0E02 \u0E43\u0E2B\u0E49\u0E41\u0E08\u0E49\u0E07\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] }) }));
+}
+
+const shellClassName = "flex min-w-0 flex-1 flex-col gap-6 overflow-x-hidden";
+/**
+ * Shared layout for “กำลังตรวจสอบสิทธิ์” (skeleton) and “ไม่มีสิทธิ์” (message).
+ * Renders `children` only when policy is loaded and access is granted.
+ */
+function PermissionGateShell({ policyLoading, hasPolicyAccess, deniedMessage, children, skeletonCount = 6, skeletonGridClassName = "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3", skeletonVariant = "kpi", }) {
+    if (policyLoading) {
+        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx("div", { className: skeletonGridClassName, children: Array.from({ length: skeletonCount }).map((_, i) => (jsxRuntime.jsx(erpTheme.Card, { children: skeletonVariant === "kpi" ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(erpTheme.CardHeader, { className: "flex flex-row items-center justify-between pb-2", children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-4 rounded" })] }), jsxRuntime.jsxs(erpTheme.CardContent, { children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-32 mb-2" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-3 w-20" })] })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(erpTheme.CardHeader, { className: "pb-2", children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }) }), jsxRuntime.jsx(erpTheme.CardContent, { children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-16" }) })] })) }, i))) }) }));
     }
-    if (error instanceof Error) {
-        return new ApiError(error.message);
+    if (!hasPolicyAccess) {
+        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx(AccessDenied, { message: deniedMessage }) }));
     }
-    return new ApiError(String(error));
-};
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+}
 
-const isPlainObject = (value) => Object.prototype.toString.call(value) === "[object Object]";
-const visit = (value, cb) => {
-    if (Array.isArray(value)) {
-        value.forEach(item => visit(item, cb));
-        return;
+const PermissionRulesContext = React.createContext(undefined);
+/**
+ * Generic provider — the consumer app passes in `data` (live fetch) and
+ * `fallbackPolicies` (static JSON). All apps share the same mapping logic
+ * (build a flat map of route_key/policy_key → required child groups).
+ */
+function PermissionRulesProvider({ children, data, isLoading = false, isError = false, fallbackPolicies = [], }) {
+    const rulesMap = React.useMemo(() => {
+        const m = {};
+        if (!data?.routes)
+            return m;
+        for (const row of data.routes) {
+            m[row.route_key] = row.required_child_groups ?? [];
+        }
+        return m;
+    }, [data]);
+    const policiesMap = React.useMemo(() => {
+        const m = {};
+        for (const row of fallbackPolicies) {
+            m[row.policy_key] = row.required_child_groups ?? [];
+        }
+        if (data?.policies?.length) {
+            for (const row of data.policies) {
+                m[row.policy_key] = row.required_child_groups ?? [];
+            }
+        }
+        return m;
+    }, [data, fallbackPolicies]);
+    const value = React.useMemo(() => ({
+        rulesMap,
+        policiesMap,
+        isLoading,
+        isError,
+        updatedAt: data?.updated_at ?? null,
+    }), [rulesMap, policiesMap, isLoading, isError, data?.updated_at]);
+    return (jsxRuntime.jsx(PermissionRulesContext.Provider, { value: value, children: children }));
+}
+/**
+ * Read the permission rules. Outside the provider, report loading so
+ * fail-closed consumers (nav / gates) do not treat empty maps as "allow all".
+ */
+function usePermissionRules() {
+    const ctx = React.useContext(PermissionRulesContext);
+    if (!ctx) {
+        return {
+            rulesMap: {},
+            policiesMap: {},
+            isLoading: true,
+            isError: false,
+            updatedAt: null,
+        };
     }
-    if (!isPlainObject(value)) {
-        return;
+    return ctx;
+}
+
+/**
+ * Strip the org `[code]` prefix from a pathname so we can look it up in the
+ * permission rules map. `/O12345/setting/foo` → `/setting/foo`. Single-segment
+ * paths (e.g. `/select-organization`) keep their leading slash.
+ *
+ * Also normalizes the user-role subtab aliases — both `purchase-doc` and
+ * `sales-doc` are gated by the same `members` rule because the UI shows
+ * the same management screen with different filters.
+ */
+function normalizePathnameForPermissionRules(pathname) {
+    const parts = pathname.split("/").filter(Boolean);
+    const path = parts.length <= 1 ? "/" : "/" + parts.slice(1).join("/");
+    return path.replace(/\/user-role\/(purchase-doc|sales-doc)$/, "/user-role/members");
+}
+function hasRule(rulesMap, routeKey) {
+    return Object.prototype.hasOwnProperty.call(rulesMap, routeKey);
+}
+/**
+ * Resolve UI route permissions for a pathname.
+ *
+ * - Exact / `[param]` pattern match → matched
+ * - Parent-prefix inherit only when the parent rule has a **non-empty**
+ *   role list (restrictive inherit). Explicitly public parents (`[]`) do
+ *   not open all children.
+ * - No match → `{ matched: false }` (fail closed — never treat as public)
+ */
+function resolveUiRoutePermission(pathname, rulesMap) {
+    const normalized = normalizePathnameForPermissionRules(pathname);
+    if (hasRule(rulesMap, normalized)) {
+        return { matched: true, roles: rulesMap[normalized] ?? [] };
     }
-    cb(value);
-    Object.values(value).forEach(item => visit(item, cb));
-};
-const validateGoodsReceiptChecks = (data) => {
-    let invalidPath = null;
-    const isCheckStatus = (v) => v === undefined || v === null || v === "pass" || v === "fail";
-    const isCompareStatus = (v) => v === undefined || v === null || v === "match" || v === "mismatch";
-    visit(data, node => {
-        if (invalidPath)
-            return;
-        if ("quantity_check" in node && !isCheckStatus(node.quantity_check)) {
-            invalidPath = "quantity_check";
-            return;
+    const pathSegments = normalized.split("/").filter(Boolean);
+    for (const [pattern, roles] of Object.entries(rulesMap)) {
+        const patternSegments = pattern.split("/").filter(Boolean);
+        if (patternSegments.length !== pathSegments.length)
+            continue;
+        let matches = true;
+        for (let i = 0; i < patternSegments.length; i++) {
+            const patternSegment = patternSegments[i];
+            const pathSegment = pathSegments[i];
+            if (patternSegment.startsWith("[") && patternSegment.endsWith("]")) {
+                if (!pathSegment) {
+                    matches = false;
+                    break;
+                }
+            }
+            else if (patternSegment !== pathSegment) {
+                matches = false;
+                break;
+            }
         }
-        if ("quality_check" in node && !isCheckStatus(node.quality_check)) {
-            invalidPath = "quality_check";
-            return;
+        if (matches) {
+            return { matched: true, roles: roles ?? [] };
         }
-        if ("compare_with_reference" in node &&
-            !isCompareStatus(node.compare_with_reference)) {
-            invalidPath = "compare_with_reference";
+    }
+    // Parent-prefix: /leave/types/abc → /leave/types (non-empty roles only)
+    for (let len = pathSegments.length - 1; len >= 1; len--) {
+        const parent = "/" + pathSegments.slice(0, len).join("/");
+        if (hasRule(rulesMap, parent) && (rulesMap[parent]?.length ?? 0) > 0) {
+            return { matched: true, roles: rulesMap[parent] ?? [] };
         }
+    }
+    return { matched: false, roles: [] };
+}
+/**
+ * Returns the required child-group segments for a page pathname.
+ *
+ * Prefer {@link resolveUiRoutePermission} when you need to distinguish
+ * "explicitly public (`[]`)" from "no rule (deny)". This helper returns
+ * `[]` for both cases and is kept for backward compatibility.
+ */
+function getRequiredChildGroups(pathname, rulesMap) {
+    return resolveUiRoutePermission(pathname, rulesMap).roles;
+}
+
+function DeniedCard() {
+    return (jsxRuntime.jsx(AccessDenied, { message: "\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49 \u0E2B\u0E32\u0E01\u0E04\u0E34\u0E14\u0E27\u0E48\u0E32\u0E04\u0E27\u0E23\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E44\u0E14\u0E49 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E23\u0E30\u0E1A\u0E1A\u0E02\u0E2D\u0E07\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }));
+}
+/**
+ * Permission gate for a page subtree. Looks up the current pathname in the
+ * permission rules map (live rules from `PermissionRulesProvider`, layered
+ * over the optional `fallbackRulesMap`), passes the resolved required roles
+ * into the host's `usePermission` probe, and renders one of:
+ *
+ * 1. rules / probe still loading → `null` on FIRST load only (let Suspense /
+ *    loading.tsx show); once this subtree has been granted access, a later
+ *    loading state keeps the children mounted — see the note below
+ * 2. no rule covers this path → deny (fail closed)
+ * 3. rule is explicit public (`[]`) → children
+ * 4. probe says no access → deny card
+ * 5. otherwise → children
+ */
+function PermissionProvider({ children, usePermission, fallbackRulesMap, }) {
+    const pathname = navigation.usePathname();
+    const { rulesMap, isLoading: rulesLoading } = usePermissionRules();
+    const mergedMap = React.useMemo(() => {
+        if (!fallbackRulesMap)
+            return rulesMap;
+        // live rules win over fallback when both define the same key
+        return { ...fallbackRulesMap, ...rulesMap };
+    }, [rulesMap, fallbackRulesMap]);
+    const lookup = React.useMemo(() => resolveUiRoutePermission(pathname, mergedMap), [pathname, mergedMap]);
+    // Hook must run unconditionally (rules of hooks).
+    const { hasPermission, isLoading } = usePermission({
+        requiredRoles: lookup.roles,
     });
-    if (invalidPath) {
-        return {
-            valid: false,
-            message: "รูปแบบข้อมูลไม่ถูกต้อง: ฟิลด์ตรวจรับต้องเป็น enum string (quantity/quality: pass|fail, compare: match|mismatch)",
-        };
+    // Returning null unmounts the page. That is fine before anything has been
+    // shown, and destructive afterwards: next-auth flips its status back to
+    // "loading" on every session update() — one runs every 4 minutes — and a
+    // rules hook that reports loading on that transient took the page down with
+    // it. Users filling a long form watched everything they had typed vanish,
+    // which reads as a spontaneous page refresh.
+    //
+    // So a loading state only blanks the subtree until access has been granted
+    // once. After that the children stay mounted while the check re-settles; the
+    // API still enforces access on every request, and a genuine loss of
+    // permission surfaces as a denied response rather than a wiped form.
+    //
+    // The grant is remembered per pathname, not per mount. This provider lives in
+    // the layout, so it survives every in-app navigation — a bare boolean would
+    // carry one page's grant onto the next route and flash a page the user may
+    // not be allowed to see while its own check is still running.
+    const grantedForPathRef = React.useRef(null);
+    const grantedHere = grantedForPathRef.current === pathname;
+    if (rulesLoading && !grantedHere) {
+        return null;
     }
-    return { valid: true };
-};
-const runGlobalRequestPrecheck = (config) => {
-    const method = (config.method || "get").toLowerCase();
-    const isWriteMethod = ["post", "put", "patch"].includes(method);
-    if (!isWriteMethod || config.data === undefined || config.data === null) {
-        return { valid: true };
+    // Unknown route → deny. Only explicit `required_child_groups: []` is public.
+    if (!lookup.matched) {
+        return jsxRuntime.jsx(DeniedCard, {});
     }
-    if (typeof FormData !== "undefined" && config.data instanceof FormData) {
-        return { valid: true };
+    if (lookup.roles.length === 0) {
+        grantedForPathRef.current = pathname;
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
     }
-    return validateGoodsReceiptChecks(config.data);
-};
+    if (isLoading && !grantedHere) {
+        return null;
+    }
+    if (!hasPermission && !isLoading) {
+        return jsxRuntime.jsx(DeniedCard, {});
+    }
+    grantedForPathRef.current = pathname;
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+}
 
-const isBrowser = () => typeof window !== "undefined";
-const isAuthEndpoint = (url) => !!url && url.includes("/api/auth/");
-const isAuthPage = () => isBrowser() && window.location.pathname.startsWith("/auth/");
-const getOrgFromCookie = () => {
-    if (!isBrowser())
+/** Cookie name for the cross-subdomain theme choice. */
+const THEME_COOKIE = "erp-theme";
+/**
+ * Parent domain to scope the cookie to, so every `*.antniti.com` app reads the
+ * same value. Returns `null` on localhost / bare IPs (host-only cookie).
+ */
+function sharedCookieDomain() {
+    if (typeof window === "undefined")
         return null;
-    const cookies = document.cookie.split(";").map(cookie => cookie.trim());
-    const orgCookie = cookies.find(cookie => cookie.startsWith("erp.organizationId="));
-    if (!orgCookie)
+    const host = window.location.hostname;
+    if (host === "localhost" || /^[0-9.]+$/.test(host))
         return null;
-    const raw = orgCookie.substring("erp.organizationId=".length);
-    return raw ? decodeURIComponent(raw) : null;
-};
-const redirectToLogout = async () => {
-    if (!isBrowser() || isAuthPage())
+    const parts = host.split(".");
+    if (parts.length < 2)
+        return null;
+    return "." + parts.slice(-2).join(".");
+}
+function readThemeCookie() {
+    if (typeof document === "undefined")
+        return null;
+    const match = document.cookie.match(new RegExp("(?:^|; )" + THEME_COOKIE + "=([^;]*)"));
+    return match ? decodeURIComponent(match[1]) : null;
+}
+function writeThemeCookie(value) {
+    if (typeof document === "undefined")
         return;
-    localStorage.clear();
-    sessionStorage.clear();
-    setOrganizationId(null);
-    clearAccessTokenCache();
-    await react.signOut({ callbackUrl: "/auth/signin" });
+    const domain = sharedCookieDomain();
+    const parts = [
+        `${THEME_COOKIE}=${encodeURIComponent(value)}`,
+        "path=/",
+        "max-age=31536000", // 1 year
+        "SameSite=Lax",
+    ];
+    if (domain)
+        parts.push(`domain=${domain}`);
+    document.cookie = parts.join("; ");
+}
+/**
+ * Bridges next-themes (per-origin localStorage) with a cookie scoped to the
+ * parent domain, so the light/dark/system choice is shared across the
+ * accounting / HR / platform subdomains.
+ *
+ * Local storage wins when it already has a value (H57): adopting the shared
+ * cookie first used to overwrite an explicit choice — including one set via
+ * DevTools — and write `theme=light` back on every load whenever the cookie
+ * still said light. Push the local value into the cookie instead so sibling
+ * apps catch up.
+ */
+function ThemeCookieSync() {
+    const { theme, setTheme } = nextThemes.useTheme();
+    const skipFirstWrite = React__namespace.useRef(true);
+    React__namespace.useEffect(() => {
+        const local = typeof window !== "undefined"
+            ? window.localStorage.getItem("theme")
+            : null;
+        const cookie = readThemeCookie();
+        if (local) {
+            if (local !== theme)
+                setTheme(local);
+            writeThemeCookie(local);
+        }
+        else if (cookie) {
+            if (cookie !== theme)
+                setTheme(cookie);
+        }
+        else if (theme) {
+            writeThemeCookie(theme);
+        }
+        // Run once on mount — `theme` is intentionally not a dependency here.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    React__namespace.useEffect(() => {
+        // Skip the initial render; only persist genuine changes (incl. the
+        // setTheme() triggered by adopting storage above — harmless re-write).
+        if (skipFirstWrite.current) {
+            skipFirstWrite.current = false;
+            return;
+        }
+        if (theme)
+            writeThemeCookie(theme);
+    }, [theme]);
+    return null;
+}
+function ThemeProvider({ children, ...props }) {
+    return (jsxRuntime.jsxs(nextThemes.ThemeProvider, { ...props, children: [jsxRuntime.jsx(ThemeCookieSync, {}), children] }));
+}
+
+const defaultFlags = {
+    enableAdvancedReporting: true,
+    enableMultiCurrency: false,
+    enableThaiTaxCalculation: true,
+    enableProcurementWorkflow: true,
+    enableInventoryTracking: true,
+    enableAuditTrail: true,
+    enableAdvancedFilter: true,
+    filterFlag: false,
+    setFilterFlag: () => { },
 };
-const instance = axios.create({
-    baseURL: process.env.NEXT_PUBLIC_API_URL,
-    headers: { "Content-Type": "application/json" },
-    paramsSerializer: params => {
-        const searchParams = new URLSearchParams();
-        Object.entries(params || {}).forEach(([key, value]) => {
-            if (Array.isArray(value)) {
-                value.forEach(v => searchParams.append(key, String(v)));
-            }
-            else if (value !== undefined && value !== null) {
-                searchParams.append(key, String(value));
+const FeatureFlagsContext = React.createContext(defaultFlags);
+function FeatureFlagsProvider({ children, flags = {}, }) {
+    const [filterFlag, setFilterFlag] = React.useState(false);
+    const mergedFlags = {
+        ...defaultFlags,
+        ...flags,
+        filterFlag: flags.filterFlag ?? filterFlag,
+        setFilterFlag: (flag) => {
+            setFilterFlag(flag);
+            if (typeof flags.setFilterFlag === "function") {
+                flags.setFilterFlag(flag);
             }
-        });
-        return searchParams.toString();
-    },
-});
-instance.interceptors.request.use(async (config) => {
-    if (!config.headers) {
-        config.headers = new axios.AxiosHeaders();
-    }
-    if (config.data instanceof FormData && config.headers) {
-        delete config.headers["Content-Type"];
-    }
-    if (!isBrowser())
-        return config;
-    const token = await getAccessToken(false);
-    if (token) {
-        config.headers.Authorization = `Bearer ${token}`;
-    }
-    // localStorage first, cookie second.
-    //
-    // Both are written by the same state machine, but not at the same moment:
-    // setOrganizationId writes localStorage synchronously and then awaits a
-    // server action for the cookie. Preferring the cookie meant every request
-    // fired during that round trip carried the previous organisation — while
-    // the query params, built from React state, already carried the new one.
-    //
-    // The backend scopes by this header and ignores organization_id in the
-    // query, so those requests asked for organisation A and were handed B, and
-    // the answer landed in the cache under A's key. No amount of cache clearing
-    // reaches that: the entry is wrong, not stale.
-    const organizationId = getOrganizationId() || getOrgFromCookie();
-    if (organizationId) {
-        config.headers["X-Organization-ID"] = organizationId;
+        },
+    };
+    return (jsxRuntime.jsx(FeatureFlagsContext.Provider, { value: mergedFlags, children: children }));
+}
+function useFeatureFlags() {
+    const context = React.useContext(FeatureFlagsContext);
+    if (!context) {
+        throw new Error("useFeatureFlags must be used within a FeatureFlagsProvider");
     }
-    const precheck = runGlobalRequestPrecheck(config);
-    if (!precheck.valid) {
-        throw new ApiError(precheck.message || "Invalid request payload");
+    return context;
+}
+function useFeatureFlag(flag) {
+    const flags = useFeatureFlags();
+    return flags[flag];
+}
+
+const getAxiosErrorMessage$1 = (error) => {
+    if (error.response?.data?.message) {
+        return error.response.data.message;
     }
-    return config;
-});
-let refreshPromise = null;
-const refreshTokenSingleFlight = async () => {
-    if (!refreshPromise) {
-        refreshPromise = getAccessToken(true).finally(() => {
-            refreshPromise = null;
-        });
+    if (error.message) {
+        return error.message;
     }
-    return refreshPromise;
+    return "An unknown error occurred";
 };
-instance.interceptors.response.use(response => {
-    // Any successful call means the session can act in this organisation
-    // after all. Without this the gate, once raised, stayed up through a
-    // whole working session — including the seconds between an administrator
-    // adding somebody and the employee record existing.
-    if (typeof window !== "undefined") {
-        window.dispatchEvent(new CustomEvent("erp:employee-record-ok"));
-    }
-    return response;
-}, async (error) => {
-    const originalRequest = error.config;
-    const requestUrl = originalRequest?.url || error.config?.url;
-    if (error.response?.status === 401 &&
-        originalRequest &&
-        !originalRequest._retry &&
-        !isAuthEndpoint(requestUrl) &&
-        !isAuthPage()) {
-        originalRequest._retry = true;
-        const newToken = await refreshTokenSingleFlight();
-        if (newToken && originalRequest.headers) {
-            originalRequest.headers.Authorization = `Bearer ${newToken}`;
-            return instance(originalRequest);
-        }
-        await redirectToLogout();
-        return Promise.reject(toApiError(error));
-    }
-    // The server refuses every organisation-scoped call when the account has
-    // no employee record. Announce it once so a gate can explain it, instead
-    // of letting each failed query raise its own toast.
-    if (error.response?.status === 403) {
-        const body = error.response.data;
-        if (body?.code === "EMPLOYEE_RECORD_REQUIRED" && typeof window !== "undefined") {
-            window.dispatchEvent(new CustomEvent("erp:employee-record-required"));
-        }
+const formatError = (handlerName, error) => {
+    const axiosError = error;
+    const message = getAxiosErrorMessage$1(axiosError);
+    const isOrgRequired = message.includes("Organization context is required") ||
+        message.includes("organization_id") ||
+        message.includes("X-Organization-ID");
+    if (isOrgRequired) {
+        // Expected when no org selected yet (e.g. select-organization page).
+        console.warn(`[React Query] ${handlerName} skipped (no organization context): ${message}`);
+        return;
     }
-    return Promise.reject(toApiError(error));
+};
+/**
+ * Default React Query config used across ERP apps:
+ *   - 2 retries on queries / 1 on mutations, exponential backoff
+ *   - 5 min staleTime, refetchOnWindowFocus
+ *   - swallows "no org context" errors to silence noise on the
+ *     select-organization page
+ *
+ * Apps can compose on top of this — pass the returned config to `new QueryClient(...)`
+ * directly or spread + override default options.
+ */
+const getQueryClientConfig = () => ({
+    defaultOptions: {
+        queries: {
+            retry: 2,
+            retryDelay: attemptIndex => Math.min(1000 * 2 ** attemptIndex, 30000),
+            staleTime: 5 * 60 * 1000,
+            refetchOnWindowFocus: true,
+        },
+        mutations: {
+            // NEVER auto-retry a mutation. Unlike a query, a mutation is a side
+            // effect on a non-idempotent endpoint (submit, create, approve), and
+            // React Query cannot tell "the network dropped" from "the server
+            // rejected this on business grounds".
+            //
+            // With retry: 1 every failed mutation fired twice. Two visible
+            // consequences: a rejected submit showed up as two failed POSTs in the
+            // network tab, and — far worse — a create whose response was lost in
+            // flight would be re-sent and duplicate the record server-side.
+            //
+            // Retrying is the caller's decision, not a global default: the user
+            // sees the error and presses the button again.
+            retry: 0,
+        },
+    },
+    queryCache: new reactQuery.QueryCache({
+        onError: error => formatError("Query", error),
+    }),
+    mutationCache: new reactQuery.MutationCache({
+        onError: error => formatError("Mutation", error),
+    }),
 });
 
-const hasPaginationShape = (payload) => {
-    return ("total" in payload ||
-        "page" in payload ||
-        "per_page" in payload ||
-        "total_pages" in payload ||
-        "has_next" in payload ||
-        "has_prev" in payload ||
-        "pagination" in payload);
-};
-const isEnvelope = (payload) => {
-    return ("success" in payload || "message" in payload) && !hasPaginationShape(payload);
-};
-const unwrapApiResponse = (payload) => {
-    if (!payload || typeof payload !== "object") {
-        return payload;
+function ReactQueryProvider({ children }) {
+    // Create a new QueryClient instance for each render to avoid SSR issues.
+    const [queryClient] = React.useState(() => new reactQuery.QueryClient(getQueryClientConfig()));
+    return (jsxRuntime.jsxs(reactQuery.QueryClientProvider, { client: queryClient, children: [children, jsxRuntime.jsx(reactQueryDevtools.ReactQueryDevtools, { client: queryClient, initialIsOpen: false })] }));
+}
+
+/**
+ * Renders nothing. Runs during render (after SessionProvider, inside
+ * QueryClientProvider) to seed the cached profile slot from the JWT-backed
+ * session — so `useMyProfile` doesn't fire a redundant GET on initial load.
+ *
+ * Generic over the profile shape; each app passes its own queryKey + mapper.
+ */
+function SessionBackedProfileCacheSeeder({ queryKey, mapper, }) {
+    const { data: session, status } = react.useSession();
+    const queryClient = reactQuery.useQueryClient();
+    if (status === "authenticated" && session) {
+        const mapped = mapper(session);
+        if (mapped) {
+            const existing = queryClient.getQueryData(queryKey);
+            if (!existing) {
+                // updatedAt: 0 → immediately stale so observers still GET /myprofile
+                // for fields the JWT seed omits (avatar/signature paths).
+                queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
+            }
+            else {
+                // Only overwrite when the mapped id changed — we don't know T's shape
+                // so we rely on a shallow id check via JSON tag if present.
+                const existingId = existing?.id;
+                const mappedId = mapped?.id;
+                if (existingId !== mappedId) {
+                    queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
+                }
+            }
+        }
     }
-    const record = payload;
-    if ("data" in record &&
-        record.data !== undefined &&
-        isEnvelope(record)) {
-        return record.data;
+    if (status === "unauthenticated") {
+        queryClient.removeQueries({ queryKey });
     }
-    return payload;
-};
+    return null;
+}
 
 // Hooks
 const updateOrganizationId = (organizationId) => {
@@ -2358,6 +2790,8 @@ exports.EMPLOYEE_RECORD_REQUIRED_EVENT = EMPLOYEE_RECORD_REQUIRED_EVENT;
 exports.EmployeeRequiredGate = EmployeeRequiredGate;
 exports.FeatureFlagsProvider = FeatureFlagsProvider;
 exports.HeaderBackground = HeaderBackground;
+exports.HelpButton = HelpButton;
+exports.HelpDialogHost = HelpDialogHost;
 exports.NavMain = NavMain;
 exports.NavTools = NavTools;
 exports.NavUser = NavUser;
@@ -2367,6 +2801,7 @@ exports.PermissionGateShell = PermissionGateShell;
 exports.PermissionProvider = PermissionProvider;
 exports.PermissionRulesProvider = PermissionRulesProvider;
 exports.ReactQueryProvider = ReactQueryProvider;
+exports.SHELL_VERSION = SHELL_VERSION;
 exports.SessionBackedProfileCacheSeeder = SessionBackedProfileCacheSeeder;
 exports.SessionRefreshTrigger = SessionRefreshTrigger;
 exports.SidebarContent = SidebarContent;
@@ -2387,7 +2822,11 @@ exports.buildUrlWithCode = buildUrlWithCode;
 exports.canAccessNavPermissionRoute = canAccessNavPermissionRoute;
 exports.clearAccessTokenCache = clearAccessTokenCache;
 exports.clearOrganizationId = clearOrganizationId;
+exports.closeHelp = closeHelp;
 exports.decodeJWT = decodeJWT;
+exports.describeAttached = describeAttached;
+exports.describeBrowser = describeBrowser;
+exports.detectHelpApp = detectHelpApp;
 exports.filterNavigationModulesByPermission = filterNavigationModulesByPermission;
 exports.filterNavigationToolsByPermission = filterNavigationToolsByPermission;
 exports.getAccessToken = getAccessToken;
@@ -2401,6 +2840,7 @@ exports.hasPlanFeature = hasPlanFeature;
 exports.isLikelyTransientNetworkError = isLikelyTransientNetworkError;
 exports.isPathActive = isPathActive;
 exports.normalizePathnameForPermissionRules = normalizePathnameForPermissionRules;
+exports.openHelp = openHelp;
 exports.resolveUiRoutePermission = resolveUiRoutePermission;
 exports.runGlobalRequestPrecheck = runGlobalRequestPrecheck;
 exports.runWithTransientRetry = runWithTransientRetry;