@eintrek/erp-shell 0.1.73 → 0.1.75

package/dist/guide/types.d.ts

@@ -41,6 +41,12 @@ export interface GuideContext {
     can: (policyKey: string) => boolean;
     /** Whether an anchor is on screen now. */
     visible: (anchor: GuideAnchorKey) => boolean;
+    /**
+     * A section guide's live values, as the app last rendered them
+     * (`useSectionGuideValues` / `SectionGuideButton values`); empty
+     * elsewhere. Shell ≥ 0.1.75.
+     */
+    values?: Readonly<Record<string, unknown>>;
 }
 /** Text that may depend on the context. */
 export type GuideText = string | ((ctx: GuideContext) => string);
@@ -171,6 +177,12 @@ export interface GuideStep {
     status?: (ctx: GuideContext) => string | null | undefined;
     /** Skip the step (silently) when true. Runs every time it is entered. */
     skipIf?: (ctx: GuideContext) => boolean;
+    /**
+     * Section guides: the live values this step's copy uses
+     * (`ctx.values`). The step is skipped while any is missing (undefined,
+     * null, "" or a number that is not finite). Shell ≥ 0.1.75.
+     */
+    needs?: string[];
     /** A policy key the step needs (checked with `guides.can`); skipped when
      *  the user lacks it. */
     requires?: string;
@@ -322,6 +334,95 @@ export interface GuideGate {
     /** The line on each mission in the panel while waiting: "ต้องมีพนักงาน 2 คน". */
     pending: string;
 }
+/**
+ * A page guide ("คู่มือหน้านี้", shell ≥ 0.1.74): a read-only walk through one
+ * page's regions and buttons — what the page is for, what each column,
+ * filter and status means, what each button does. It never saves: only
+ * "view" and "click" steps (the engine drops a page guide with a "commit",
+ * "input" or "select" step, with a warning in development), and it runs as
+ * a replay, so nothing it touches writes tour progress. Authors:
+ * _claude-work/guides-r4/GUIDE-PAGES.md.
+ *
+ * Progress is one row per page per user, `<app>.page.<key>`, written once:
+ * when the first-visit offer is answered or ignored, or when the guide ends
+ * (finished → completed; exited or left → skipped). Opened again from "?",
+ * it writes nothing.
+ */
+export interface GuidePage {
+    /** Stable, [a-z0-9-]: the row key is `${suite.app}.page.${key}` (≤ 64 characters). */
+    key: string;
+    /** Raise it to offer this page's guide again to everyone (this page only). */
+    version: number;
+    /**
+     * The page, as GuideTrigger.route ("/[code]/project/budgets",
+     * "/[code]/project/detail/[id]?view=gantt"); several for one page. When
+     * several page guides match, the most specific wins: one with `when`, then
+     * the most `?k=v` constraints, then the most static segments. If the
+     * winner is not for this user (`visible`, `requires`), there is none here.
+     */
+    route: string | string[];
+    /**
+     * An anchor that must be on screen for this guide to apply: sub-screens
+     * that share a URL (LIFF's leave list vs its form). The offer waits for it,
+     * and the guide ends when it goes.
+     */
+    when?: GuideAnchorKey;
+    /** "งบประมาณ": the offer card, "?" → "คู่มือหน้านี้" and the panel's list. ≤ 30 characters. */
+    title: string;
+    /**
+     * Where the panel's "คู่มือแต่ละหน้า" list opens it (`[code]` filled in).
+     * Omit it for pages that need an id (`[id]`): those are listed only on
+     * the page itself, through "คู่มือหน้านี้".
+     */
+    href?: GuideText;
+    /** Only `true` shows it (as GuideMission.visible): role, plan, module, menu. */
+    visible?: (ctx: GuideContext) => boolean | undefined;
+    /** A policy key the page needs (checked with `guides.can`). */
+    requires?: string;
+    /** false: never offered by itself, only opened from "?". Default true. */
+    offer?: boolean;
+    /**
+     * "view" and "click" steps only, ≤ 9 (the app's tests check the count).
+     * Steps take no `route`: the guide ends when the page is left. Every step
+     * is a checkpoint unless it says `checkpoint: false` (a step inside a
+     * dialog or menu a click opened: a closed dialog goes back to the click,
+     * and closing the guide there presses Escape).
+     */
+    steps: GuideStep[];
+}
+/**
+ * A section guide ("อธิบายส่วนนี้", shell ≥ 0.1.75): explains one section of
+ * a page — a number-heavy card or table — row by row, with the formula and
+ * this record's own numbers. Read-only ("view" steps only; a step may point
+ * at a row or cell inside the section with `targetId`), never offered by
+ * itself: it opens from the section's `SectionGuideButton` or from "?" →
+ * "อธิบายส่วนนี้ · <title>". Same switch and audience as page guides
+ * (`guides.<app>.pages` not off); one row per section guide per person,
+ * `<app>.section.<key>`, written once. Authors:
+ * _claude-work/guides-r4/GUIDE-PAGES.md §10.
+ */
+export interface GuideSection {
+    /** Stable, [a-z0-9-]: the row key is `${suite.app}.section.${key}` (≤ 64 characters). */
+    key: string;
+    version: number;
+    /** The page(s) the section is on, as GuidePage.route. */
+    route: string | string[];
+    /** The section's root: the guide is there only while it is on screen. */
+    anchor: GuideAnchorKey;
+    /** "สรุปกระแสเงินสด": the "?" entry and the bubble's heading. ≤ 40 characters. */
+    title: string;
+    /** Only `true` shows it (as GuideMission.visible). */
+    visible?: (ctx: GuideContext) => boolean | undefined;
+    /** A policy key the section needs (checked with `guides.can`). */
+    requires?: string;
+    /**
+     * "view" steps (the default here), about 12 at most; titles ≤ 40 and whys
+     * ≤ 90 characters (the app's tests check). Copy may be a function of
+     * `ctx.values`; list what it uses in `needs`, and a step whose value is
+     * missing is skipped (so is one whose title comes out empty).
+     */
+    steps: GuideStep[];
+}
 /** One app's whole tour: the welcome, the missions, the finish. */
 export interface GuideSuite {
     /** Progress key on the server, "<app>.<name>": "peoplx.first-run". */
@@ -365,6 +466,10 @@ export interface GuideSuite {
         };
     };
     missions: GuideMission[];
+    /** Page guides ("คู่มือหน้านี้"), shell ≥ 0.1.74. */
+    pages?: GuidePage[];
+    /** Section guides ("อธิบายส่วนนี้"), shell ≥ 0.1.75. */
+    sections?: GuideSection[];
 }
 /** AppLayoutShell's `guides` prop. */
 export interface GuideConfig {
@@ -378,4 +483,10 @@ export interface GuideConfig {
      * Default true.
      */
     ready?: boolean;
+    /**
+     * False holds the page guides alone; default: as `ready`. Lets pages run
+     * while the missions wait (Accounx's settings pages are open before
+     * `module.accounting` is known). Shell ≥ 0.1.74.
+     */
+    pagesReady?: boolean;
 }

package/dist/guide-core.cjs

@@ -1,7 +1,7 @@
 'use client';
 'use strict';
 
-var guideRuntime = require('./chunks/guide-runtime-CLVSNkTN.cjs');
+var format = require('./chunks/format-CVazK0hP.cjs');
 require('react/jsx-runtime');
 require('react');
 require('react-dom');
@@ -9,22 +9,35 @@ require('@floating-ui/dom');
 
 
 
-exports.GUIDE_API_EVENT = guideRuntime.API_EVENT;
-exports.GUIDE_EVENT_PREFIX = guideRuntime.GUIDE_EVENT_PREFIX;
-exports.GUIDE_LAYER_ATTRIBUTE = guideRuntime.GUIDE_LAYER_ATTRIBUTE;
-exports.GuideProgressConflict = guideRuntime.GuideProgressConflict;
-exports.GuideRuntime = guideRuntime.GuideRuntime;
-exports.apiCallDetail = guideRuntime.apiCallDetail;
-exports.emitGuideEvent = guideRuntime.emitGuideEvent;
-exports.fillRoute = guideRuntime.fillRoute;
-exports.guideAnchor = guideRuntime.guideAnchor;
-exports.guideMenuShown = guideRuntime.guideMenuShown;
-exports.loadGuides = guideRuntime.loadGuides;
-exports.matchApiPath = guideRuntime.matchApiPath;
-exports.matchRoute = guideRuntime.matchRoute;
-exports.openGuidePanel = guideRuntime.openGuidePanel;
-exports.reportApiCall = guideRuntime.reportApiCall;
-exports.reportApiEvent = guideRuntime.reportApiEvent;
-exports.storeGuides = guideRuntime.storeGuides;
-exports.useGuideEntry = guideRuntime.useGuideEntry;
+exports.GUIDE_API_EVENT = format.API_EVENT;
+exports.GUIDE_EVENT_PREFIX = format.GUIDE_EVENT_PREFIX;
+exports.GUIDE_LAYER_ATTRIBUTE = format.GUIDE_LAYER_ATTRIBUTE;
+exports.GuideProgressConflict = format.GuideProgressConflict;
+exports.GuideRuntime = format.GuideRuntime;
+exports.SectionGuideButton = format.SectionGuideButton;
+exports.THAI_MONTHS_SHORT = format.THAI_MONTHS_SHORT;
+exports.apiCallDetail = format.apiCallDetail;
+exports.emitGuideEvent = format.emitGuideEvent;
+exports.fillRoute = format.fillRoute;
+exports.formatBaht = format.formatBaht;
+exports.guideAnchor = format.guideAnchor;
+exports.guideMenuItems = format.guideMenuItems;
+exports.guideMenuShown = format.guideMenuShown;
+exports.loadGuides = format.loadGuides;
+exports.matchApiPath = format.matchApiPath;
+exports.matchRoute = format.matchRoute;
+exports.openGuidePanel = format.openGuidePanel;
+exports.openPageGuide = format.openPageGuide;
+exports.openPagesPanel = format.openPagesPanel;
+exports.openSectionGuide = format.openSectionGuide;
+exports.reportApiCall = format.reportApiCall;
+exports.reportApiEvent = format.reportApiEvent;
+exports.setSectionGuideValues = format.setSectionGuideValues;
+exports.storeGuides = format.storeGuides;
+exports.thaiMonth = format.thaiMonth;
+exports.thaiMonthYear = format.thaiMonthYear;
+exports.useGuideEntry = format.useGuideEntry;
+exports.usePageGuideEntry = format.usePageGuideEntry;
+exports.usePageGuides = format.usePageGuides;
+exports.useSectionGuideValues = format.useSectionGuideValues;
 //# sourceMappingURL=guide-core.cjs.map

package/dist/guide-core.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"guide-core.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"guide-core.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/guide-core.esm.js

@@ -1,5 +1,5 @@
 'use client';
-export { A as GUIDE_API_EVENT, G as GUIDE_EVENT_PREFIX, a as GUIDE_LAYER_ATTRIBUTE, c as GuideProgressConflict, d as GuideRuntime, e as apiCallDetail, f as emitGuideEvent, g as fillRoute, h as guideAnchor, i as guideMenuShown, l as loadGuides, m as matchApiPath, j as matchRoute, o as openGuidePanel, r as reportApiCall, k as reportApiEvent, s as storeGuides, u as useGuideEntry } from './chunks/guide-runtime-C7Z00QwM.esm.js';
+export { A as GUIDE_API_EVENT, G as GUIDE_EVENT_PREFIX, a as GUIDE_LAYER_ATTRIBUTE, c as GuideProgressConflict, d as GuideRuntime, S as SectionGuideButton, T as THAI_MONTHS_SHORT, e as apiCallDetail, f as emitGuideEvent, g as fillRoute, h as formatBaht, i as guideAnchor, j as guideMenuItems, k as guideMenuShown, l as loadGuides, m as matchApiPath, n as matchRoute, o as openGuidePanel, p as openPageGuide, q as openPagesPanel, r as openSectionGuide, s as reportApiCall, t as reportApiEvent, u as setSectionGuideValues, v as storeGuides, w as thaiMonth, x as thaiMonthYear, y as useGuideEntry, z as usePageGuideEntry, B as usePageGuides, C as useSectionGuideValues } from './chunks/format-DCTuLpBU.esm.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'react-dom';

package/dist/help/help-button.d.ts

@@ -5,8 +5,11 @@ export interface HelpButtonProps {
  * The ช่วยเหลือ button in the top bar. Drawn in the header's ink (the
  * --header-* variables of the workspace chrome, white on the brand chrome).
  *
- * When this user has a guided tour in this app, it opens a small menu:
- * "ไกด์เริ่มต้น n/N" (the quest panel) and "ติดต่อทีมช่วยเหลือ" (the help
- * dialog). Otherwise one press opens the help dialog, as before.
+ * When this user has something to open here, it opens a small menu:
+ * "คู่มือหน้านี้" (this page's guide), "อธิบายส่วนนี้ · <title>" for each
+ * section guide on screen, "ไกด์เริ่มต้น n/N" (the quest
+ * panel), "คู่มือทุกหน้า" (the panel's page guides) and "ติดต่อทีมช่วยเหลือ"
+ * (the help dialog), each only when it has something. Otherwise one press
+ * opens the help dialog, as before.
  */
 export declare function HelpButton({ className }: HelpButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/index.cjs

@@ -14,7 +14,7 @@ var Link = require('next/link');
 var reactDom = require('react-dom');
 var nextThemes = require('next-themes');
 var axios = require('axios');
-var guideRuntime = require('./chunks/guide-runtime-CLVSNkTN.cjs');
+var format = require('./chunks/format-CVazK0hP.cjs');
 var reactQueryDevtools = require('@tanstack/react-query-devtools');
 require('@floating-ui/dom');
 
@@ -1680,7 +1680,7 @@ instance.interceptors.response.use(response => {
     }
     // The guided tour advances on saves that succeeded (method, path, status
     // and the record's id only; never the body).
-    guideRuntime.reportApiEvent(response);
+    format.reportApiEvent(response);
     return response;
 }, async (error) => {
     const originalRequest = error.config;
@@ -1697,7 +1697,7 @@ instance.interceptors.response.use(response => {
             return instance(originalRequest);
         }
         await redirectToLogout();
-        guideRuntime.reportApiEvent(error);
+        format.reportApiEvent(error);
         return Promise.reject(toApiError(error));
     }
     // The server refuses every organisation-scoped call when the account has
@@ -1713,7 +1713,7 @@ instance.interceptors.response.use(response => {
     if (listed !== undefined)
         return listed;
     // A refused save keeps the tour's step and shows the server's message.
-    guideRuntime.reportApiEvent(error);
+    format.reportApiEvent(error);
     return Promise.reject(toApiError(error));
 });
 
@@ -1740,7 +1740,7 @@ function platformApiBase(app) {
  * 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.
  */
-const SHELL_VERSION = "0.1.73";
+const SHELL_VERSION = "0.1.75";
 
 const HELP_APP_LABEL = {
     platform: "แพลตฟอร์ม",
@@ -2412,11 +2412,11 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                     // A one-line row: a link, lit on its own page only. No open
                     // state, no title tooltip.
                     return (jsxRuntime.jsxs(React__namespace.Fragment, { children: [groupHeading, jsxRuntime.jsx(SidebarMenuItem, { children: jsxRuntime.jsx(SidebarMenuButton, { asChild: true, isActive: isItemActive, className: workspaceButton, children: jsxRuntime.jsxs(Link, { href: itemUrl, prefetch: false, className: "flex items-center w-full min-w-0 flex-1 " +
-                                            (workspace ? "gap-3" : "gap-2"), onClick: handleNavLinkClick, "aria-current": isItemActive ? "page" : undefined, ...guideRuntime.guideAnchor(`nav.${item.id}`), children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate", children: item.titleTh }), badge] }) }) })] }, item.id));
+                                            (workspace ? "gap-3" : "gap-2"), onClick: handleNavLinkClick, "aria-current": isItemActive ? "page" : undefined, ...format.guideAnchor(`nav.${item.id}`), children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate", children: item.titleTh }), badge] }) }) })] }, item.id));
                 }
                 // A group: its header opens and shuts it (the chevron says which).
                 // An open group is not the current page — only a row in it is.
-                return (jsxRuntime.jsxs(React__namespace.Fragment, { children: [groupHeading, jsxRuntime.jsx(erpTheme.Collapsible, { asChild: true, open: openIds.has(item.id), onOpenChange: isOpen => setItemOpen(item.id, isOpen), className: "group/collapsible", children: jsxRuntime.jsxs(SidebarMenuItem, { children: [jsxRuntime.jsx(erpTheme.CollapsibleTrigger, { asChild: true, children: jsxRuntime.jsxs(SidebarMenuButton, { isActive: isItemActive, className: workspaceButton, ...guideRuntime.guideAnchor(`nav.${item.id}`), children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate text-left", children: item.titleTh }), jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })] }) }), item.subModules && (jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: workspace
+                return (jsxRuntime.jsxs(React__namespace.Fragment, { children: [groupHeading, jsxRuntime.jsx(erpTheme.Collapsible, { asChild: true, open: openIds.has(item.id), onOpenChange: isOpen => setItemOpen(item.id, isOpen), className: "group/collapsible", children: jsxRuntime.jsxs(SidebarMenuItem, { children: [jsxRuntime.jsx(erpTheme.CollapsibleTrigger, { asChild: true, children: jsxRuntime.jsxs(SidebarMenuButton, { isActive: isItemActive, className: workspaceButton, ...format.guideAnchor(`nav.${item.id}`), children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate text-left", children: item.titleTh }), jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })] }) }), item.subModules && (jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: workspace
                                                 ? "mx-0 mt-1 mb-3 ml-[21px] gap-0.5 border-l border-sidebar-border pl-2.5 [&_a]:h-auto [&_a]:gap-[11px] [&_a]:px-3 [&_a]:py-2 [&_a]:text-xs [&_svg]:!size-[17px]"
                                                 : undefined, children: item.subModules.map((subItem, subIndex) => {
                                                 const subItemUrl = buildUrlWithCode(code, subItem.url);
@@ -2429,7 +2429,7 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                                                     subItem.subPages &&
                                                     subItem.subPages.length > 0) {
                                                     return (jsxRuntime.jsx(erpTheme.Collapsible, { asChild: true, defaultOpen: isSubItemActive || openSub === subIndex, className: "group/sub-collapsible", children: jsxRuntime.jsxs(SidebarMenuSubItem, { children: [jsxRuntime.jsx(erpTheme.CollapsibleTrigger, { asChild: true, children: jsxRuntime.jsxs(SidebarMenuSubButton, { className: "w-full", isActive: isSubItemActive &&
-                                                                            activeSubPage === null, ...guideRuntime.guideAnchor(`nav.${subItem.id}`), children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), jsxRuntime.jsx(lucideReact.ChevronDown, { className: "ml-auto size-4 transition-transform duration-200 group-data-[state=open]/sub-collapsible:rotate-180" })] }) }), jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: "ml-4", children: subItem.subPages.map((subPage, subPageIndex) => {
+                                                                            activeSubPage === null, ...format.guideAnchor(`nav.${subItem.id}`), children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), jsxRuntime.jsx(lucideReact.ChevronDown, { className: "ml-auto size-4 transition-transform duration-200 group-data-[state=open]/sub-collapsible:rotate-180" })] }) }), jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: "ml-4", children: subItem.subPages.map((subPage, subPageIndex) => {
                                                                             const subPageUrl = buildUrlWithCode(code, subPage.url);
                                                                             const isSubPageActive = isSubItemActive &&
                                                                                 activeSubPage === subPageIndex;
@@ -2437,7 +2437,7 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                                                                             return (jsxRuntime.jsx(SidebarMenuSubItem, { children: jsxRuntime.jsx(SidebarMenuSubButton, { asChild: true, className: "font-thai w-full text-sm" +
                                                                                         (isSubPageActive
                                                                                             ? " font-medium"
-                                                                                            : ""), isActive: isSubPageActive, children: jsxRuntime.jsxs(Link, { href: subPageUrl, prefetch: false, className: "w-full flex items-center", ...guideRuntime.guideAnchor(`nav.${subPage.id}`), onClick: handleNavLinkClick, "aria-current": isSubPageActive
+                                                                                            : ""), isActive: isSubPageActive, children: jsxRuntime.jsxs(Link, { href: subPageUrl, prefetch: false, className: "w-full flex items-center", ...format.guideAnchor(`nav.${subPage.id}`), onClick: handleNavLinkClick, "aria-current": isSubPageActive
                                                                                             ? "page"
                                                                                             : undefined, children: [SubPageIcon && (jsxRuntime.jsx(SubPageIcon, { className: "sidebar-subpage-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subPage.titleTh })] }) }) }, subPage.id));
                                                                         }) }) })] }) }, subItem.id));
@@ -2445,7 +2445,7 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                                                 return (jsxRuntime.jsx(SidebarMenuSubItem, { children: jsxRuntime.jsx(SidebarMenuSubButton, { asChild: true, className: "w-full" +
                                                             (workspace && isSubItemActive
                                                                 ? " font-semibold"
-                                                                : ""), isActive: isSubItemActive, children: jsxRuntime.jsxs(Link, { href: subItemUrl, prefetch: false, className: "w-full flex items-center", ...guideRuntime.guideAnchor(`nav.${subItem.id}`), onClick: handleNavLinkClick, "aria-current": isSubItemActive ? "page" : undefined, children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), approvalCount > 0 && (jsxRuntime.jsx(erpTheme.Badge, { variant: "destructive", className: "ml-auto h-5 min-w-5 px-1.5 text-xs font-medium tabular-nums", children: approvalCount > 99
+                                                                : ""), isActive: isSubItemActive, children: jsxRuntime.jsxs(Link, { href: subItemUrl, prefetch: false, className: "w-full flex items-center", ...format.guideAnchor(`nav.${subItem.id}`), onClick: handleNavLinkClick, "aria-current": isSubItemActive ? "page" : undefined, children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), approvalCount > 0 && (jsxRuntime.jsx(erpTheme.Badge, { variant: "destructive", className: "ml-auto h-5 min-w-5 px-1.5 text-xs font-medium tabular-nums", children: approvalCount > 99
                                                                         ? "99+"
                                                                         : approvalCount }))] }) }) }, subItem.id));
                                             }) }) }))] }) })] }, item.id));
@@ -2572,15 +2572,25 @@ const BUTTON_CLASS = "grid size-[34px] shrink-0 place-items-center rounded-lg te
  * The ช่วยเหลือ button in the top bar. Drawn in the header's ink (the
  * --header-* variables of the workspace chrome, white on the brand chrome).
  *
- * When this user has a guided tour in this app, it opens a small menu:
- * "ไกด์เริ่มต้น n/N" (the quest panel) and "ติดต่อทีมช่วยเหลือ" (the help
- * dialog). Otherwise one press opens the help dialog, as before.
+ * When this user has something to open here, it opens a small menu:
+ * "คู่มือหน้านี้" (this page's guide), "อธิบายส่วนนี้ · <title>" for each
+ * section guide on screen, "ไกด์เริ่มต้น n/N" (the quest
+ * panel), "คู่มือทุกหน้า" (the panel's page guides) and "ติดต่อทีมช่วยเหลือ"
+ * (the help dialog), each only when it has something. Otherwise one press
+ * opens the help dialog, as before.
  */
 function HelpButton({ className }) {
-    const guide = guideRuntime.useGuideEntry();
+    const guide = format.useGuideEntry();
+    const pages = format.usePageGuides();
     const toGuide = React.useRef(false);
     const cls = BUTTON_CLASS + (className ? ` ${className}` : "");
-    if (!guideRuntime.guideMenuShown(guide)) {
+    const items = format.guideMenuItems(guide, pages);
+    // The tour takes focus (a step, the panel); the button must not take it back.
+    const toTour = (open) => () => {
+        toGuide.current = true;
+        setTimeout(open, 0);
+    };
+    if (!items.length) {
         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: cls, "data-guide": "shell.help", children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
     }
     return (jsxRuntime.jsxs(erpTheme.DropdownMenu, { children: [jsxRuntime.jsx(erpTheme.DropdownMenuTrigger, { asChild: true, children: jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", title: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", className: cls, "data-guide": "shell.help", children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }) }), jsxRuntime.jsxs(erpTheme.DropdownMenuContent, { align: "end", sideOffset: 8, className: "w-64", onCloseAutoFocus: e => {
@@ -2589,10 +2599,9 @@ function HelpButton({ className }) {
                         e.preventDefault();
                         toGuide.current = false;
                     }
-                }, children: [jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: () => {
-                            toGuide.current = true;
-                            setTimeout(guideRuntime.openGuidePanel, 0);
-                        }, className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.Flag, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E44\u0E01\u0E14\u0E4C\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19" }), jsxRuntime.jsxs("span", { className: "text-xs font-semibold text-primary tabular-nums", children: [guide.done, "/", guide.total] })] }), jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: () => setTimeout(openHelp, 0), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.MessageCircle, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E17\u0E35\u0E21\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })] })] }));
+                }, children: [items.includes("page") ? (jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: toTour(format.openPageGuide), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.BookOpen, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E04\u0E39\u0E48\u0E21\u0E37\u0E2D\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49" })] })) : null, items.includes("sections")
+                        ? (pages.sections ?? []).map(sec => (jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: toTour(() => format.openSectionGuide(sec.key)), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.Info, { className: "size-4" }), jsxRuntime.jsxs("span", { className: "flex-1", children: ["\u0E2D\u0E18\u0E34\u0E1A\u0E32\u0E22\u0E2A\u0E48\u0E27\u0E19\u0E19\u0E35\u0E49 \u00B7 ", sec.title] })] }, sec.key)))
+                        : null, items.includes("missions") && guide ? (jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: toTour(format.openGuidePanel), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.Flag, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E44\u0E01\u0E14\u0E4C\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19" }), jsxRuntime.jsxs("span", { className: "text-xs font-semibold text-primary tabular-nums", children: [guide.done, "/", guide.total] })] })) : null, items.includes("pages") ? (jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: toTour(format.openPagesPanel), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.Library, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E04\u0E39\u0E48\u0E21\u0E37\u0E2D\u0E17\u0E38\u0E01\u0E2B\u0E19\u0E49\u0E32" })] })) : null, jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: () => setTimeout(openHelp, 0), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.MessageCircle, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E17\u0E35\u0E21\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })] })] }));
 }
 
 const hasPaginationShape = (payload) => {
@@ -3603,7 +3612,7 @@ function platformGuideProgress(organizationId) {
 
 function GuideHost(props) {
     // The boundary covers the adapters too (useSidebar throws without its provider).
-    return (jsxRuntime.jsx(guideRuntime.GuideErrorBoundary, { children: jsxRuntime.jsx(React.Suspense, { fallback: null, children: jsxRuntime.jsx(GuideHostInner, { ...props }) }) }));
+    return (jsxRuntime.jsx(format.GuideErrorBoundary, { children: jsxRuntime.jsx(React.Suspense, { fallback: null, children: jsxRuntime.jsx(GuideHostInner, { ...props }) }) }));
 }
 let fallbackClient = null;
 function useShellQueryClient() {
@@ -3654,7 +3663,7 @@ function GuideHostInner({ config, organizationId, code }) {
     }, [client, organizationId, suite.app, suite.key, suite.version]);
     const routing = React.useMemo(() => ({ pathname, search, navigate: (href) => router.push(href) }), [pathname, search, router]);
     const menu = React.useMemo(() => ({ open: sidebarOpen }), [sidebarOpen]);
-    return (jsxRuntime.jsx(guideRuntime.GuideRuntime, { config: config, organizationId: organizationId, code: code, routing: routing, progress: progress, isBusy: isBusy, menu: menu, hidden: employeeBlocked }));
+    return (jsxRuntime.jsx(format.GuideRuntime, { config: config, organizationId: organizationId, code: code, routing: routing, progress: progress, isBusy: isBusy, menu: menu, hidden: employeeBlocked }));
 }
 
 /**
@@ -3863,7 +3872,7 @@ function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permi
                                         // 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 ? "ปิดเมนู" : "เปิดเมนู", ...guideRuntime.guideAnchor("shell.menu-toggle"), 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: trail }), 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: trail }), 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
+                                        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 ? "ปิดเมนู" : "เปิดเมนู", ...format.guideAnchor("shell.menu-toggle"), 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: trail }), 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: trail }), 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: refusePage
                                     ? (notMemberComponent ?? (jsxRuntime.jsx(AccessDenied, { title: "\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49", message: `บัญชีนี้ไม่ได้เป็นสมาชิกขององค์กร ${code}`, homeHref: selectOrganizationUrl, homeLabel: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })))
@@ -4436,18 +4445,31 @@ Object.defineProperty(exports, "isAxiosError", {
     enumerable: true,
     get: function () { return axios.isAxiosError; }
 });
-exports.GUIDE_API_EVENT = guideRuntime.API_EVENT;
-exports.GUIDE_EVENT_PREFIX = guideRuntime.GUIDE_EVENT_PREFIX;
-exports.GUIDE_LAYER_ATTRIBUTE = guideRuntime.GUIDE_LAYER_ATTRIBUTE;
-exports.GuideProgressConflict = guideRuntime.GuideProgressConflict;
-exports.GuideRuntime = guideRuntime.GuideRuntime;
-exports.emitGuideEvent = guideRuntime.emitGuideEvent;
-exports.guideAnchor = guideRuntime.guideAnchor;
-exports.guideMenuShown = guideRuntime.guideMenuShown;
-exports.openGuidePanel = guideRuntime.openGuidePanel;
-exports.reportApiCall = guideRuntime.reportApiCall;
-exports.reportApiEvent = guideRuntime.reportApiEvent;
-exports.useGuideEntry = guideRuntime.useGuideEntry;
+exports.GUIDE_API_EVENT = format.API_EVENT;
+exports.GUIDE_EVENT_PREFIX = format.GUIDE_EVENT_PREFIX;
+exports.GUIDE_LAYER_ATTRIBUTE = format.GUIDE_LAYER_ATTRIBUTE;
+exports.GuideProgressConflict = format.GuideProgressConflict;
+exports.GuideRuntime = format.GuideRuntime;
+exports.SectionGuideButton = format.SectionGuideButton;
+exports.THAI_MONTHS_SHORT = format.THAI_MONTHS_SHORT;
+exports.emitGuideEvent = format.emitGuideEvent;
+exports.formatBaht = format.formatBaht;
+exports.guideAnchor = format.guideAnchor;
+exports.guideMenuItems = format.guideMenuItems;
+exports.guideMenuShown = format.guideMenuShown;
+exports.openGuidePanel = format.openGuidePanel;
+exports.openPageGuide = format.openPageGuide;
+exports.openPagesPanel = format.openPagesPanel;
+exports.openSectionGuide = format.openSectionGuide;
+exports.reportApiCall = format.reportApiCall;
+exports.reportApiEvent = format.reportApiEvent;
+exports.setSectionGuideValues = format.setSectionGuideValues;
+exports.thaiMonth = format.thaiMonth;
+exports.thaiMonthYear = format.thaiMonthYear;
+exports.useGuideEntry = format.useGuideEntry;
+exports.usePageGuideEntry = format.usePageGuideEntry;
+exports.usePageGuides = format.usePageGuides;
+exports.useSectionGuideValues = format.useSectionGuideValues;
 exports.AccessDenied = AccessDenied;
 exports.ApiError = ApiError;
 exports.AppBreadcrumb = AppBreadcrumb;