@rytass/bpm-core-react 0.2.0 → 0.3.1

package/README.md

@@ -6,7 +6,7 @@ This package composes [`@mezzanine-ui/react`](https://www.npmjs.com/package/@mez
 
 ## Status
 
-`0.2.0` — early POC release. Only the login chain is built out (`/views/login`, `/pages/login`, providers). The remaining 17 views (inbox, instances, templates, forms, admin, settings, delegations) are planned for subsequent 0.2.x point releases.
+`0.3.0` — full admin surface: 12 view subpaths, 19 Next.js page shims (`pages/<feature>`), the `next` subpath (`BPMNextProviders`), and the foundation root barrel.
 
 ## Install
 
@@ -16,6 +16,18 @@ pnpm add @rytass/bpm-core-react @rytass/bpm-core-client @rytass/bpm-core-shared
 
 Peer requirements: React 18+, Mezzanine UI 1.1+. Next.js is required only when consuming the `pages/*` subpath; framework-agnostic consumers can use `views/*` directly with their own router adapter.
 
+### Next.js + pnpm setup
+
+If your host uses Next.js (15+) with pnpm strict mode, add the package to `transpilePackages` in `next.config.js`. Without this, Next's Turbopack cannot resolve transitive peer-dep imports such as `@rytass/bpm-core-client/workflow` from inside pnpm-isolated `node_modules/.pnpm/...` paths.
+
+```js
+/** @type {import('next').NextConfig} */
+module.exports = {
+  reactStrictMode: true,
+  transpilePackages: ['@rytass/bpm-core-react'],
+};
+```
+
 ## Usage
 
 ### Drop-in Next.js page

package/dist/chunks/app-navigation-C_mbz7jx.cjs

@@ -0,0 +1,2 @@
+"use client";require('../app-navigation.css');var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));const c=require("./auth-provider-BV8Iiwfb.cjs");let l=require("react"),u=require("@mezzanine-ui/react"),d=require("@rytass/bpm-core-client"),f=require("react/jsx-runtime"),p=require("@rytass/bpm-core-client/workflow"),m=require("@mezzanine-ui/icons");var h=(0,l.createContext)(null);function g({children:e}){let[t,n]=(0,l.useState)(!1),r=(0,l.useCallback)(()=>{n(!0)},[]),i=(0,l.useCallback)(()=>{n(!1)},[]),a=(0,l.useCallback)(()=>{n(e=>!e)},[]),o=(0,l.useMemo)(()=>({close:i,isOpen:t,open:r,toggle:a}),[i,t,r,a]);return(0,f.jsx)(h.Provider,{value:o,children:e})}function _(){return(0,l.useContext)(h)||{close:()=>void 0,isOpen:!1,open:()=>void 0,toggle:()=>void 0}}var v=(0,l.createContext)(null);function y({children:e}){let{member:t}=c.n(),n=t?.memberId??null,[r,i]=(0,l.useState)(0),a=(0,l.useCallback)(async()=>{if(!n)return i(0),0;let e=await(0,p.readUnreadNotificationCount)(n);return i(e),e},[n]);(0,l.useEffect)(()=>{let e=!0;return(async()=>{try{let t=await a();e&&i(t)}catch{e&&i(0)}})(),()=>{e=!1}},[a]);let o=(0,l.useMemo)(()=>({refreshUnreadCount:a,unreadCount:r}),[a,r]);return(0,f.jsx)(v.Provider,{value:o,children:e})}function b(){return(0,l.useContext)(v)||{refreshUnreadCount:async()=>0,unreadCount:0}}var x={logo:`bpm_logo_QvBLU`,notificationBell:`bpm_notificationBell_W-wl7`,notificationBadge:`bpm_notificationBadge_Gy3Eq`},S=[{title:`我的工作`,items:[{href:`/dashboard`,icon:m.HomeIcon,label:`工作台`},{href:`/inbox`,icon:m.MailUnreadIcon,label:`我的待簽`},{href:`/sent`,icon:m.MailIcon,label:`我發起的`},{href:`/cc`,icon:m.ShareIcon,label:`抄送給我`}]},{title:`查詢與代理`,items:[{href:`/search`,icon:m.SearchIcon,label:`搜尋`},{href:`/delegations`,icon:m.SwitchHorizontalIcon,label:`個人代理`}]},{title:`簽核設計`,items:[{href:`/templates`,icon:m.FolderIcon,label:`簽核模板`,requiresAdmin:!0},{href:`/templates/categories`,icon:m.ListIcon,label:`模板分類`,requiresAdmin:!0},{href:`/forms`,icon:m.FileIcon,label:`表單設計`,requiresAdmin:!0}]},{title:`系統管理`,items:[{href:`/admin/orgs`,icon:m.SystemIcon,label:`組織管理`,requiresAdmin:!0},{href:`/admin/users`,icon:m.UserIcon,label:`會員對照`,requiresAdmin:!0},{href:`/admin/delegations`,icon:m.ShareIcon,label:`代理設定`,requiresAdmin:!0}]}];function C({activeHref:e,logoSrc:t=`/rytass-logo.png`,title:n=`BPM Admin`,groups:r=S,children:i}){let a=c.a(),{member:o}=c.n(),{unreadCount:s}=b(),l=e??a.pathname??``,p=w(o),h=r.map(e=>({title:e.title,items:e.items.filter(e=>!e.requiresAdmin||p)})).filter(e=>e.items.length>0),g=async()=>{await(0,d.logoutApi)(),a.replace(`/login`)};return(0,f.jsxs)(u.Layout,{children:[(0,f.jsx)(u.Navigation,{exactActivatedMatch:!0,children:[(0,f.jsx)(u.NavigationHeader,{title:n,children:(0,f.jsx)(`img`,{alt:``,className:x.logo,height:24,src:t,width:24})},`header`),...h.map(e=>(0,f.jsx)(u.NavigationOptionCategory,{title:e.title,children:e.items.map(e=>(0,f.jsx)(u.NavigationOption,{active:e.href===l,href:e.href,icon:e.icon,title:e.label},e.href))},e.title)),(0,f.jsxs)(u.NavigationFooter,{children:[(0,f.jsx)(u.NavigationUserMenu,{options:[{id:`notification-settings`,name:`通知設定`},{id:`logout`,name:`登出`}],onSelect:e=>{if(e.id===`notification-settings`){a.push(`/settings/notifications`);return}e.id===`logout`&&g()},children:(0,f.jsx)(E,{})}),(0,f.jsx)(T,{unreadCount:s}),(0,f.jsx)(u.NavigationIconButton,{"aria-label":`登出`,icon:m.LogoutIcon,onClick:()=>{g()},title:`登出`,type:`button`})]},`footer`)]}),(0,f.jsx)(u.Layout.Main,{children:i})]})}function w(e){return e?(e.roles??[]).includes(`BPM_ADMIN`)||(e.permissions??[]).some(e=>[`bpm:*`,`bpm:admin`,`bpm.admin`,`bpm:admin:*`].includes(e)):!1}function T({unreadCount:e}){let{open:t}=_();return(0,f.jsxs)(`span`,{className:x.notificationBell,children:[(0,f.jsx)(u.NavigationIconButton,{"aria-label":e>0?`通知中心，${e} 則未讀`:`通知中心`,icon:m.NotificationUnreadIcon,onClick:()=>{t()},title:`通知中心`,type:`button`}),e>0?(0,f.jsx)(`span`,{className:x.notificationBadge,children:e>99?`99+`:e}):null]})}function E(){let{member:e}=c.n();return e?(0,f.jsx)(f.Fragment,{children:e.name}):null}Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return C}});
+//# sourceMappingURL=app-navigation-C_mbz7jx.cjs.map

package/dist/chunks/app-navigation-C_mbz7jx.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-navigation-C_mbz7jx.cjs","names":[],"sources":["../../src/lib/notification-drawer-provider.tsx","../../src/lib/notification-unread-provider.tsx","../../src/components/app-navigation.module.scss","../../src/components/app-navigation.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\n\ninterface NotificationDrawerContextValue {\n  readonly close: () => void;\n  readonly isOpen: boolean;\n  readonly open: () => void;\n  readonly toggle: () => void;\n}\n\nconst NotificationDrawerContext =\n  createContext<NotificationDrawerContextValue | null>(null);\n\ninterface NotificationDrawerProviderProps {\n  readonly children: ReactNode;\n}\n\n/**\n * Controls the open/closed state of the BPM notification drawer. Wraps\n * children with a context that `<NotificationDrawer />` reads to mount /\n * hide itself, and that `<AppLayout />` reads to open the drawer when\n * the bell icon is clicked.\n *\n * When used outside this provider, the returned hook is a safe no-op so\n * components don't crash in test or storybook environments.\n */\nexport function NotificationDrawerProvider({\n  children,\n}: NotificationDrawerProviderProps): ReactElement {\n  const [isOpen, setIsOpen] = useState(false);\n\n  const open = useCallback((): void => {\n    setIsOpen(true);\n  }, []);\n  const close = useCallback((): void => {\n    setIsOpen(false);\n  }, []);\n  const toggle = useCallback((): void => {\n    setIsOpen((current) => !current);\n  }, []);\n\n  const value = useMemo<NotificationDrawerContextValue>(\n    () => ({ close, isOpen, open, toggle }),\n    [close, isOpen, open, toggle],\n  );\n\n  return (\n    <NotificationDrawerContext.Provider value={value}>\n      {children}\n    </NotificationDrawerContext.Provider>\n  );\n}\n\n/**\n * Read the BPM notification drawer's open state and control helpers.\n * Returns a no-op stub when used outside `<NotificationDrawerProvider>`.\n */\nexport function useNotificationDrawer(): NotificationDrawerContextValue {\n  const context = useContext(NotificationDrawerContext);\n  if (!context) {\n    return {\n      close: (): void => undefined,\n      isOpen: false,\n      open: (): void => undefined,\n      toggle: (): void => undefined,\n    };\n  }\n  return context;\n}\n","'use client';\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { readUnreadNotificationCount } from '@rytass/bpm-core-client/workflow';\nimport { useAuth } from './auth-provider';\n\ninterface NotificationUnreadContextValue {\n  readonly refreshUnreadCount: () => Promise<number>;\n  readonly unreadCount: number;\n}\n\nconst NotificationUnreadContext =\n  createContext<NotificationUnreadContextValue | null>(null);\n\ninterface NotificationUnreadProviderProps {\n  readonly children: ReactNode;\n}\n\n/**\n * Polls BPM for the current member's unread notification count via\n * `readUnreadNotificationCount` and exposes it through context for\n * `<AppLayout />` (bell badge) and `<NotificationDrawer />` (header\n * count). Refresh is triggered on mount and whenever the auth member id\n * changes; consumers can call `refreshUnreadCount()` after acknowledging\n * a notification.\n */\nexport function NotificationUnreadProvider({\n  children,\n}: NotificationUnreadProviderProps): ReactElement {\n  const { member } = useAuth();\n  const currentMemberId = member?.memberId ?? null;\n  const [unreadCount, setUnreadCount] = useState(0);\n\n  const refreshUnreadCount = useCallback(async (): Promise<number> => {\n    if (!currentMemberId) {\n      setUnreadCount(0);\n      return 0;\n    }\n    const next = await readUnreadNotificationCount(currentMemberId);\n    setUnreadCount(next);\n    return next;\n  }, [currentMemberId]);\n\n  useEffect((): (() => void) => {\n    let active = true;\n    void (async () => {\n      try {\n        const next = await refreshUnreadCount();\n        if (active) setUnreadCount(next);\n      } catch {\n        if (active) setUnreadCount(0);\n      }\n    })();\n    return (): void => {\n      active = false;\n    };\n  }, [refreshUnreadCount]);\n\n  const value = useMemo<NotificationUnreadContextValue>(\n    () => ({ refreshUnreadCount, unreadCount }),\n    [refreshUnreadCount, unreadCount],\n  );\n\n  return (\n    <NotificationUnreadContext.Provider value={value}>\n      {children}\n    </NotificationUnreadContext.Provider>\n  );\n}\n\n/**\n * Read the current unread-notification count and a manual refresh helper.\n * Returns a zero/no-op stub when used outside\n * `<NotificationUnreadProvider>`.\n */\nexport function useNotificationUnread(): NotificationUnreadContextValue {\n  const context = useContext(NotificationUnreadContext);\n  if (!context) {\n    return {\n      refreshUnreadCount: async (): Promise<number> => 0,\n      unreadCount: 0,\n    };\n  }\n  return context;\n}\n",".logo {\n  display: block;\n  height: 24px;\n  margin: auto;\n  object-fit: contain;\n  width: 24px;\n}\n\n.notificationBell {\n  display: inline-flex;\n  position: relative;\n}\n\n.notificationBadge {\n  align-items: center;\n  background: #d92d20;\n  border: 1px solid #fff;\n  border-radius: 999px;\n  color: #fff;\n  display: inline-flex;\n  font-size: 10px;\n  font-weight: 600;\n  height: 16px;\n  justify-content: center;\n  line-height: 1;\n  min-width: 16px;\n  padding: 0 4px;\n  pointer-events: none;\n  position: absolute;\n  right: -4px;\n  top: -4px;\n}\n","'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport {\n  Layout,\n  Navigation,\n  NavigationFooter,\n  NavigationHeader,\n  NavigationIconButton,\n  NavigationOption,\n  NavigationOptionCategory,\n  NavigationUserMenu,\n} from '@mezzanine-ui/react';\nimport {\n  FileIcon,\n  FolderIcon,\n  HomeIcon,\n  ListIcon,\n  LogoutIcon,\n  MailIcon,\n  MailUnreadIcon,\n  NotificationUnreadIcon,\n  SearchIcon,\n  ShareIcon,\n  SystemIcon,\n  SwitchHorizontalIcon,\n  UserIcon,\n  type IconDefinition,\n} from '@mezzanine-ui/icons';\nimport { logoutApi } from '@rytass/bpm-core-client';\nimport { useAuth } from '../lib/auth-provider';\nimport { useRouterAdapter } from '../lib/router-adapter';\nimport { useNotificationDrawer } from '../lib/notification-drawer-provider';\nimport { useNotificationUnread } from '../lib/notification-unread-provider';\nimport styles from './app-navigation.module.scss';\n\ninterface NavigationItem {\n  readonly href: string;\n  readonly icon: IconDefinition;\n  readonly label: string;\n  readonly requiresAdmin?: boolean;\n}\n\nexport interface AppNavigationGroup {\n  readonly title: string;\n  readonly items: readonly NavigationItem[];\n}\n\nconst DEFAULT_NAVIGATION_GROUPS: readonly AppNavigationGroup[] = [\n  {\n    title: '我的工作',\n    items: [\n      { href: '/dashboard', icon: HomeIcon, label: '工作台' },\n      { href: '/inbox', icon: MailUnreadIcon, label: '我的待簽' },\n      { href: '/sent', icon: MailIcon, label: '我發起的' },\n      { href: '/cc', icon: ShareIcon, label: '抄送給我' },\n    ],\n  },\n  {\n    title: '查詢與代理',\n    items: [\n      { href: '/search', icon: SearchIcon, label: '搜尋' },\n      { href: '/delegations', icon: SwitchHorizontalIcon, label: '個人代理' },\n    ],\n  },\n  {\n    title: '簽核設計',\n    items: [\n      { href: '/templates', icon: FolderIcon, label: '簽核模板', requiresAdmin: true },\n      { href: '/templates/categories', icon: ListIcon, label: '模板分類', requiresAdmin: true },\n      { href: '/forms', icon: FileIcon, label: '表單設計', requiresAdmin: true },\n    ],\n  },\n  {\n    title: '系統管理',\n    items: [\n      { href: '/admin/orgs', icon: SystemIcon, label: '組織管理', requiresAdmin: true },\n      { href: '/admin/users', icon: UserIcon, label: '會員對照', requiresAdmin: true },\n      { href: '/admin/delegations', icon: ShareIcon, label: '代理設定', requiresAdmin: true },\n    ],\n  },\n];\n\nexport interface AppLayoutProps {\n  /** Override the active href detection (defaults to router's pathname). */\n  readonly activeHref?: string;\n  /** Logo image URL displayed in the sidebar header. */\n  readonly logoSrc?: string;\n  /** Sidebar title (defaults to \"BPM Admin\"). */\n  readonly title?: string;\n  /**\n   * Override the entire navigation tree. When omitted, the default 4-group\n   * BPM admin nav (`我的工作` / `查詢與代理` / `簽核設計` / `系統管理`) is used.\n   */\n  readonly groups?: readonly AppNavigationGroup[];\n  /** Page content rendered inside the Mezzanine `<Layout.Main>` slot. */\n  readonly children?: ReactNode;\n}\n\n/**\n * BPM admin layout shell — composes Mezzanine `<Layout>` + `<Navigation>`\n * with the default 4-group BPM tree, and exposes a `children` prop that\n * fills the `<Layout.Main>` slot.\n *\n * Why a single component instead of a `<Navigation>` wrapper: Mezzanine\n * `<Layout>` discovers its slot children by component-identity match\n * (`child.type === Navigation` / `LayoutMain` / etc.). Any custom wrapper\n * around `<Navigation>` is silently dropped, so the sidebar disappears.\n * Keeping the `<Navigation>` element as a direct child of `<Layout>` here\n * is mandatory for the slot to register.\n */\nexport function AppLayout({\n  activeHref,\n  logoSrc = '/rytass-logo.png',\n  title = 'BPM Admin',\n  groups = DEFAULT_NAVIGATION_GROUPS,\n  children,\n}: AppLayoutProps): ReactElement {\n  const router = useRouterAdapter();\n  const { member } = useAuth();\n  const { unreadCount } = useNotificationUnread();\n  const resolvedActive = activeHref ?? router.pathname ?? '';\n  const isAdmin = isAdminMember(member);\n  const visibleGroups = groups\n    .map((group) => ({\n      title: group.title,\n      items: group.items.filter((item) => !item.requiresAdmin || isAdmin),\n    }))\n    .filter((group) => group.items.length > 0);\n\n  const handleLogout = async (): Promise<void> => {\n    await logoutApi();\n    router.replace('/login');\n  };\n\n  const navigationChildren = [\n    <NavigationHeader key=\"header\" title={title}>\n      <img alt=\"\" className={styles.logo} height={24} src={logoSrc} width={24} />\n    </NavigationHeader>,\n    ...visibleGroups.map((group) => (\n      <NavigationOptionCategory key={group.title} title={group.title}>\n        {group.items.map((item) => (\n          <NavigationOption\n            active={item.href === resolvedActive}\n            href={item.href}\n            icon={item.icon}\n            key={item.href}\n            title={item.label}\n          />\n        ))}\n      </NavigationOptionCategory>\n    )),\n    <NavigationFooter key=\"footer\">\n      <NavigationUserMenu\n        options={[\n          { id: 'notification-settings', name: '通知設定' },\n          { id: 'logout', name: '登出' },\n        ]}\n        onSelect={(option): void => {\n          if (option.id === 'notification-settings') {\n            router.push('/settings/notifications');\n            return;\n          }\n          if (option.id === 'logout') {\n            void handleLogout();\n          }\n        }}\n      >\n        <NavigationMemberName />\n      </NavigationUserMenu>\n      <NotificationBell unreadCount={unreadCount} />\n      <NavigationIconButton\n        aria-label=\"登出\"\n        icon={LogoutIcon}\n        onClick={(): void => {\n          void handleLogout();\n        }}\n        title=\"登出\"\n        type=\"button\"\n      />\n    </NavigationFooter>,\n  ];\n\n  return (\n    <Layout>\n      <Navigation exactActivatedMatch>{navigationChildren}</Navigation>\n      <Layout.Main>{children}</Layout.Main>\n    </Layout>\n  );\n}\n\nfunction isAdminMember(member: ReturnType<typeof useAuth>['member']): boolean {\n  if (!member) return false;\n  return (\n    (member.roles ?? []).includes('BPM_ADMIN') ||\n    (member.permissions ?? []).some((p) =>\n      ['bpm:*', 'bpm:admin', 'bpm.admin', 'bpm:admin:*'].includes(p),\n    )\n  );\n}\n\nfunction NotificationBell({\n  unreadCount,\n}: {\n  readonly unreadCount: number;\n}): ReactElement {\n  const { open } = useNotificationDrawer();\n  return (\n    <span className={styles.notificationBell}>\n      <NavigationIconButton\n        aria-label={unreadCount > 0 ? `通知中心，${unreadCount} 則未讀` : '通知中心'}\n        icon={NotificationUnreadIcon}\n        onClick={(): void => {\n          open();\n        }}\n        title=\"通知中心\"\n        type=\"button\"\n      />\n      {unreadCount > 0 ? (\n        <span className={styles.notificationBadge}>\n          {unreadCount > 99 ? '99+' : unreadCount}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n\nfunction NavigationMemberName(): ReactElement | null {\n  const { member } = useAuth();\n  if (!member) return null;\n  return <>{member.name}</>;\n}\n"],"mappings":"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"}

package/dist/chunks/{app-navigation-CATITRM7.js → app-navigation-uwbNEw9P.js}

@@ -1,15 +1,14 @@
 "use client";
-import { r as e } from "./router-adapter-BdHZXLS3.js";
-import { n as t } from "./auth-provider-TTO9eNZV.js";
+import { a as e, n as t } from "./auth-provider-Bnox5gsx.js";
 import { createContext as n, useCallback as r, useContext as i, useEffect as a, useMemo as o, useState as s } from "react";
-import { Navigation as c, NavigationFooter as l, NavigationHeader as u, NavigationIconButton as d, NavigationOption as f, NavigationOptionCategory as p, NavigationUserMenu as m } from "@mezzanine-ui/react";
-import { logoutApi as h } from "@rytass/bpm-core-client";
-import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
-import { readUnreadNotificationCount as y } from "@rytass/bpm-core-client/workflow";
-import { FileIcon as b, FolderIcon as x, HomeIcon as S, ListIcon as C, LogoutIcon as w, MailIcon as T, MailUnreadIcon as E, NotificationUnreadIcon as D, SearchIcon as O, ShareIcon as k, SwitchHorizontalIcon as A, SystemIcon as j, UserIcon as M } from "@mezzanine-ui/icons";
+import { Layout as c, Navigation as l, NavigationFooter as u, NavigationHeader as d, NavigationIconButton as f, NavigationOption as p, NavigationOptionCategory as m, NavigationUserMenu as h } from "@mezzanine-ui/react";
+import { logoutApi as g } from "@rytass/bpm-core-client";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { readUnreadNotificationCount as b } from "@rytass/bpm-core-client/workflow";
+import { FileIcon as x, FolderIcon as S, HomeIcon as C, ListIcon as w, LogoutIcon as T, MailIcon as E, MailUnreadIcon as D, NotificationUnreadIcon as O, SearchIcon as k, ShareIcon as A, SwitchHorizontalIcon as j, SystemIcon as M, UserIcon as N } from "@mezzanine-ui/icons";
 import '../app-navigation.css';//#region src/lib/notification-drawer-provider.tsx
-var N = n(null);
-function P({ children: e }) {
+var P = n(null);
+function F({ children: e }) {
 	let [t, n] = s(!1), i = r(() => {
 		n(!0);
 	}, []), a = r(() => {
@@ -27,13 +26,13 @@ function P({ children: e }) {
 		i,
 		c
 	]);
-	return /* @__PURE__ */ _(N.Provider, {
+	return /* @__PURE__ */ v(P.Provider, {
 		value: l,
 		children: e
 	});
 }
-function F() {
-	return i(N) || {
+function I() {
+	return i(P) || {
 		close: () => void 0,
 		isOpen: !1,
 		open: () => void 0,
@@ -42,11 +41,11 @@ function F() {
 }
 //#endregion
 //#region src/lib/notification-unread-provider.tsx
-var I = n(null);
-function L({ children: e }) {
+var L = n(null);
+function R({ children: e }) {
 	let { member: n } = t(), i = n?.memberId ?? null, [c, l] = s(0), u = r(async () => {
 		if (!i) return l(0), 0;
-		let e = await y(i);
+		let e = await b(i);
 		return l(e), e;
 	}, [i]);
 	a(() => {
@@ -66,43 +65,43 @@ function L({ children: e }) {
 		refreshUnreadCount: u,
 		unreadCount: c
 	}), [u, c]);
-	return /* @__PURE__ */ _(I.Provider, {
+	return /* @__PURE__ */ v(L.Provider, {
 		value: d,
 		children: e
 	});
 }
-function R() {
-	return i(I) || {
+function z() {
+	return i(L) || {
 		refreshUnreadCount: async () => 0,
 		unreadCount: 0
 	};
 }
-var z = {
+var B = {
 	logo: "bpm_logo_QvBLU",
 	notificationBell: "bpm_notificationBell_W-wl7",
 	notificationBadge: "bpm_notificationBadge_Gy3Eq"
-}, B = [
+}, V = [
 	{
 		title: "我的工作",
 		items: [
 			{
 				href: "/dashboard",
-				icon: S,
+				icon: C,
 				label: "工作台"
 			},
 			{
 				href: "/inbox",
-				icon: E,
+				icon: D,
 				label: "我的待簽"
 			},
 			{
 				href: "/sent",
-				icon: T,
+				icon: E,
 				label: "我發起的"
 			},
 			{
 				href: "/cc",
-				icon: k,
+				icon: A,
 				label: "抄送給我"
 			}
 		]
@@ -111,11 +110,11 @@ var z = {
 		title: "查詢與代理",
 		items: [{
 			href: "/search",
-			icon: O,
+			icon: k,
 			label: "搜尋"
 		}, {
 			href: "/delegations",
-			icon: A,
+			icon: j,
 			label: "個人代理"
 		}]
 	},
@@ -124,19 +123,19 @@ var z = {
 		items: [
 			{
 				href: "/templates",
-				icon: x,
+				icon: S,
 				label: "簽核模板",
 				requiresAdmin: !0
 			},
 			{
 				href: "/templates/categories",
-				icon: C,
+				icon: w,
 				label: "模板分類",
 				requiresAdmin: !0
 			},
 			{
 				href: "/forms",
-				icon: b,
+				icon: x,
 				label: "表單設計",
 				requiresAdmin: !0
 			}
@@ -147,56 +146,56 @@ var z = {
 		items: [
 			{
 				href: "/admin/orgs",
-				icon: j,
+				icon: M,
 				label: "組織管理",
 				requiresAdmin: !0
 			},
 			{
 				href: "/admin/users",
-				icon: M,
+				icon: N,
 				label: "會員對照",
 				requiresAdmin: !0
 			},
 			{
 				href: "/admin/delegations",
-				icon: k,
+				icon: A,
 				label: "代理設定",
 				requiresAdmin: !0
 			}
 		]
 	}
 ];
-function V({ activeHref: n, logoSrc: r = "/rytass-logo.png", title: i = "BPM Admin", groups: a = B } = {}) {
-	let o = e(), { member: s } = t(), { unreadCount: g } = R(), y = n ?? o.pathname ?? "", b = H(s), x = a.map((e) => ({
+function H({ activeHref: n, logoSrc: r = "/rytass-logo.png", title: i = "BPM Admin", groups: a = V, children: o }) {
+	let s = e(), { member: _ } = t(), { unreadCount: b } = z(), x = n ?? s.pathname ?? "", S = U(_), C = a.map((e) => ({
 		title: e.title,
-		items: e.items.filter((e) => !e.requiresAdmin || b)
-	})).filter((e) => e.items.length > 0), S = async () => {
-		await h(), o.replace("/login");
+		items: e.items.filter((e) => !e.requiresAdmin || S)
+	})).filter((e) => e.items.length > 0), w = async () => {
+		await g(), s.replace("/login");
 	};
-	return /* @__PURE__ */ _(c, {
+	return /* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, {
 		exactActivatedMatch: !0,
 		children: [
-			/* @__PURE__ */ _(u, {
+			/* @__PURE__ */ v(d, {
 				title: i,
-				children: /* @__PURE__ */ _("img", {
+				children: /* @__PURE__ */ v("img", {
 					alt: "",
-					className: z.logo,
+					className: B.logo,
 					height: 24,
 					src: r,
 					width: 24
 				})
 			}, "header"),
-			...x.map((e) => /* @__PURE__ */ _(p, {
+			...C.map((e) => /* @__PURE__ */ v(m, {
 				title: e.title,
-				children: e.items.map((e) => /* @__PURE__ */ _(f, {
-					active: e.href === y,
+				children: e.items.map((e) => /* @__PURE__ */ v(p, {
+					active: e.href === x,
 					href: e.href,
 					icon: e.icon,
 					title: e.label
 				}, e.href))
 			}, e.title)),
-			/* @__PURE__ */ v(l, { children: [
-				/* @__PURE__ */ _(m, {
+			/* @__PURE__ */ y(u, { children: [
+				/* @__PURE__ */ v(h, {
 					options: [{
 						id: "notification-settings",
 						name: "通知設定"
@@ -206,28 +205,28 @@ function V({ activeHref: n, logoSrc: r = "/rytass-logo.png", title: i = "BPM Adm
 					}],
 					onSelect: (e) => {
 						if (e.id === "notification-settings") {
-							o.push("/settings/notifications");
+							s.push("/settings/notifications");
 							return;
 						}
-						e.id === "logout" && S();
+						e.id === "logout" && w();
 					},
-					children: /* @__PURE__ */ _(W, {})
+					children: /* @__PURE__ */ v(G, {})
 				}),
-				/* @__PURE__ */ _(U, { unreadCount: g }),
-				/* @__PURE__ */ _(d, {
+				/* @__PURE__ */ v(W, { unreadCount: b }),
+				/* @__PURE__ */ v(f, {
 					"aria-label": "登出",
-					icon: w,
+					icon: T,
 					onClick: () => {
-						S();
+						w();
 					},
 					title: "登出",
 					type: "button"
 				})
 			] }, "footer")
 		]
-	});
+	}), /* @__PURE__ */ v(c.Main, { children: o })] });
 }
-function H(e) {
+function U(e) {
 	return e ? (e.roles ?? []).includes("BPM_ADMIN") || (e.permissions ?? []).some((e) => [
 		"bpm:*",
 		"bpm:admin",
@@ -235,29 +234,29 @@ function H(e) {
 		"bpm:admin:*"
 	].includes(e)) : !1;
 }
-function U({ unreadCount: e }) {
-	let { open: t } = F();
-	return /* @__PURE__ */ v("span", {
-		className: z.notificationBell,
-		children: [/* @__PURE__ */ _(d, {
+function W({ unreadCount: e }) {
+	let { open: t } = I();
+	return /* @__PURE__ */ y("span", {
+		className: B.notificationBell,
+		children: [/* @__PURE__ */ v(f, {
 			"aria-label": e > 0 ? `通知中心，${e} 則未讀` : "通知中心",
-			icon: D,
+			icon: O,
 			onClick: () => {
 				t();
 			},
 			title: "通知中心",
 			type: "button"
-		}), e > 0 ? /* @__PURE__ */ _("span", {
-			className: z.notificationBadge,
+		}), e > 0 ? /* @__PURE__ */ v("span", {
+			className: B.notificationBadge,
 			children: e > 99 ? "99+" : e
 		}) : null]
 	});
 }
-function W() {
+function G() {
 	let { member: e } = t();
-	return e ? /* @__PURE__ */ _(g, { children: e.name }) : null;
+	return e ? /* @__PURE__ */ v(_, { children: e.name }) : null;
 }
 //#endregion
-export { F as a, P as i, L as n, R as r, V as t };
+export { I as a, F as i, R as n, z as r, H as t };
 
-//# sourceMappingURL=app-navigation-CATITRM7.js.map
+//# sourceMappingURL=app-navigation-uwbNEw9P.js.map

package/dist/chunks/app-navigation-uwbNEw9P.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-navigation-uwbNEw9P.js","names":[],"sources":["../../src/lib/notification-drawer-provider.tsx","../../src/lib/notification-unread-provider.tsx","../../src/components/app-navigation.module.scss","../../src/components/app-navigation.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\n\ninterface NotificationDrawerContextValue {\n  readonly close: () => void;\n  readonly isOpen: boolean;\n  readonly open: () => void;\n  readonly toggle: () => void;\n}\n\nconst NotificationDrawerContext =\n  createContext<NotificationDrawerContextValue | null>(null);\n\ninterface NotificationDrawerProviderProps {\n  readonly children: ReactNode;\n}\n\n/**\n * Controls the open/closed state of the BPM notification drawer. Wraps\n * children with a context that `<NotificationDrawer />` reads to mount /\n * hide itself, and that `<AppLayout />` reads to open the drawer when\n * the bell icon is clicked.\n *\n * When used outside this provider, the returned hook is a safe no-op so\n * components don't crash in test or storybook environments.\n */\nexport function NotificationDrawerProvider({\n  children,\n}: NotificationDrawerProviderProps): ReactElement {\n  const [isOpen, setIsOpen] = useState(false);\n\n  const open = useCallback((): void => {\n    setIsOpen(true);\n  }, []);\n  const close = useCallback((): void => {\n    setIsOpen(false);\n  }, []);\n  const toggle = useCallback((): void => {\n    setIsOpen((current) => !current);\n  }, []);\n\n  const value = useMemo<NotificationDrawerContextValue>(\n    () => ({ close, isOpen, open, toggle }),\n    [close, isOpen, open, toggle],\n  );\n\n  return (\n    <NotificationDrawerContext.Provider value={value}>\n      {children}\n    </NotificationDrawerContext.Provider>\n  );\n}\n\n/**\n * Read the BPM notification drawer's open state and control helpers.\n * Returns a no-op stub when used outside `<NotificationDrawerProvider>`.\n */\nexport function useNotificationDrawer(): NotificationDrawerContextValue {\n  const context = useContext(NotificationDrawerContext);\n  if (!context) {\n    return {\n      close: (): void => undefined,\n      isOpen: false,\n      open: (): void => undefined,\n      toggle: (): void => undefined,\n    };\n  }\n  return context;\n}\n","'use client';\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { readUnreadNotificationCount } from '@rytass/bpm-core-client/workflow';\nimport { useAuth } from './auth-provider';\n\ninterface NotificationUnreadContextValue {\n  readonly refreshUnreadCount: () => Promise<number>;\n  readonly unreadCount: number;\n}\n\nconst NotificationUnreadContext =\n  createContext<NotificationUnreadContextValue | null>(null);\n\ninterface NotificationUnreadProviderProps {\n  readonly children: ReactNode;\n}\n\n/**\n * Polls BPM for the current member's unread notification count via\n * `readUnreadNotificationCount` and exposes it through context for\n * `<AppLayout />` (bell badge) and `<NotificationDrawer />` (header\n * count). Refresh is triggered on mount and whenever the auth member id\n * changes; consumers can call `refreshUnreadCount()` after acknowledging\n * a notification.\n */\nexport function NotificationUnreadProvider({\n  children,\n}: NotificationUnreadProviderProps): ReactElement {\n  const { member } = useAuth();\n  const currentMemberId = member?.memberId ?? null;\n  const [unreadCount, setUnreadCount] = useState(0);\n\n  const refreshUnreadCount = useCallback(async (): Promise<number> => {\n    if (!currentMemberId) {\n      setUnreadCount(0);\n      return 0;\n    }\n    const next = await readUnreadNotificationCount(currentMemberId);\n    setUnreadCount(next);\n    return next;\n  }, [currentMemberId]);\n\n  useEffect((): (() => void) => {\n    let active = true;\n    void (async () => {\n      try {\n        const next = await refreshUnreadCount();\n        if (active) setUnreadCount(next);\n      } catch {\n        if (active) setUnreadCount(0);\n      }\n    })();\n    return (): void => {\n      active = false;\n    };\n  }, [refreshUnreadCount]);\n\n  const value = useMemo<NotificationUnreadContextValue>(\n    () => ({ refreshUnreadCount, unreadCount }),\n    [refreshUnreadCount, unreadCount],\n  );\n\n  return (\n    <NotificationUnreadContext.Provider value={value}>\n      {children}\n    </NotificationUnreadContext.Provider>\n  );\n}\n\n/**\n * Read the current unread-notification count and a manual refresh helper.\n * Returns a zero/no-op stub when used outside\n * `<NotificationUnreadProvider>`.\n */\nexport function useNotificationUnread(): NotificationUnreadContextValue {\n  const context = useContext(NotificationUnreadContext);\n  if (!context) {\n    return {\n      refreshUnreadCount: async (): Promise<number> => 0,\n      unreadCount: 0,\n    };\n  }\n  return context;\n}\n",".logo {\n  display: block;\n  height: 24px;\n  margin: auto;\n  object-fit: contain;\n  width: 24px;\n}\n\n.notificationBell {\n  display: inline-flex;\n  position: relative;\n}\n\n.notificationBadge {\n  align-items: center;\n  background: #d92d20;\n  border: 1px solid #fff;\n  border-radius: 999px;\n  color: #fff;\n  display: inline-flex;\n  font-size: 10px;\n  font-weight: 600;\n  height: 16px;\n  justify-content: center;\n  line-height: 1;\n  min-width: 16px;\n  padding: 0 4px;\n  pointer-events: none;\n  position: absolute;\n  right: -4px;\n  top: -4px;\n}\n","'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport {\n  Layout,\n  Navigation,\n  NavigationFooter,\n  NavigationHeader,\n  NavigationIconButton,\n  NavigationOption,\n  NavigationOptionCategory,\n  NavigationUserMenu,\n} from '@mezzanine-ui/react';\nimport {\n  FileIcon,\n  FolderIcon,\n  HomeIcon,\n  ListIcon,\n  LogoutIcon,\n  MailIcon,\n  MailUnreadIcon,\n  NotificationUnreadIcon,\n  SearchIcon,\n  ShareIcon,\n  SystemIcon,\n  SwitchHorizontalIcon,\n  UserIcon,\n  type IconDefinition,\n} from '@mezzanine-ui/icons';\nimport { logoutApi } from '@rytass/bpm-core-client';\nimport { useAuth } from '../lib/auth-provider';\nimport { useRouterAdapter } from '../lib/router-adapter';\nimport { useNotificationDrawer } from '../lib/notification-drawer-provider';\nimport { useNotificationUnread } from '../lib/notification-unread-provider';\nimport styles from './app-navigation.module.scss';\n\ninterface NavigationItem {\n  readonly href: string;\n  readonly icon: IconDefinition;\n  readonly label: string;\n  readonly requiresAdmin?: boolean;\n}\n\nexport interface AppNavigationGroup {\n  readonly title: string;\n  readonly items: readonly NavigationItem[];\n}\n\nconst DEFAULT_NAVIGATION_GROUPS: readonly AppNavigationGroup[] = [\n  {\n    title: '我的工作',\n    items: [\n      { href: '/dashboard', icon: HomeIcon, label: '工作台' },\n      { href: '/inbox', icon: MailUnreadIcon, label: '我的待簽' },\n      { href: '/sent', icon: MailIcon, label: '我發起的' },\n      { href: '/cc', icon: ShareIcon, label: '抄送給我' },\n    ],\n  },\n  {\n    title: '查詢與代理',\n    items: [\n      { href: '/search', icon: SearchIcon, label: '搜尋' },\n      { href: '/delegations', icon: SwitchHorizontalIcon, label: '個人代理' },\n    ],\n  },\n  {\n    title: '簽核設計',\n    items: [\n      { href: '/templates', icon: FolderIcon, label: '簽核模板', requiresAdmin: true },\n      { href: '/templates/categories', icon: ListIcon, label: '模板分類', requiresAdmin: true },\n      { href: '/forms', icon: FileIcon, label: '表單設計', requiresAdmin: true },\n    ],\n  },\n  {\n    title: '系統管理',\n    items: [\n      { href: '/admin/orgs', icon: SystemIcon, label: '組織管理', requiresAdmin: true },\n      { href: '/admin/users', icon: UserIcon, label: '會員對照', requiresAdmin: true },\n      { href: '/admin/delegations', icon: ShareIcon, label: '代理設定', requiresAdmin: true },\n    ],\n  },\n];\n\nexport interface AppLayoutProps {\n  /** Override the active href detection (defaults to router's pathname). */\n  readonly activeHref?: string;\n  /** Logo image URL displayed in the sidebar header. */\n  readonly logoSrc?: string;\n  /** Sidebar title (defaults to \"BPM Admin\"). */\n  readonly title?: string;\n  /**\n   * Override the entire navigation tree. When omitted, the default 4-group\n   * BPM admin nav (`我的工作` / `查詢與代理` / `簽核設計` / `系統管理`) is used.\n   */\n  readonly groups?: readonly AppNavigationGroup[];\n  /** Page content rendered inside the Mezzanine `<Layout.Main>` slot. */\n  readonly children?: ReactNode;\n}\n\n/**\n * BPM admin layout shell — composes Mezzanine `<Layout>` + `<Navigation>`\n * with the default 4-group BPM tree, and exposes a `children` prop that\n * fills the `<Layout.Main>` slot.\n *\n * Why a single component instead of a `<Navigation>` wrapper: Mezzanine\n * `<Layout>` discovers its slot children by component-identity match\n * (`child.type === Navigation` / `LayoutMain` / etc.). Any custom wrapper\n * around `<Navigation>` is silently dropped, so the sidebar disappears.\n * Keeping the `<Navigation>` element as a direct child of `<Layout>` here\n * is mandatory for the slot to register.\n */\nexport function AppLayout({\n  activeHref,\n  logoSrc = '/rytass-logo.png',\n  title = 'BPM Admin',\n  groups = DEFAULT_NAVIGATION_GROUPS,\n  children,\n}: AppLayoutProps): ReactElement {\n  const router = useRouterAdapter();\n  const { member } = useAuth();\n  const { unreadCount } = useNotificationUnread();\n  const resolvedActive = activeHref ?? router.pathname ?? '';\n  const isAdmin = isAdminMember(member);\n  const visibleGroups = groups\n    .map((group) => ({\n      title: group.title,\n      items: group.items.filter((item) => !item.requiresAdmin || isAdmin),\n    }))\n    .filter((group) => group.items.length > 0);\n\n  const handleLogout = async (): Promise<void> => {\n    await logoutApi();\n    router.replace('/login');\n  };\n\n  const navigationChildren = [\n    <NavigationHeader key=\"header\" title={title}>\n      <img alt=\"\" className={styles.logo} height={24} src={logoSrc} width={24} />\n    </NavigationHeader>,\n    ...visibleGroups.map((group) => (\n      <NavigationOptionCategory key={group.title} title={group.title}>\n        {group.items.map((item) => (\n          <NavigationOption\n            active={item.href === resolvedActive}\n            href={item.href}\n            icon={item.icon}\n            key={item.href}\n            title={item.label}\n          />\n        ))}\n      </NavigationOptionCategory>\n    )),\n    <NavigationFooter key=\"footer\">\n      <NavigationUserMenu\n        options={[\n          { id: 'notification-settings', name: '通知設定' },\n          { id: 'logout', name: '登出' },\n        ]}\n        onSelect={(option): void => {\n          if (option.id === 'notification-settings') {\n            router.push('/settings/notifications');\n            return;\n          }\n          if (option.id === 'logout') {\n            void handleLogout();\n          }\n        }}\n      >\n        <NavigationMemberName />\n      </NavigationUserMenu>\n      <NotificationBell unreadCount={unreadCount} />\n      <NavigationIconButton\n        aria-label=\"登出\"\n        icon={LogoutIcon}\n        onClick={(): void => {\n          void handleLogout();\n        }}\n        title=\"登出\"\n        type=\"button\"\n      />\n    </NavigationFooter>,\n  ];\n\n  return (\n    <Layout>\n      <Navigation exactActivatedMatch>{navigationChildren}</Navigation>\n      <Layout.Main>{children}</Layout.Main>\n    </Layout>\n  );\n}\n\nfunction isAdminMember(member: ReturnType<typeof useAuth>['member']): boolean {\n  if (!member) return false;\n  return (\n    (member.roles ?? []).includes('BPM_ADMIN') ||\n    (member.permissions ?? []).some((p) =>\n      ['bpm:*', 'bpm:admin', 'bpm.admin', 'bpm:admin:*'].includes(p),\n    )\n  );\n}\n\nfunction NotificationBell({\n  unreadCount,\n}: {\n  readonly unreadCount: number;\n}): ReactElement {\n  const { open } = useNotificationDrawer();\n  return (\n    <span className={styles.notificationBell}>\n      <NavigationIconButton\n        aria-label={unreadCount > 0 ? `通知中心，${unreadCount} 則未讀` : '通知中心'}\n        icon={NotificationUnreadIcon}\n        onClick={(): void => {\n          open();\n        }}\n        title=\"通知中心\"\n        type=\"button\"\n      />\n      {unreadCount > 0 ? (\n        <span className={styles.notificationBadge}>\n          {unreadCount > 99 ? '99+' : unreadCount}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n\nfunction NavigationMemberName(): ReactElement | null {\n  const { member } = useAuth();\n  if (!member) return null;\n  return <>{member.name}</>;\n}\n"],"mappings":"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"}

package/dist/chunks/approval-instance-list-page-Mo6wpDPb.cjs

@@ -0,0 +1,2 @@
+"use client";require('../approval-instance-list-page.css');const e=require("./app-navigation-C_mbz7jx.cjs"),t=require("./auth-provider-BV8Iiwfb.cjs"),n=require("./format-date-time-isOa3e9q.cjs");let r=require("react"),i=require("@mezzanine-ui/react"),a=require("@rytass/bpm-core-client"),o=require("react/jsx-runtime"),s=require("@rytass/bpm-core-client/workflow"),c=require("@mezzanine-ui/react/ContentHeader");c=e.o(c,1);let l=require("@mezzanine-ui/core/form");var u={instanceFilterArea:`bpm_instanceFilterArea_qpvJq`},d=[10,20,50],f=[{id:`ALL`,name:`全部狀態`,state:null},{id:`RUNNING`,name:`進行中`,state:`RUNNING`},{id:`APPROVED`,name:`已通過`,state:`APPROVED`},{id:`REJECTED`,name:`已拒絕`,state:`REJECTED`},{id:`RETURNED`,name:`已退回`,state:`RETURNED`},{id:`CANCELLED`,name:`已取消`,state:`CANCELLED`},{id:`EXPIRED`,name:`已逾期`,state:`EXPIRED`},{id:`DRAFT`,name:`草稿`,state:`DRAFT`}];function p({activeHref:p,defaultState:v,description:y,emptyMessage:C,searchPlaceholder:w,title:T,view:E}){let D=t.a(),[O,k]=(0,r.useState)(null),[A,j]=(0,r.useState)(new Map),[M,N]=(0,r.useState)(1),[P,F]=(0,r.useState)(10),[I,L]=(0,r.useState)(0),[R,z]=(0,r.useState)(!0),[B,V]=(0,r.useState)([]),[H,U]=(0,r.useState)(``),[W,G]=(0,r.useState)(g(v)),K=(0,r.useCallback)(async()=>{z(!0),k(null);try{let e=await(0,s.listApprovalInstancesPage)({page:M,pageSize:P,searchText:H,state:W.state,templateId:null,view:E});V(e.instances.map(m)),L(e.totalCount)}catch(e){k(S(e))}finally{z(!1)}},[M,P,H,W,E]);(0,r.useEffect)(()=>{K()},[K]),(0,r.useEffect)(()=>{let e=Array.from(new Set(B.map(e=>e.initiatorMemberId).filter(Boolean)));if(e.length===0){j(new Map);return}let t=!1;return(async()=>{try{let n=await(0,a.resolveMembers)(e);if(t)return;j(new Map(n.map(e=>[e.memberId,e])))}catch{if(t)return;j(new Map)}})(),()=>{t=!0}},[B]);let q=(0,r.useMemo)(()=>[{dataIndex:`caseTitle`,key:`caseTitle`,title:`案件`,width:300},{key:`state`,render:e=>(0,o.jsx)(i.Typography,{color:b(e.state),component:`span`,variant:`body`,children:e.stateLabel}),title:`狀態`,width:120},{key:`initiatorMemberId`,render:e=>(0,o.jsx)(i.Typography,{component:`span`,variant:`body`,children:x(e.initiatorMemberId,A)}),title:`發起人`,width:180},{key:`startedAt`,render:e=>(0,o.jsx)(i.Typography,{component:`span`,variant:`body`,children:n.t(e.startedAt)}),title:`發起時間`,width:220},{key:`completedAt`,render:e=>(0,o.jsx)(i.Typography,{component:`span`,variant:`body`,children:n.t(e.completedAt)}),title:`完成時間`,width:220}],[A]),J=(0,r.useMemo)(()=>({render:e=>[{name:`查看`,onClick:()=>D.push(`/instances/${e.id}`)}],variant:`base-secondary`,width:88}),[D]);return(0,o.jsxs)(e.t,{activeHref:p,children:[(0,o.jsx)(i.PageHeader,{children:(0,o.jsx)(c.default,{description:y,title:T})}),(0,o.jsx)(i.SectionGroup,{children:(0,o.jsxs)(i.Section,{filterArea:(0,o.jsx)(i.FilterArea,{className:u.instanceFilterArea,size:`sub`,children:(0,o.jsxs)(i.FilterLine,{children:[(0,o.jsx)(i.Filter,{span:3,children:(0,o.jsx)(i.FormField,{fullWidth:!0,layout:l.FormFieldLayout.VERTICAL,name:`instanceSearchText`,children:(0,o.jsx)(i.Input,{fullWidth:!0,onChange:e=>{U(e.target.value),N(1)},placeholder:w,size:`sub`,value:H,variant:`base`})})}),(0,o.jsx)(i.Filter,{span:2,children:(0,o.jsx)(i.FormField,{fullWidth:!0,layout:l.FormFieldLayout.VERTICAL,name:`instanceState`,children:(0,o.jsx)(i.Select,{clearable:!1,fullWidth:!0,onChange:e=>{G(h(e)),N(1)},options:[...f],placeholder:`狀態`,renderValue:e=>`狀態：${_(e)}`,size:`sub`,value:W})})})]})}),children:[O?(0,o.jsx)(i.Typography,{color:`text-error`,variant:`body`,children:O}):null,!O&&!R&&B.length===0?(0,o.jsx)(i.Typography,{color:`text-neutral`,variant:`body`,children:C}):null,(0,o.jsx)(i.Table,{actions:J,columns:q,dataSource:[...B],fullWidth:!0,loading:R,pagination:{current:M,onChange:e=>{N(e)},onChangePageSize:e=>{N(1),F(e)},pageSize:P,pageSizeLabel:`每頁筆數`,pageSizeOptions:d,renderResultSummary:(e,t,n)=>`顯示 ${e}-${t} 筆，共 ${n} 筆`,showPageSizeOptions:!0,total:I}})]})})]})}function m(e){return{...e,caseTitle:(0,s.readApprovalInstanceCaseTitle)(e),key:e.id,stateLabel:y(e.state)}}function h(e){return v(e)?g(e.state):f[0]}function g(e){return f.find(t=>t.state===e)??f[0]}function _(e){return v(e)?e.name:f[0].name}function v(e){return typeof e==`object`&&!!e&&`id`in e&&`name`in e&&`state`in e}function y(e){return e===`RUNNING`?`進行中`:e===`APPROVED`?`已通過`:e===`REJECTED`?`已拒絕`:e===`RETURNED`?`已退回`:e===`CANCELLED`?`已取消`:e===`EXPIRED`?`已逾期`:`草稿`}function b(e){return e===`APPROVED`?`text-success`:e===`REJECTED`||e===`CANCELLED`||e===`EXPIRED`?`text-error`:`text-neutral`}function x(e,t){let n=(e??``).trim();return n?t.get(n)?.name??n:`未知發起人`}function S(e){return e instanceof Error?e.message:`讀取簽核案件失敗。`}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});
+//# sourceMappingURL=approval-instance-list-page-Mo6wpDPb.cjs.map

package/dist/chunks/approval-instance-list-page-Mo6wpDPb.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"approval-instance-list-page-Mo6wpDPb.cjs","names":[],"sources":["../../src/components/approval-instance-list-page.module.scss","../../src/components/approval-instance-list-page.tsx"],"sourcesContent":[".instanceFilterArea {\n  :global(.mzn-filter-area__actions) {\n    display: none;\n  }\n\n  :global(.mzn-form-field__label-area) {\n    display: none;\n  }\n\n  :global(.mzn-form-field__control-field-slot--main) {\n    width: 100%;\n    min-width: 0;\n  }\n}\n","'use client';\n\nimport type { ChangeEvent, ReactElement } from 'react';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n  Filter,\n  FilterArea,\n  FilterLine,\n  FormField,\n  Input,\n  PageHeader,\n  Section,\n  SectionGroup,\n  Select,\n  Table,\n  Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport type { TableActions, TableColumn } from '@mezzanine-ui/core/table';\nimport { resolveMembers, type MemberProfileRecord } from '@rytass/bpm-core-client';\nimport {\n  listApprovalInstancesPage,\n  readApprovalInstanceCaseTitle,\n  type ApprovalInstanceRecord,\n  type ApprovalInstanceState,\n  type ApprovalInstanceView,\n} from '@rytass/bpm-core-client/workflow';\nimport { useRouterAdapter } from '../lib/router-adapter';\nimport { formatDateTime } from '../lib/format-date-time';\nimport { AppLayout } from './app-navigation';\nimport styles from './approval-instance-list-page.module.scss';\n\nexport interface ApprovalInstanceListPageProps {\n  readonly activeHref: string;\n  readonly defaultState: ApprovalInstanceState | null;\n  readonly description: string;\n  readonly emptyMessage: string;\n  readonly searchPlaceholder: string;\n  readonly title: string;\n  readonly view: ApprovalInstanceView;\n}\n\ntype StateFilterOption = Readonly<{\n  id: 'ALL' | ApprovalInstanceState;\n  name: string;\n  state: ApprovalInstanceState | null;\n}>;\n\ntype ApprovalInstanceRow = Readonly<\n  Record<string, unknown> &\n    ApprovalInstanceRecord & {\n      caseTitle: string;\n      key: string;\n      stateLabel: string;\n    }\n>;\n\nconst INSTANCE_PAGE_SIZE_OPTIONS = [10, 20, 50];\nconst STATE_FILTER_OPTIONS: readonly StateFilterOption[] = [\n  { id: 'ALL', name: '全部狀態', state: null },\n  { id: 'RUNNING', name: '進行中', state: 'RUNNING' },\n  { id: 'APPROVED', name: '已通過', state: 'APPROVED' },\n  { id: 'REJECTED', name: '已拒絕', state: 'REJECTED' },\n  { id: 'RETURNED', name: '已退回', state: 'RETURNED' },\n  { id: 'CANCELLED', name: '已取消', state: 'CANCELLED' },\n  { id: 'EXPIRED', name: '已逾期', state: 'EXPIRED' },\n  { id: 'DRAFT', name: '草稿', state: 'DRAFT' },\n];\n\n/**\n * Shared list page for any approval-instance \"view\" (inbox / sent / cc /\n * delegated). Caller picks the view + default state filter; the page renders\n * the standard BPM filter bar + paginated table and navigates to\n * `/instances/:id` on row action.\n */\nexport function ApprovalInstanceListPage({\n  activeHref,\n  defaultState,\n  description,\n  emptyMessage,\n  searchPlaceholder,\n  title,\n  view,\n}: ApprovalInstanceListPageProps): ReactElement {\n  const router = useRouterAdapter();\n  const [error, setError] = useState<string | null>(null);\n  const [initiatorProfilesById, setInitiatorProfilesById] = useState<\n    ReadonlyMap<string, MemberProfileRecord>\n  >(new Map());\n  const [instancePage, setInstancePage] = useState(1);\n  const [instancePageSize, setInstancePageSize] = useState(10);\n  const [instanceTotalCount, setInstanceTotalCount] = useState(0);\n  const [loading, setLoading] = useState(true);\n  const [rows, setRows] = useState<readonly ApprovalInstanceRow[]>([]);\n  const [searchText, setSearchText] = useState('');\n  const [stateFilter, setStateFilter] = useState<StateFilterOption>(\n    readStateFilterOption(defaultState),\n  );\n\n  const refreshInstances = useCallback(async (): Promise<void> => {\n    setLoading(true);\n    setError(null);\n\n    try {\n      const result = await listApprovalInstancesPage({\n        page: instancePage,\n        pageSize: instancePageSize,\n        searchText,\n        state: stateFilter.state,\n        templateId: null,\n        view,\n      });\n\n      setRows(result.instances.map(readApprovalInstanceRow));\n      setInstanceTotalCount(result.totalCount);\n    } catch (requestError: unknown) {\n      setError(readErrorMessage(requestError));\n    } finally {\n      setLoading(false);\n    }\n  }, [instancePage, instancePageSize, searchText, stateFilter, view]);\n\n  useEffect((): void => {\n    void refreshInstances();\n  }, [refreshInstances]);\n\n  useEffect((): (() => void) | void => {\n    const initiatorMemberIds = Array.from(\n      new Set(rows.map((row) => row.initiatorMemberId).filter(Boolean)),\n    );\n\n    if (initiatorMemberIds.length === 0) {\n      setInitiatorProfilesById(new Map());\n\n      return;\n    }\n\n    let cancelled = false;\n\n    void (async (): Promise<void> => {\n      try {\n        const profiles = await resolveMembers(initiatorMemberIds);\n\n        if (cancelled) {\n          return;\n        }\n\n        setInitiatorProfilesById(\n          new Map(profiles.map((profile) => [profile.memberId, profile])),\n        );\n      } catch {\n        if (cancelled) {\n          return;\n        }\n\n        setInitiatorProfilesById(new Map());\n      }\n    })();\n\n    return (): void => {\n      cancelled = true;\n    };\n  }, [rows]);\n\n  const columns = useMemo(\n    (): TableColumn<ApprovalInstanceRow>[] => [\n      { dataIndex: 'caseTitle', key: 'caseTitle', title: '案件', width: 300 },\n      {\n        key: 'state',\n        render: (record: ApprovalInstanceRow): ReactElement => (\n          <Typography\n            color={readInstanceStateColor(record.state)}\n            component=\"span\"\n            variant=\"body\"\n          >\n            {record.stateLabel}\n          </Typography>\n        ),\n        title: '狀態',\n        width: 120,\n      },\n      {\n        key: 'initiatorMemberId',\n        render: (record: ApprovalInstanceRow): ReactElement => (\n          <Typography component=\"span\" variant=\"body\">\n            {readInitiatorLabel(\n              record.initiatorMemberId,\n              initiatorProfilesById,\n            )}\n          </Typography>\n        ),\n        title: '發起人',\n        width: 180,\n      },\n      {\n        key: 'startedAt',\n        render: (record: ApprovalInstanceRow): ReactElement => (\n          <Typography component=\"span\" variant=\"body\">\n            {formatDateTime(record.startedAt)}\n          </Typography>\n        ),\n        title: '發起時間',\n        width: 220,\n      },\n      {\n        key: 'completedAt',\n        render: (record: ApprovalInstanceRow): ReactElement => (\n          <Typography component=\"span\" variant=\"body\">\n            {formatDateTime(record.completedAt)}\n          </Typography>\n        ),\n        title: '完成時間',\n        width: 220,\n      },\n    ],\n    [initiatorProfilesById],\n  );\n  const tableActions = useMemo(\n    (): TableActions<ApprovalInstanceRow> => ({\n      render: (\n        record,\n      ): ReturnType<TableActions<ApprovalInstanceRow>['render']> => [\n        {\n          name: '查看',\n          onClick: (): void => router.push(`/instances/${record.id}`),\n        },\n      ],\n      variant: 'base-secondary',\n      width: 88,\n    }),\n    [router],\n  );\n\n  return (\n    <AppLayout activeHref={activeHref}>\n        <PageHeader>\n          <ContentHeader description={description} title={title} />\n        </PageHeader>\n\n        <SectionGroup>\n          <Section\n            filterArea={\n              <FilterArea className={styles.instanceFilterArea} size=\"sub\">\n                <FilterLine>\n                  <Filter span={3}>\n                    <FormField\n                      fullWidth\n                      layout={FormFieldLayout.VERTICAL}\n                      name=\"instanceSearchText\"\n                    >\n                      <Input\n                        fullWidth\n                        onChange={(\n                          event: ChangeEvent<HTMLInputElement>,\n                        ): void => {\n                          setSearchText(event.target.value);\n                          setInstancePage(1);\n                        }}\n                        placeholder={searchPlaceholder}\n                        size=\"sub\"\n                        value={searchText}\n                        variant=\"base\"\n                      />\n                    </FormField>\n                  </Filter>\n                  <Filter span={2}>\n                    <FormField\n                      fullWidth\n                      layout={FormFieldLayout.VERTICAL}\n                      name=\"instanceState\"\n                    >\n                      <Select\n                        clearable={false}\n                        fullWidth\n                        onChange={(option): void => {\n                          setStateFilter(readSelectedStateFilterOption(option));\n                          setInstancePage(1);\n                        }}\n                        options={[...STATE_FILTER_OPTIONS]}\n                        placeholder=\"狀態\"\n                        renderValue={(value): string =>\n                          `狀態：${readStateFilterLabel(value)}`\n                        }\n                        size=\"sub\"\n                        value={stateFilter}\n                      />\n                    </FormField>\n                  </Filter>\n                </FilterLine>\n              </FilterArea>\n            }\n          >\n            {error ? (\n              <Typography color=\"text-error\" variant=\"body\">\n                {error}\n              </Typography>\n            ) : null}\n            {!error && !loading && rows.length === 0 ? (\n              <Typography color=\"text-neutral\" variant=\"body\">\n                {emptyMessage}\n              </Typography>\n            ) : null}\n            <Table\n              actions={tableActions}\n              columns={columns}\n              dataSource={[...rows]}\n              fullWidth\n              loading={loading}\n              pagination={{\n                current: instancePage,\n                onChange: (page): void => {\n                  setInstancePage(page);\n                },\n                onChangePageSize: (pageSize): void => {\n                  setInstancePage(1);\n                  setInstancePageSize(pageSize);\n                },\n                pageSize: instancePageSize,\n                pageSizeLabel: '每頁筆數',\n                pageSizeOptions: INSTANCE_PAGE_SIZE_OPTIONS,\n                renderResultSummary: (from, to, total): string =>\n                  `顯示 ${from}-${to} 筆，共 ${total} 筆`,\n                showPageSizeOptions: true,\n                total: instanceTotalCount,\n              }}\n            />\n          </Section>\n        </SectionGroup>\n      </AppLayout>\n  );\n}\n\nfunction readApprovalInstanceRow(\n  instance: ApprovalInstanceRecord,\n): ApprovalInstanceRow {\n  return {\n    ...instance,\n    caseTitle: readApprovalInstanceCaseTitle(instance),\n    key: instance.id,\n    stateLabel: readInstanceStateLabel(instance.state),\n  };\n}\n\nfunction readSelectedStateFilterOption(option: unknown): StateFilterOption {\n  if (!isStateFilterOption(option)) {\n    return STATE_FILTER_OPTIONS[0];\n  }\n  return readStateFilterOption(option.state);\n}\n\nfunction readStateFilterOption(\n  state: ApprovalInstanceState | null,\n): StateFilterOption {\n  return (\n    STATE_FILTER_OPTIONS.find((option) => option.state === state) ??\n    STATE_FILTER_OPTIONS[0]\n  );\n}\n\nfunction readStateFilterLabel(value: unknown): string {\n  return isStateFilterOption(value) ? value.name : STATE_FILTER_OPTIONS[0].name;\n}\n\nfunction isStateFilterOption(value: unknown): value is StateFilterOption {\n  return (\n    typeof value === 'object' &&\n    value !== null &&\n    'id' in value &&\n    'name' in value &&\n    'state' in value\n  );\n}\n\nfunction readInstanceStateLabel(state: ApprovalInstanceState): string {\n  if (state === 'RUNNING') return '進行中';\n  if (state === 'APPROVED') return '已通過';\n  if (state === 'REJECTED') return '已拒絕';\n  if (state === 'RETURNED') return '已退回';\n  if (state === 'CANCELLED') return '已取消';\n  if (state === 'EXPIRED') return '已逾期';\n  return '草稿';\n}\n\nfunction readInstanceStateColor(\n  state: ApprovalInstanceState,\n): 'text-error' | 'text-neutral' | 'text-success' {\n  if (state === 'APPROVED') return 'text-success';\n  if (state === 'REJECTED' || state === 'CANCELLED' || state === 'EXPIRED') {\n    return 'text-error';\n  }\n  return 'text-neutral';\n}\n\nfunction readInitiatorLabel(\n  initiatorMemberId: string | null | undefined,\n  initiatorProfilesById: ReadonlyMap<string, MemberProfileRecord>,\n): string {\n  const trimmedMemberId = (initiatorMemberId ?? '').trim();\n  if (!trimmedMemberId) return '未知發起人';\n  return initiatorProfilesById.get(trimmedMemberId)?.name ?? trimmedMemberId;\n}\n\nfunction readErrorMessage(error: unknown): string {\n  return error instanceof Error ? error.message : '讀取簽核案件失敗。';\n}\n"],"mappings":"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"}