@freighttech/ui 0.13.18

package/dist/portal/PortalShell.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/portal/PortalShell.tsx"],
+  "sourcesContent": ["\"use client\"\nimport { type ReactNode, useState, useCallback, useMemo, useContext } from 'react'\nimport Image from 'next/image'\nimport Link from 'next/link'\nimport { usePathname } from 'next/navigation'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Button } from '../primitives/button'\nimport { IconButton } from '../primitives/icon-button'\nimport { usePortalInjectedMenuItems } from './hooks/usePortalInjectedMenuItems'\nimport { usePortalEventBridge } from './hooks/usePortalEventBridge'\nimport { mergeMenuItems } from '../backend/injection/mergeMenuItems'\nimport type { MergedMenuItem } from '../backend/injection/mergeMenuItems'\nimport { PortalNotificationBell } from './components/PortalNotificationBell'\nimport { usePortalContext } from './PortalContext'\n\n// Component replacement handle IDs (FROZEN once shipped)\nexport const PORTAL_SHELL_HANDLE = 'page:portal:layout'\nexport const PORTAL_HEADER_HANDLE = 'section:portal:header'\nexport const PORTAL_FOOTER_HANDLE = 'section:portal:footer'\nexport const PORTAL_SIDEBAR_HANDLE = 'section:portal:sidebar'\nexport const PORTAL_USER_MENU_HANDLE = 'section:portal:user-menu'\n\nexport type PortalShellProps = {\n  children: ReactNode\n  /** Override orgSlug (used on public pages without context) */\n  orgSlug?: string\n  /** Override organization name (used on public pages without context) */\n  organizationName?: string\n  /** Whether to show authenticated layout. Auto-detected from context when omitted. */\n  authenticated?: boolean\n  /** Logout handler. Auto-provided from context when omitted. */\n  onLogout?: () => void\n  enableEventBridge?: boolean\n  /** Override user name. Auto-read from context when omitted. */\n  userName?: string\n  /** Override user email. Auto-read from context when omitted. */\n  userEmail?: string\n}\n\nfunction PortalEventBridgeMount() {\n  usePortalEventBridge()\n  return null\n}\n\n/* ---- Inline SVG icons ---- */\n\nfunction MenuIcon({ className }: { className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\n      <line x1=\"4\" x2=\"20\" y1=\"12\" y2=\"12\" /><line x1=\"4\" x2=\"20\" y1=\"6\" y2=\"6\" /><line x1=\"4\" x2=\"20\" y1=\"18\" y2=\"18\" />\n    </svg>\n  )\n}\n\nfunction XIcon({ className }: { className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\n      <path d=\"M18 6 6 18\" /><path d=\"m6 6 12 12\" />\n    </svg>\n  )\n}\n\nfunction LogOutIcon({ className }: { className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\n      <path d=\"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4\" /><polyline points=\"16 17 21 12 16 7\" /><line x1=\"21\" x2=\"9\" y1=\"12\" y2=\"12\" />\n    </svg>\n  )\n}\n\n/* ---- Sidebar nav item ---- */\n\nfunction SidebarNavItem({\n  item,\n  active,\n  t,\n  onClick,\n}: {\n  item: MergedMenuItem\n  active: boolean\n  t: (key: string, fallback?: string) => string\n  onClick?: () => void\n}) {\n  const label = item.labelKey ? t(item.labelKey, item.label) : item.label\n  if (!label) return null\n\n  const cls = [\n    'flex items-center gap-2.5 rounded-lg px-3 py-2 text-[13px] font-medium transition-colors',\n    active\n      ? 'bg-foreground text-background'\n      : 'text-muted-foreground hover:bg-muted hover:text-foreground',\n  ].join(' ')\n\n  if (item.href) {\n    return (\n      <Link href={item.href} className={cls} data-menu-item-id={item.id} onClick={onClick}>\n        {label}\n      </Link>\n    )\n  }\n  if (item.onClick) {\n    return (\n      <button type=\"button\" className={cls} data-menu-item-id={item.id} onClick={() => { item.onClick?.(); onClick?.() }}>\n        {label}\n      </button>\n    )\n  }\n  return null\n}\n\n/* ---- User initials avatar ---- */\n\nfunction UserAvatar({ name, className }: { name?: string; className?: string }) {\n  const initials = name\n    ? name.split(' ').map((w) => w[0]).slice(0, 2).join('').toUpperCase()\n    : '?'\n  return (\n    <div className={`flex items-center justify-center rounded-full bg-foreground text-[11px] font-semibold text-background ${className ?? 'size-8'}`}>\n      {initials}\n    </div>\n  )\n}\n\n/* ---- Try reading from PortalContext ---- */\n\nfunction useOptionalPortalContext() {\n  try {\n    return usePortalContext()\n  } catch {\n    return null\n  }\n}\n\n/* ================================================================== */\n/*  PortalShell                                                       */\n/* ================================================================== */\n\n/**\n * Portal layout shell.\n *\n * When a `PortalProvider` is mounted in a parent layout, PortalShell reads\n * auth/tenant state from context \u2014 no re-fetching on navigation. Props are\n * used as overrides or for public pages that don't have a context.\n */\nexport function PortalShell({\n  children,\n  orgSlug: orgSlugProp,\n  organizationName: orgNameProp,\n  authenticated: authenticatedProp,\n  onLogout: onLogoutProp,\n  enableEventBridge = false,\n  userName: userNameProp,\n  userEmail: userEmailProp,\n}: PortalShellProps) {\n  const t = useT()\n  const pathname = usePathname()\n  const [mobileOpen, setMobileOpen] = useState(false)\n\n  // Read from context when available (persists across navigations)\n  const portalCtx = useOptionalPortalContext()\n\n  // Resolve values: context takes priority, props are fallback/override\n  const orgSlug = portalCtx?.orgSlug ?? orgSlugProp\n  const orgName = portalCtx?.tenant.organizationName ?? orgNameProp\n  const user = portalCtx?.auth.user ?? null\n  const authenticated = authenticatedProp ?? !!user\n  const onLogout = onLogoutProp ?? portalCtx?.auth.logout\n  const userName = userNameProp ?? user?.displayName\n  const userEmail = userEmailProp ?? user?.email\n\n  const { items: injectedMainItems } = usePortalInjectedMenuItems('menu:portal:sidebar:main')\n  const { items: injectedAccountItems } = usePortalInjectedMenuItems('menu:portal:sidebar:account')\n\n  const portalHome = orgSlug ? `/${orgSlug}/portal` : '/portal'\n  const loginHref = orgSlug ? `/${orgSlug}/portal/login` : '/portal/login'\n  const signupHref = orgSlug ? `/${orgSlug}/portal/signup` : '/portal/signup'\n  const dashboardHref = orgSlug ? `/${orgSlug}/portal/dashboard` : '/portal/dashboard'\n  const profileHref = orgSlug ? `/${orgSlug}/portal/profile` : '/portal/profile'\n  // Always use the resolved organization name from the database.\n  // Fall back to the generic portal title \u2014 never display the raw slug.\n  const headerTitle = orgName || t('portal.title', 'Customer Portal')\n\n  const closeMobile = useCallback(() => setMobileOpen(false), [])\n\n  const mergedNavItems = useMemo(() => {\n    if (!authenticated) return []\n    const builtIn = [\n      { id: 'portal-dashboard', labelKey: 'portal.nav.dashboard', href: dashboardHref },\n    ]\n    return mergeMenuItems(builtIn, injectedMainItems)\n  }, [authenticated, dashboardHref, injectedMainItems])\n\n  const mergedAccountItems = useMemo(() => {\n    if (!authenticated) return []\n    const builtIn = [\n      { id: 'portal-profile', labelKey: 'portal.nav.profile', href: profileHref },\n    ]\n    return mergeMenuItems(builtIn, injectedAccountItems)\n  }, [authenticated, profileHref, injectedAccountItems])\n\n  /* ---- PUBLIC LAYOUT ---- */\n  if (!authenticated) {\n    return (\n      <div className=\"flex min-h-svh flex-col bg-background\" data-portal-handle={PORTAL_SHELL_HANDLE}>\n        <header className=\"sticky top-0 z-40 border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80\" data-portal-handle={PORTAL_HEADER_HANDLE}>\n          <div className=\"mx-auto flex h-16 w-full max-w-screen-lg items-center justify-between px-6\">\n            <Link href={portalHome} className=\"flex items-center gap-2.5 text-foreground transition hover:opacity-80\" aria-label={headerTitle}>\n              <Image src=\"/open-mercato.svg\" alt=\"\" width={28} height={28} className=\"\" priority />\n              <span className=\"text-[15px] font-semibold tracking-tight\">{headerTitle}</span>\n            </Link>\n            <nav aria-label=\"Primary\" className=\"flex items-center gap-1\">\n              <Button asChild variant=\"ghost\" size=\"sm\" className=\"text-[13px]\">\n                <Link href={loginHref}>{t('portal.nav.login', 'Log In')}</Link>\n              </Button>\n              <Button asChild size=\"sm\" className=\"rounded-lg text-[13px]\">\n                <Link href={signupHref}>{t('portal.nav.signup', 'Sign Up')}</Link>\n              </Button>\n            </nav>\n          </div>\n        </header>\n\n        <main className=\"flex-1\">\n          <div className=\"mx-auto flex w-full max-w-screen-lg flex-col gap-8 px-6 py-12 sm:py-20\">\n            {children}\n          </div>\n        </main>\n\n        <footer className=\"border-t\" data-portal-handle={PORTAL_FOOTER_HANDLE}>\n          <div className=\"mx-auto flex w-full max-w-screen-lg items-center justify-between px-6 py-6\">\n            <Link href={portalHome} className=\"flex items-center gap-2 text-muted-foreground transition hover:text-foreground\">\n              <Image src=\"/open-mercato.svg\" alt=\"\" width={20} height={20} className=\"\" />\n              <span className=\"text-sm font-medium text-foreground\">{headerTitle}</span>\n            </Link>\n            <p className=\"text-xs text-muted-foreground/60\">\n              {t('portal.footer.copyright', '\\u00A9 {year} All rights reserved.', { year: new Date().getFullYear() })}\n            </p>\n          </div>\n        </footer>\n      </div>\n    )\n  }\n\n  /* ---- AUTHENTICATED LAYOUT ---- */\n\n  const sidebarContent = (\n    <div className=\"flex h-full flex-col\" data-portal-handle={PORTAL_SIDEBAR_HANDLE}>\n      <div className=\"flex h-16 items-center gap-2.5 border-b px-5\">\n        <Link href={portalHome} className=\"flex items-center gap-2.5 text-foreground transition hover:opacity-80\" aria-label={headerTitle}>\n          <Image src=\"/open-mercato.svg\" alt=\"\" width={22} height={22} className=\"\" />\n          <span className=\"text-[14px] font-semibold tracking-tight truncate\">{headerTitle}</span>\n        </Link>\n      </div>\n\n      <nav aria-label=\"Portal navigation\" className=\"flex-1 overflow-y-auto px-3 py-5\">\n        <p className=\"mb-2 px-3 text-[10px] font-semibold uppercase tracking-[0.12em] text-muted-foreground/50\">\n          {t('portal.nav.home', 'Portal')}\n        </p>\n        <div className=\"flex flex-col gap-0.5\">\n          {mergedNavItems.map((item) => (\n            <SidebarNavItem\n              key={item.id}\n              item={item}\n              active={!!item.href && pathname.startsWith(item.href)}\n              t={t}\n              onClick={closeMobile}\n            />\n          ))}\n        </div>\n\n        {mergedAccountItems.length > 0 ? (\n          <div className=\"mt-8\">\n            <p className=\"mb-2 px-3 text-[10px] font-semibold uppercase tracking-[0.12em] text-muted-foreground/50\">\n              {t('portal.nav.account', 'Account')}\n            </p>\n            <div className=\"flex flex-col gap-0.5\">\n              {mergedAccountItems.map((item) => (\n                <SidebarNavItem\n                  key={item.id}\n                  item={item}\n                  active={!!item.href && pathname.startsWith(item.href)}\n                  t={t}\n                  onClick={closeMobile}\n                />\n              ))}\n            </div>\n          </div>\n        ) : null}\n      </nav>\n\n      <div className=\"border-t px-3 py-3\">\n        <div className=\"flex items-center gap-2.5 rounded-lg px-3 py-2\">\n          <UserAvatar name={userName} className=\"size-8\" />\n          <div className=\"min-w-0 flex-1\">\n            {userName ? (\n              <p className=\"truncate text-[13px] font-medium leading-tight\">{userName}</p>\n            ) : (\n              <div className=\"h-4 w-24 animate-pulse rounded bg-muted\" />\n            )}\n            {userEmail ? (\n              <p className=\"truncate text-[11px] text-muted-foreground\">{userEmail}</p>\n            ) : (\n              <div className=\"mt-1 h-3 w-32 animate-pulse rounded bg-muted\" />\n            )}\n          </div>\n        </div>\n        <button\n          type=\"button\"\n          onClick={onLogout}\n          className=\"mt-0.5 flex w-full items-center gap-2.5 rounded-lg px-3 py-2 text-[13px] text-muted-foreground transition-colors hover:bg-muted hover:text-foreground\"\n          data-portal-handle={PORTAL_USER_MENU_HANDLE}\n          data-menu-item-id=\"portal-logout\"\n        >\n          <LogOutIcon className=\"size-4\" />\n          {t('portal.nav.logout', 'Log Out')}\n        </button>\n      </div>\n    </div>\n  )\n\n  return (\n    <div className=\"flex min-h-svh bg-background\" data-portal-handle={PORTAL_SHELL_HANDLE}>\n      {enableEventBridge ? <PortalEventBridgeMount /> : null}\n\n      <aside className=\"hidden w-[240px] shrink-0 border-r lg:block\">\n        {sidebarContent}\n      </aside>\n\n      {mobileOpen ? (\n        <div className=\"fixed inset-0 z-50 lg:hidden\">\n          <div className=\"absolute inset-0 bg-black/30 backdrop-blur-sm\" onClick={closeMobile} />\n          <aside className=\"relative z-10 h-full w-[280px] bg-background shadow-2xl\">\n            <div className=\"absolute right-3 top-4 z-20\">\n              <IconButton variant=\"ghost\" size=\"sm\" type=\"button\" onClick={closeMobile} aria-label=\"Close menu\">\n                <XIcon className=\"size-4\" />\n              </IconButton>\n            </div>\n            {sidebarContent}\n          </aside>\n        </div>\n      ) : null}\n\n      <div className=\"flex min-w-0 flex-1 flex-col\">\n        <header className=\"flex h-16 items-center justify-between border-b px-4 lg:px-8\" data-portal-handle={PORTAL_HEADER_HANDLE}>\n          <div className=\"flex items-center gap-3\">\n            <IconButton variant=\"ghost\" size=\"sm\" type=\"button\" onClick={() => setMobileOpen(true)} className=\"lg:hidden\" aria-label=\"Open menu\">\n              <MenuIcon className=\"size-5\" />\n            </IconButton>\n          </div>\n          <div className=\"flex items-center gap-3\">\n            <PortalNotificationBell t={t} />\n          </div>\n        </header>\n\n        <main className=\"flex-1 overflow-y-auto\">\n          <div className=\"w-full px-4 py-6 lg:px-8 lg:py-8\">\n            {children}\n          </div>\n        </main>\n\n        <footer className=\"border-t px-4 py-4 lg:px-8\" data-portal-handle={PORTAL_FOOTER_HANDLE}>\n          <p className=\"text-[11px] text-muted-foreground/50\">\n            {t('portal.footer.copyright', '\\u00A9 {year} All rights reserved.', { year: new Date().getFullYear() })}\n          </p>\n        </footer>\n      </div>\n    </div>\n  )\n}\n\nexport default PortalShell\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/portal/components/PortalCard.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+function PortalCard({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: `rounded-xl border bg-card p-5 sm:p-6 ${className ?? ""}`, children });
+}
+function PortalCardHeader({ title, description, label, action }) {
+  return /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-start justify-between gap-4", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      label ? /* @__PURE__ */ jsx("p", { className: "mb-1.5 text-[11px] font-medium uppercase tracking-widest text-muted-foreground/60", children: label }) : null,
+      /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold tracking-tight", children: title }),
+      description ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-sm text-muted-foreground", children: description }) : null
+    ] }),
+    action ? /* @__PURE__ */ jsx("div", { className: "shrink-0", children: action }) : null
+  ] });
+}
+function PortalStatRow({ label, value }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4 py-2.5", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground/70", children: label }),
+    /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: value })
+  ] });
+}
+function PortalCardDivider() {
+  return /* @__PURE__ */ jsx("div", { className: "border-t" });
+}
+export {
+  PortalCard,
+  PortalCardDivider,
+  PortalCardHeader,
+  PortalStatRow
+};
+//# sourceMappingURL=PortalCard.js.map

package/dist/portal/components/PortalCard.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/PortalCard.tsx"],
+  "sourcesContent": ["\"use client\"\nimport type { ReactNode } from 'react'\n\ntype PortalCardProps = {\n  children: ReactNode\n  className?: string\n}\n\n/**\n * Portal-styled card container.\n * Clean card with subtle border and minimal shadow, matching the\n * Open Mercato design language.\n */\nexport function PortalCard({ children, className }: PortalCardProps) {\n  return (\n    <div className={`rounded-xl border bg-card p-5 sm:p-6 ${className ?? ''}`}>\n      {children}\n    </div>\n  )\n}\n\ntype PortalCardHeaderProps = {\n  title: string\n  description?: string\n  label?: string\n  action?: ReactNode\n}\n\n/**\n * Card header with optional uppercase label, title, description, and action slot.\n * Matches the section label pattern from the landing page (small caps, muted).\n */\nexport function PortalCardHeader({ title, description, label, action }: PortalCardHeaderProps) {\n  return (\n    <div className=\"mb-4 flex items-start justify-between gap-4\">\n      <div>\n        {label ? (\n          <p className=\"mb-1.5 text-[11px] font-medium uppercase tracking-widest text-muted-foreground/60\">\n            {label}\n          </p>\n        ) : null}\n        <h3 className=\"text-base font-semibold tracking-tight\">{title}</h3>\n        {description ? (\n          <p className=\"mt-0.5 text-sm text-muted-foreground\">{description}</p>\n        ) : null}\n      </div>\n      {action ? <div className=\"shrink-0\">{action}</div> : null}\n    </div>\n  )\n}\n\ntype PortalStatRowProps = {\n  label: string\n  value: ReactNode\n}\n\n/**\n * Key-value row for displaying stats/info inside a PortalCard.\n * Uses the uppercase label style from the landing page's data fields.\n */\nexport function PortalStatRow({ label, value }: PortalStatRowProps) {\n  return (\n    <div className=\"flex items-center justify-between gap-4 py-2.5\">\n      <span className=\"text-[11px] font-medium uppercase tracking-wider text-muted-foreground/70\">\n        {label}\n      </span>\n      <span className=\"text-sm font-medium text-foreground\">{value}</span>\n    </div>\n  )\n}\n\n/**\n * Divider between stat rows.\n */\nexport function PortalCardDivider() {\n  return <div className=\"border-t\" />\n}\n"],
+  "mappings": ";AAeI,cAoBE,YApBF;AAFG,SAAS,WAAW,EAAE,UAAU,UAAU,GAAoB;AACnE,SACE,oBAAC,SAAI,WAAW,wCAAwC,aAAa,EAAE,IACpE,UACH;AAEJ;AAaO,SAAS,iBAAiB,EAAE,OAAO,aAAa,OAAO,OAAO,GAA0B;AAC7F,SACE,qBAAC,SAAI,WAAU,+CACb;AAAA,yBAAC,SACE;AAAA,cACC,oBAAC,OAAE,WAAU,qFACV,iBACH,IACE;AAAA,MACJ,oBAAC,QAAG,WAAU,0CAA0C,iBAAM;AAAA,MAC7D,cACC,oBAAC,OAAE,WAAU,wCAAwC,uBAAY,IAC/D;AAAA,OACN;AAAA,IACC,SAAS,oBAAC,SAAI,WAAU,YAAY,kBAAO,IAAS;AAAA,KACvD;AAEJ;AAWO,SAAS,cAAc,EAAE,OAAO,MAAM,GAAuB;AAClE,SACE,qBAAC,SAAI,WAAU,kDACb;AAAA,wBAAC,UAAK,WAAU,6EACb,iBACH;AAAA,IACA,oBAAC,UAAK,WAAU,uCAAuC,iBAAM;AAAA,KAC/D;AAEJ;AAKO,SAAS,oBAAoB;AAClC,SAAO,oBAAC,SAAI,WAAU,YAAW;AACnC;",
+  "names": []
+}

package/dist/portal/components/PortalEmptyState.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+function PortalEmptyState({ icon, title, description, action }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-3 rounded-xl border border-dashed py-12 text-center", children: [
+    icon ? /* @__PURE__ */ jsx("div", { className: "flex size-10 items-center justify-center rounded-lg bg-muted text-muted-foreground", children: icon }) : null,
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-foreground", children: title }),
+      description ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 max-w-sm text-sm text-muted-foreground", children: description }) : null
+    ] }),
+    action ?? null
+  ] });
+}
+export {
+  PortalEmptyState
+};
+//# sourceMappingURL=PortalEmptyState.js.map

package/dist/portal/components/PortalEmptyState.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/PortalEmptyState.tsx"],
+  "sourcesContent": ["\"use client\"\nimport type { ReactNode } from 'react'\n\ntype PortalEmptyStateProps = {\n  icon?: ReactNode\n  title: string\n  description?: string\n  action?: ReactNode\n}\n\n/**\n * Empty state placeholder for portal sections with no content.\n * Dashed border, centered layout, optional icon and CTA.\n */\nexport function PortalEmptyState({ icon, title, description, action }: PortalEmptyStateProps) {\n  return (\n    <div className=\"flex flex-col items-center justify-center gap-3 rounded-xl border border-dashed py-12 text-center\">\n      {icon ? (\n        <div className=\"flex size-10 items-center justify-center rounded-lg bg-muted text-muted-foreground\">\n          {icon}\n        </div>\n      ) : null}\n      <div>\n        <p className=\"text-sm font-medium text-foreground\">{title}</p>\n        {description ? (\n          <p className=\"mt-0.5 max-w-sm text-sm text-muted-foreground\">{description}</p>\n        ) : null}\n      </div>\n      {action ?? null}\n    </div>\n  )\n}\n"],
+  "mappings": ";AAkBQ,cAIF,YAJE;AAJD,SAAS,iBAAiB,EAAE,MAAM,OAAO,aAAa,OAAO,GAA0B;AAC5F,SACE,qBAAC,SAAI,WAAU,qGACZ;AAAA,WACC,oBAAC,SAAI,WAAU,sFACZ,gBACH,IACE;AAAA,IACJ,qBAAC,SACC;AAAA,0BAAC,OAAE,WAAU,uCAAuC,iBAAM;AAAA,MACzD,cACC,oBAAC,OAAE,WAAU,iDAAiD,uBAAY,IACxE;AAAA,OACN;AAAA,IACC,UAAU;AAAA,KACb;AAEJ;",
+  "names": []
+}

package/dist/portal/components/PortalFeatureCard.js

@@ -0,0 +1,21 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function PortalFeatureCard({ icon, title, description, href, onClick }) {
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    icon ? /* @__PURE__ */ jsx("div", { className: "mb-3 flex size-10 items-center justify-center rounded-lg border bg-background text-muted-foreground", children: icon }) : null,
+    /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-foreground", children: title }),
+    description ? /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm leading-relaxed text-muted-foreground", children: description }) : null
+  ] });
+  const cls = "flex flex-col rounded-xl border bg-card p-5 transition-colors hover:bg-accent/50";
+  if (href) {
+    return /* @__PURE__ */ jsx("a", { href, className: cls, children: content });
+  }
+  if (onClick) {
+    return /* @__PURE__ */ jsx("button", { type: "button", onClick, className: `${cls} text-left`, children: content });
+  }
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col rounded-xl border bg-card p-5", children: content });
+}
+export {
+  PortalFeatureCard
+};
+//# sourceMappingURL=PortalFeatureCard.js.map

package/dist/portal/components/PortalFeatureCard.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/PortalFeatureCard.tsx"],
+  "sourcesContent": ["\"use client\"\nimport type { ReactNode } from 'react'\n\ntype PortalFeatureCardProps = {\n  icon?: ReactNode\n  title: string\n  description?: string\n  href?: string\n  onClick?: () => void\n}\n\n/**\n * Feature card matching the landing page's 3-column feature grid.\n * Subtle border, icon block, title, and description.\n * Can be a link or a static display card.\n */\nexport function PortalFeatureCard({ icon, title, description, href, onClick }: PortalFeatureCardProps) {\n  const content = (\n    <>\n      {icon ? (\n        <div className=\"mb-3 flex size-10 items-center justify-center rounded-lg border bg-background text-muted-foreground\">\n          {icon}\n        </div>\n      ) : null}\n      <h3 className=\"text-sm font-semibold text-foreground\">{title}</h3>\n      {description ? (\n        <p className=\"mt-1 text-sm leading-relaxed text-muted-foreground\">{description}</p>\n      ) : null}\n    </>\n  )\n\n  const cls = 'flex flex-col rounded-xl border bg-card p-5 transition-colors hover:bg-accent/50'\n\n  if (href) {\n    return <a href={href} className={cls}>{content}</a>\n  }\n  if (onClick) {\n    return <button type=\"button\" onClick={onClick} className={`${cls} text-left`}>{content}</button>\n  }\n  return <div className=\"flex flex-col rounded-xl border bg-card p-5\">{content}</div>\n}\n"],
+  "mappings": ";AAkBI,mBAEI,KAFJ;AAFG,SAAS,kBAAkB,EAAE,MAAM,OAAO,aAAa,MAAM,QAAQ,GAA2B;AACrG,QAAM,UACJ,iCACG;AAAA,WACC,oBAAC,SAAI,WAAU,uGACZ,gBACH,IACE;AAAA,IACJ,oBAAC,QAAG,WAAU,yCAAyC,iBAAM;AAAA,IAC5D,cACC,oBAAC,OAAE,WAAU,sDAAsD,uBAAY,IAC7E;AAAA,KACN;AAGF,QAAM,MAAM;AAEZ,MAAI,MAAM;AACR,WAAO,oBAAC,OAAE,MAAY,WAAW,KAAM,mBAAQ;AAAA,EACjD;AACA,MAAI,SAAS;AACX,WAAO,oBAAC,YAAO,MAAK,UAAS,SAAkB,WAAW,GAAG,GAAG,cAAe,mBAAQ;AAAA,EACzF;AACA,SAAO,oBAAC,SAAI,WAAU,+CAA+C,mBAAQ;AAC/E;",
+  "names": []
+}

package/dist/portal/components/PortalNotificationBell.js

@@ -0,0 +1,67 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { IconButton } from "../../primitives/icon-button.js";
+import { usePortalNotifications } from "../hooks/usePortalNotifications.js";
+import { PortalNotificationPanel } from "./PortalNotificationPanel.js";
+function BellIcon({ className }) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+    /* @__PURE__ */ jsx("path", { d: "M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" }),
+    /* @__PURE__ */ jsx("path", { d: "M10.3 21a1.94 1.94 0 0 0 3.4 0" })
+  ] });
+}
+function PortalNotificationBell({ t }) {
+  const [panelOpen, setPanelOpen] = React.useState(false);
+  const {
+    notifications,
+    unreadCount,
+    hasNew,
+    markAsRead,
+    dismiss,
+    markAllRead
+  } = usePortalNotifications();
+  const [pulse, setPulse] = React.useState(false);
+  const prevCountRef = React.useRef(unreadCount);
+  React.useEffect(() => {
+    if (hasNew && unreadCount > prevCountRef.current) {
+      setPulse(true);
+      const timer = setTimeout(() => setPulse(false), 1200);
+      return () => clearTimeout(timer);
+    }
+    prevCountRef.current = unreadCount;
+  }, [unreadCount, hasNew]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      IconButton,
+      {
+        variant: "ghost",
+        size: "sm",
+        type: "button",
+        className: "relative",
+        onClick: () => setPanelOpen(true),
+        "aria-label": unreadCount > 0 ? t("portal.notifications.badge", "{count} unread", { count: unreadCount }) : t("portal.notifications.title", "Notifications"),
+        children: [
+          /* @__PURE__ */ jsx(BellIcon, { className: `size-[18px] ${pulse ? "animate-pulse" : ""}` }),
+          unreadCount > 0 ? /* @__PURE__ */ jsx("span", { className: "absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-foreground text-[9px] font-bold text-background", children: unreadCount > 99 ? "99+" : unreadCount }) : null
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      PortalNotificationPanel,
+      {
+        open: panelOpen,
+        onClose: () => setPanelOpen(false),
+        notifications,
+        unreadCount,
+        onMarkAsRead: markAsRead,
+        onDismiss: dismiss,
+        onMarkAllRead: markAllRead,
+        t
+      }
+    )
+  ] });
+}
+export {
+  PortalNotificationBell
+};
+//# sourceMappingURL=PortalNotificationBell.js.map

package/dist/portal/components/PortalNotificationBell.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/PortalNotificationBell.tsx"],
+  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport { IconButton } from '../../primitives/icon-button'\nimport type { TranslateFn } from '@open-mercato/shared/lib/i18n/context'\nimport { usePortalNotifications } from '../hooks/usePortalNotifications'\nimport { PortalNotificationPanel } from './PortalNotificationPanel'\n\nfunction BellIcon({ className }: { className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\n      <path d=\"M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9\" /><path d=\"M10.3 21a1.94 1.94 0 0 0 3.4 0\" />\n    </svg>\n  )\n}\n\ntype PortalNotificationBellProps = {\n  t: TranslateFn\n}\n\n/**\n * Portal notification bell icon with unread badge and slide-over panel.\n * Renders in the portal header. Uses portal-specific notification endpoints.\n */\nexport function PortalNotificationBell({ t }: PortalNotificationBellProps) {\n  const [panelOpen, setPanelOpen] = React.useState(false)\n  const {\n    notifications,\n    unreadCount,\n    hasNew,\n    markAsRead,\n    dismiss,\n    markAllRead,\n  } = usePortalNotifications()\n\n  const [pulse, setPulse] = React.useState(false)\n  const prevCountRef = React.useRef(unreadCount)\n\n  React.useEffect(() => {\n    if (hasNew && unreadCount > prevCountRef.current) {\n      setPulse(true)\n      const timer = setTimeout(() => setPulse(false), 1200)\n      return () => clearTimeout(timer)\n    }\n    prevCountRef.current = unreadCount\n  }, [unreadCount, hasNew])\n\n  return (\n    <>\n      <IconButton\n        variant=\"ghost\"\n        size=\"sm\"\n        type=\"button\"\n        className=\"relative\"\n        onClick={() => setPanelOpen(true)}\n        aria-label={\n          unreadCount > 0\n            ? t('portal.notifications.badge', '{count} unread', { count: unreadCount })\n            : t('portal.notifications.title', 'Notifications')\n        }\n      >\n        <BellIcon className={`size-[18px] ${pulse ? 'animate-pulse' : ''}`} />\n        {unreadCount > 0 ? (\n          <span className=\"absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-foreground text-[9px] font-bold text-background\">\n            {unreadCount > 99 ? '99+' : unreadCount}\n          </span>\n        ) : null}\n      </IconButton>\n\n      <PortalNotificationPanel\n        open={panelOpen}\n        onClose={() => setPanelOpen(false)}\n        notifications={notifications}\n        unreadCount={unreadCount}\n        onMarkAsRead={markAsRead}\n        onDismiss={dismiss}\n        onMarkAllRead={markAllRead}\n        t={t}\n      />\n    </>\n  )\n}\n"],
+  "mappings": ";AASI,SAsCA,UArCE,KADF;AARJ,YAAY,WAAW;AACvB,SAAS,kBAAkB;AAE3B,SAAS,8BAA8B;AACvC,SAAS,+BAA+B;AAExC,SAAS,SAAS,EAAE,UAAU,GAA2B;AACvD,SACE,qBAAC,SAAI,OAAM,8BAA6B,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,OAAM,eAAc,SAAQ,gBAAe,SAAQ,WAC3J;AAAA,wBAAC,UAAK,GAAE,6CAA4C;AAAA,IAAE,oBAAC,UAAK,GAAE,kCAAiC;AAAA,KACjG;AAEJ;AAUO,SAAS,uBAAuB,EAAE,EAAE,GAAgC;AACzE,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,KAAK;AACtD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,uBAAuB;AAE3B,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAS,KAAK;AAC9C,QAAM,eAAe,MAAM,OAAO,WAAW;AAE7C,QAAM,UAAU,MAAM;AACpB,QAAI,UAAU,cAAc,aAAa,SAAS;AAChD,eAAS,IAAI;AACb,YAAM,QAAQ,WAAW,MAAM,SAAS,KAAK,GAAG,IAAI;AACpD,aAAO,MAAM,aAAa,KAAK;AAAA,IACjC;AACA,iBAAa,UAAU;AAAA,EACzB,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM,aAAa,IAAI;AAAA,QAChC,cACE,cAAc,IACV,EAAE,8BAA8B,kBAAkB,EAAE,OAAO,YAAY,CAAC,IACxE,EAAE,8BAA8B,eAAe;AAAA,QAGrD;AAAA,8BAAC,YAAS,WAAW,eAAe,QAAQ,kBAAkB,EAAE,IAAI;AAAA,UACnE,cAAc,IACb,oBAAC,UAAK,WAAU,wIACb,wBAAc,KAAK,QAAQ,aAC9B,IACE;AAAA;AAAA;AAAA,IACN;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS,MAAM,aAAa,KAAK;AAAA,QACjC;AAAA,QACA;AAAA,QACA,cAAc;AAAA,QACd,WAAW;AAAA,QACX,eAAe;AAAA,QACf;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
+  "names": []
+}

package/dist/portal/components/PortalNotificationPanel.js

@@ -0,0 +1,158 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Button } from "../../primitives/button.js";
+import { IconButton } from "../../primitives/icon-button.js";
+function XIcon({ className }) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+    /* @__PURE__ */ jsx("path", { d: "M18 6 6 18" }),
+    /* @__PURE__ */ jsx("path", { d: "m6 6 12 12" })
+  ] });
+}
+function CheckIcon({ className }) {
+  return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" }) });
+}
+const SEVERITY_STYLES = {
+  info: "bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400",
+  success: "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400",
+  warning: "bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400",
+  error: "bg-rose-100 text-rose-700 dark:bg-rose-900/30 dark:text-rose-400"
+};
+function PortalNotificationPanel({
+  open,
+  onClose,
+  notifications,
+  unreadCount,
+  onMarkAsRead,
+  onDismiss,
+  onMarkAllRead,
+  t
+}) {
+  const [tab, setTab] = React.useState("all");
+  const panelRef = React.useRef(null);
+  React.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [open, onClose]);
+  if (!open) return null;
+  const filtered = tab === "unread" ? notifications.filter((n) => n.status === "unread") : notifications;
+  const formatTime = (iso) => {
+    const diff = Date.now() - new Date(iso).getTime();
+    const mins = Math.floor(diff / 6e4);
+    if (mins < 1) return t("portal.notifications.justNow", "Just now");
+    if (mins < 60) return t("portal.notifications.minutesAgo", "{m}m ago", { m: mins });
+    const hours = Math.floor(mins / 60);
+    if (hours < 24) return t("portal.notifications.hoursAgo", "{h}h ago", { h: hours });
+    const days = Math.floor(hours / 24);
+    return t("portal.notifications.daysAgo", "{d}d ago", { d: days });
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 bg-black/20 backdrop-blur-sm", onClick: onClose }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: panelRef,
+        className: "fixed right-0 top-0 z-50 flex h-full w-full max-w-md flex-col border-l bg-background shadow-2xl",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex h-16 items-center justify-between border-b px-5", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h2", { className: "text-[15px] font-semibold", children: t("portal.notifications.title", "Notifications") }),
+              unreadCount > 0 ? /* @__PURE__ */ jsx("p", { className: "text-[11px] text-muted-foreground", children: t("portal.notifications.unreadSummary", "{count} unread", { count: unreadCount }) }) : null
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+              unreadCount > 0 ? /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  type: "button",
+                  variant: "ghost",
+                  size: "sm",
+                  className: "text-[12px] text-muted-foreground",
+                  onClick: () => onMarkAllRead(),
+                  children: [
+                    /* @__PURE__ */ jsx(CheckIcon, { className: "mr-1 size-3.5" }),
+                    t("portal.notifications.markAllRead", "Mark all read")
+                  ]
+                }
+              ) : null,
+              /* @__PURE__ */ jsx(IconButton, { variant: "ghost", size: "sm", type: "button", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx(XIcon, { className: "size-4" }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex gap-0 border-b px-5", children: ["all", "unread"].map((tabId) => /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => setTab(tabId),
+              className: `border-b-2 px-3 py-2.5 text-[13px] font-medium transition-colors ${tab === tabId ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"}`,
+              children: [
+                tabId === "all" ? t("portal.notifications.tab.all", "All") : t("portal.notifications.tab.unread", "Unread"),
+                tabId === "unread" && unreadCount > 0 ? /* @__PURE__ */ jsx("span", { className: "ml-1.5 inline-flex size-5 items-center justify-center rounded-full bg-foreground text-[10px] font-bold text-background", children: unreadCount }) : null
+              ]
+            },
+            tabId
+          )) }),
+          /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: filtered.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center gap-2 py-16 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: tab === "unread" ? t("portal.notifications.emptyUnread", "All caught up!") : t("portal.notifications.empty", "No notifications yet") }) }) : filtered.map((notification) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `flex gap-3 border-b px-5 py-4 transition-colors ${notification.status === "unread" ? "bg-muted/30" : ""}`,
+              children: [
+                /* @__PURE__ */ jsx("div", { className: `mt-1 flex size-8 shrink-0 items-center justify-center rounded-lg text-[10px] font-bold ${SEVERITY_STYLES[notification.severity] ?? SEVERITY_STYLES.info}`, children: notification.severity.charAt(0).toUpperCase() }),
+                /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+                    /* @__PURE__ */ jsx("p", { className: "text-[13px] font-medium leading-snug", children: notification.title }),
+                    /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[11px] text-muted-foreground/60", children: formatTime(notification.createdAt) })
+                  ] }),
+                  notification.body ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-[12px] leading-relaxed text-muted-foreground", children: notification.body }) : null,
+                  /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center gap-2", children: [
+                    notification.status === "unread" ? /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        type: "button",
+                        variant: "ghost",
+                        size: "sm",
+                        className: "h-auto px-2 py-1 text-[11px] text-muted-foreground",
+                        onClick: () => onMarkAsRead(notification.id),
+                        children: t("portal.notifications.markRead", "Mark read")
+                      }
+                    ) : null,
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        type: "button",
+                        variant: "ghost",
+                        size: "sm",
+                        className: "h-auto px-2 py-1 text-[11px] text-muted-foreground",
+                        onClick: () => onDismiss(notification.id),
+                        children: t("portal.notifications.dismiss", "Dismiss")
+                      }
+                    ),
+                    notification.linkHref ? /* @__PURE__ */ jsx(
+                      "a",
+                      {
+                        href: notification.linkHref,
+                        className: "ml-auto text-[11px] font-medium text-foreground underline underline-offset-2 hover:opacity-80",
+                        onClick: () => {
+                          if (notification.status === "unread") onMarkAsRead(notification.id);
+                          onClose();
+                        },
+                        children: t("portal.notifications.view", "View")
+                      }
+                    ) : null
+                  ] })
+                ] })
+              ]
+            },
+            notification.id
+          )) })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  PortalNotificationPanel
+};
+//# sourceMappingURL=PortalNotificationPanel.js.map

package/dist/portal/components/PortalNotificationPanel.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/PortalNotificationPanel.tsx"],
+  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport { Button } from '../../primitives/button'\nimport { IconButton } from '../../primitives/icon-button'\nimport type { NotificationDto } from '@open-mercato/shared/modules/notifications/types'\nimport type { TranslateFn } from '@open-mercato/shared/lib/i18n/context'\n\nfunction XIcon({ className }: { className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\n      <path d=\"M18 6 6 18\" /><path d=\"m6 6 12 12\" />\n    </svg>\n  )\n}\n\nfunction CheckIcon({ className }: { className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\n      <polyline points=\"20 6 9 17 4 12\" />\n    </svg>\n  )\n}\n\nconst SEVERITY_STYLES: Record<string, string> = {\n  info: 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400',\n  success: 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400',\n  warning: 'bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400',\n  error: 'bg-rose-100 text-rose-700 dark:bg-rose-900/30 dark:text-rose-400',\n}\n\ntype Tab = 'all' | 'unread'\n\ntype PortalNotificationPanelProps = {\n  open: boolean\n  onClose: () => void\n  notifications: NotificationDto[]\n  unreadCount: number\n  onMarkAsRead: (id: string) => Promise<void>\n  onDismiss: (id: string) => Promise<void>\n  onMarkAllRead: () => Promise<void>\n  t: TranslateFn\n}\n\nexport function PortalNotificationPanel({\n  open,\n  onClose,\n  notifications,\n  unreadCount,\n  onMarkAsRead,\n  onDismiss,\n  onMarkAllRead,\n  t,\n}: PortalNotificationPanelProps) {\n  const [tab, setTab] = React.useState<Tab>('all')\n  const panelRef = React.useRef<HTMLDivElement>(null)\n\n  // Close on Escape\n  React.useEffect(() => {\n    if (!open) return\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') onClose()\n    }\n    window.addEventListener('keydown', handler)\n    return () => window.removeEventListener('keydown', handler)\n  }, [open, onClose])\n\n  if (!open) return null\n\n  const filtered = tab === 'unread'\n    ? notifications.filter((n) => n.status === 'unread')\n    : notifications\n\n  const formatTime = (iso: string) => {\n    const diff = Date.now() - new Date(iso).getTime()\n    const mins = Math.floor(diff / 60000)\n    if (mins < 1) return t('portal.notifications.justNow', 'Just now')\n    if (mins < 60) return t('portal.notifications.minutesAgo', '{m}m ago', { m: mins })\n    const hours = Math.floor(mins / 60)\n    if (hours < 24) return t('portal.notifications.hoursAgo', '{h}h ago', { h: hours })\n    const days = Math.floor(hours / 24)\n    return t('portal.notifications.daysAgo', '{d}d ago', { d: days })\n  }\n\n  return (\n    <>\n      {/* Backdrop */}\n      <div className=\"fixed inset-0 z-50 bg-black/20 backdrop-blur-sm\" onClick={onClose} />\n\n      {/* Panel */}\n      <div\n        ref={panelRef}\n        className=\"fixed right-0 top-0 z-50 flex h-full w-full max-w-md flex-col border-l bg-background shadow-2xl\"\n      >\n        {/* Header */}\n        <div className=\"flex h-16 items-center justify-between border-b px-5\">\n          <div>\n            <h2 className=\"text-[15px] font-semibold\">{t('portal.notifications.title', 'Notifications')}</h2>\n            {unreadCount > 0 ? (\n              <p className=\"text-[11px] text-muted-foreground\">\n                {t('portal.notifications.unreadSummary', '{count} unread', { count: unreadCount })}\n              </p>\n            ) : null}\n          </div>\n          <div className=\"flex items-center gap-1\">\n            {unreadCount > 0 ? (\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                className=\"text-[12px] text-muted-foreground\"\n                onClick={() => onMarkAllRead()}\n              >\n                <CheckIcon className=\"mr-1 size-3.5\" />\n                {t('portal.notifications.markAllRead', 'Mark all read')}\n              </Button>\n            ) : null}\n            <IconButton variant=\"ghost\" size=\"sm\" type=\"button\" onClick={onClose} aria-label=\"Close\">\n              <XIcon className=\"size-4\" />\n            </IconButton>\n          </div>\n        </div>\n\n        {/* Tabs */}\n        <div className=\"flex gap-0 border-b px-5\">\n          {(['all', 'unread'] as Tab[]).map((tabId) => (\n            <button\n              key={tabId}\n              type=\"button\"\n              onClick={() => setTab(tabId)}\n              className={`border-b-2 px-3 py-2.5 text-[13px] font-medium transition-colors ${\n                tab === tabId\n                  ? 'border-foreground text-foreground'\n                  : 'border-transparent text-muted-foreground hover:text-foreground'\n              }`}\n            >\n              {tabId === 'all'\n                ? t('portal.notifications.tab.all', 'All')\n                : t('portal.notifications.tab.unread', 'Unread')}\n              {tabId === 'unread' && unreadCount > 0 ? (\n                <span className=\"ml-1.5 inline-flex size-5 items-center justify-center rounded-full bg-foreground text-[10px] font-bold text-background\">\n                  {unreadCount}\n                </span>\n              ) : null}\n            </button>\n          ))}\n        </div>\n\n        {/* List */}\n        <div className=\"flex-1 overflow-y-auto\">\n          {filtered.length === 0 ? (\n            <div className=\"flex flex-col items-center justify-center gap-2 py-16 text-center\">\n              <p className=\"text-sm font-medium text-muted-foreground\">\n                {tab === 'unread'\n                  ? t('portal.notifications.emptyUnread', 'All caught up!')\n                  : t('portal.notifications.empty', 'No notifications yet')}\n              </p>\n            </div>\n          ) : (\n            filtered.map((notification) => (\n              <div\n                key={notification.id}\n                className={`flex gap-3 border-b px-5 py-4 transition-colors ${\n                  notification.status === 'unread' ? 'bg-muted/30' : ''\n                }`}\n              >\n                {/* Severity dot */}\n                <div className={`mt-1 flex size-8 shrink-0 items-center justify-center rounded-lg text-[10px] font-bold ${SEVERITY_STYLES[notification.severity] ?? SEVERITY_STYLES.info}`}>\n                  {notification.severity.charAt(0).toUpperCase()}\n                </div>\n\n                {/* Content */}\n                <div className=\"min-w-0 flex-1\">\n                  <div className=\"flex items-start justify-between gap-2\">\n                    <p className=\"text-[13px] font-medium leading-snug\">\n                      {notification.title}\n                    </p>\n                    <span className=\"shrink-0 text-[11px] text-muted-foreground/60\">\n                      {formatTime(notification.createdAt)}\n                    </span>\n                  </div>\n                  {notification.body ? (\n                    <p className=\"mt-0.5 text-[12px] leading-relaxed text-muted-foreground\">\n                      {notification.body}\n                    </p>\n                  ) : null}\n\n                  {/* Actions */}\n                  <div className=\"mt-2 flex items-center gap-2\">\n                    {notification.status === 'unread' ? (\n                      <Button\n                        type=\"button\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        className=\"h-auto px-2 py-1 text-[11px] text-muted-foreground\"\n                        onClick={() => onMarkAsRead(notification.id)}\n                      >\n                        {t('portal.notifications.markRead', 'Mark read')}\n                      </Button>\n                    ) : null}\n                    <Button\n                      type=\"button\"\n                      variant=\"ghost\"\n                      size=\"sm\"\n                      className=\"h-auto px-2 py-1 text-[11px] text-muted-foreground\"\n                      onClick={() => onDismiss(notification.id)}\n                    >\n                      {t('portal.notifications.dismiss', 'Dismiss')}\n                    </Button>\n                    {notification.linkHref ? (\n                      <a\n                        href={notification.linkHref}\n                        className=\"ml-auto text-[11px] font-medium text-foreground underline underline-offset-2 hover:opacity-80\"\n                        onClick={() => {\n                          if (notification.status === 'unread') onMarkAsRead(notification.id)\n                          onClose()\n                        }}\n                      >\n                        {t('portal.notifications.view', 'View')}\n                      </a>\n                    ) : null}\n                  </div>\n                </div>\n              </div>\n            ))\n          )}\n        </div>\n      </div>\n    </>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/portal/components/PortalPageHeader.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+function PortalPageHeader({ title, description, label, action }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 sm:flex-row sm:items-center sm:justify-between sm:gap-4", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      label ? /* @__PURE__ */ jsx("p", { className: "mb-1 text-[11px] font-medium uppercase tracking-widest text-muted-foreground/60", children: label }) : null,
+      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold tracking-tight sm:text-3xl", children: title }),
+      description ? /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground sm:text-base", children: description }) : null
+    ] }),
+    action ? /* @__PURE__ */ jsx("div", { className: "mt-3 shrink-0 sm:mt-0", children: action }) : null
+  ] });
+}
+export {
+  PortalPageHeader
+};
+//# sourceMappingURL=PortalPageHeader.js.map

package/dist/portal/components/PortalPageHeader.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/PortalPageHeader.tsx"],
+  "sourcesContent": ["\"use client\"\nimport type { ReactNode } from 'react'\n\ntype PortalPageHeaderProps = {\n  title: string\n  description?: string\n  label?: string\n  action?: ReactNode\n}\n\n/**\n * Portal page header with large title and optional action slot.\n * Matches the landing page's hero section typography \u2014 large,\n * tight tracking, with muted description.\n */\nexport function PortalPageHeader({ title, description, label, action }: PortalPageHeaderProps) {\n  return (\n    <div className=\"flex flex-col gap-1 sm:flex-row sm:items-center sm:justify-between sm:gap-4\">\n      <div>\n        {label ? (\n          <p className=\"mb-1 text-[11px] font-medium uppercase tracking-widest text-muted-foreground/60\">\n            {label}\n          </p>\n        ) : null}\n        <h1 className=\"text-2xl font-bold tracking-tight sm:text-3xl\">{title}</h1>\n        {description ? (\n          <p className=\"mt-1 text-sm text-muted-foreground sm:text-base\">{description}</p>\n        ) : null}\n      </div>\n      {action ? <div className=\"mt-3 shrink-0 sm:mt-0\">{action}</div> : null}\n    </div>\n  )\n}\n"],
+  "mappings": ";AAkBM,SAEI,KAFJ;AAHC,SAAS,iBAAiB,EAAE,OAAO,aAAa,OAAO,OAAO,GAA0B;AAC7F,SACE,qBAAC,SAAI,WAAU,+EACb;AAAA,yBAAC,SACE;AAAA,cACC,oBAAC,OAAE,WAAU,mFACV,iBACH,IACE;AAAA,MACJ,oBAAC,QAAG,WAAU,iDAAiD,iBAAM;AAAA,MACpE,cACC,oBAAC,OAAE,WAAU,mDAAmD,uBAAY,IAC1E;AAAA,OACN;AAAA,IACC,SAAS,oBAAC,SAAI,WAAU,yBAAyB,kBAAO,IAAS;AAAA,KACpE;AAEJ;",
+  "names": []
+}

package/dist/portal/components/index.js

@@ -0,0 +1,18 @@
+import { PortalCard, PortalCardHeader, PortalStatRow, PortalCardDivider } from "./PortalCard.js";
+import { PortalPageHeader } from "./PortalPageHeader.js";
+import { PortalEmptyState } from "./PortalEmptyState.js";
+import { PortalFeatureCard } from "./PortalFeatureCard.js";
+import { PortalNotificationBell } from "./PortalNotificationBell.js";
+import { PortalNotificationPanel } from "./PortalNotificationPanel.js";
+export {
+  PortalCard,
+  PortalCardDivider,
+  PortalCardHeader,
+  PortalEmptyState,
+  PortalFeatureCard,
+  PortalNotificationBell,
+  PortalNotificationPanel,
+  PortalPageHeader,
+  PortalStatRow
+};
+//# sourceMappingURL=index.js.map

package/dist/portal/components/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/components/index.ts"],
+  "sourcesContent": ["export { PortalCard, PortalCardHeader, PortalStatRow, PortalCardDivider } from './PortalCard'\nexport { PortalPageHeader } from './PortalPageHeader'\nexport { PortalEmptyState } from './PortalEmptyState'\nexport { PortalFeatureCard } from './PortalFeatureCard'\nexport { PortalNotificationBell } from './PortalNotificationBell'\nexport { PortalNotificationPanel } from './PortalNotificationPanel'\n"],
+  "mappings": "AAAA,SAAS,YAAY,kBAAkB,eAAe,yBAAyB;AAC/E,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAClC,SAAS,8BAA8B;AACvC,SAAS,+BAA+B;",
+  "names": []
+}

package/dist/portal/hooks/useCustomerAuth.js

@@ -0,0 +1,69 @@
+"use client";
+import { useCallback, useEffect, useState } from "react";
+import { useRouter } from "next/navigation";
+import { apiCall } from "../../backend/utils/apiCall.js";
+function useCustomerAuth(orgSlug) {
+  const router = useRouter();
+  const [state, setState] = useState({
+    user: null,
+    roles: [],
+    resolvedFeatures: [],
+    isPortalAdmin: false,
+    loading: true,
+    error: null
+  });
+  useEffect(() => {
+    let cancelled = false;
+    async function fetchProfile() {
+      try {
+        const { ok, status, result: data } = await apiCall("/api/customer_accounts/portal/profile");
+        if (cancelled) return;
+        if (status === 401) {
+          setState((prev) => ({ ...prev, loading: false, user: null }));
+          return;
+        }
+        if (!ok || !data?.ok) {
+          setState((prev) => ({ ...prev, loading: false, error: data?.error || `HTTP ${status}` }));
+          return;
+        }
+        setState({
+          user: data.user,
+          roles: data.roles || [],
+          resolvedFeatures: data.resolvedFeatures || [],
+          isPortalAdmin: data.isPortalAdmin || false,
+          loading: false,
+          error: null
+        });
+      } catch {
+        if (!cancelled) {
+          setState((prev) => ({ ...prev, loading: false, error: "Network error" }));
+        }
+      }
+    }
+    fetchProfile();
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+  const loginPath = orgSlug ? `/${orgSlug}/portal/login` : "/portal/login";
+  const logout = useCallback(async () => {
+    try {
+      await apiCall("/api/customer_accounts/portal/logout", { method: "POST" });
+    } catch {
+    }
+    setState({
+      user: null,
+      roles: [],
+      resolvedFeatures: [],
+      isPortalAdmin: false,
+      loading: false,
+      error: null
+    });
+    router.push(loginPath);
+  }, [router, loginPath]);
+  return { ...state, logout };
+}
+export {
+  useCustomerAuth
+};
+//# sourceMappingURL=useCustomerAuth.js.map

package/dist/portal/hooks/useCustomerAuth.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/portal/hooks/useCustomerAuth.ts"],
+  "sourcesContent": ["\"use client\"\nimport { useCallback, useEffect, useState } from 'react'\nimport { useRouter } from 'next/navigation'\nimport type { CustomerUser, CustomerRole, CustomerAuthResult } from '@open-mercato/shared/modules/customer-auth'\nimport { apiCall } from '../../backend/utils/apiCall'\n\nexport type { CustomerUser, CustomerRole, CustomerAuthResult }\n\n/**\n * Client-side hook for customer portal authentication.\n *\n * Fetches the authenticated customer profile from `/api/customer_accounts/portal/profile`\n * and provides auth state + logout capability.\n *\n * @param orgSlug - Optional organization slug for redirect paths\n *\n * @example\n * ```tsx\n * import { useCustomerAuth } from '@freighttech/ui/portal/hooks/useCustomerAuth'\n *\n * function MyPortalPage({ orgSlug }: { orgSlug: string }) {\n *   const { user, roles, resolvedFeatures, loading, logout } = useCustomerAuth(orgSlug)\n *   if (loading) return <LoadingMessage />\n *   if (!user) return <Redirect to={`/${orgSlug}/portal/login`} />\n *   return <div>Welcome, {user.displayName}</div>\n * }\n * ```\n */\nexport function useCustomerAuth(orgSlug?: string) {\n  const router = useRouter()\n  const [state, setState] = useState<CustomerAuthResult>({\n    user: null,\n    roles: [],\n    resolvedFeatures: [],\n    isPortalAdmin: false,\n    loading: true,\n    error: null,\n  })\n\n  useEffect(() => {\n    let cancelled = false\n\n    async function fetchProfile() {\n      try {\n        const { ok, status, result: data } = await apiCall<{ ok: boolean; user: CustomerAuthResult['user']; roles: CustomerAuthResult['roles']; resolvedFeatures: string[]; isPortalAdmin: boolean; error?: string }>('/api/customer_accounts/portal/profile')\n        if (cancelled) return\n\n        if (status === 401) {\n          setState((prev) => ({ ...prev, loading: false, user: null }))\n          return\n        }\n\n        if (!ok || !data?.ok) {\n          setState((prev) => ({ ...prev, loading: false, error: data?.error || `HTTP ${status}` }))\n          return\n        }\n\n        setState({\n          user: data.user,\n          roles: data.roles || [],\n          resolvedFeatures: data.resolvedFeatures || [],\n          isPortalAdmin: data.isPortalAdmin || false,\n          loading: false,\n          error: null,\n        })\n      } catch {\n        if (!cancelled) {\n          setState((prev) => ({ ...prev, loading: false, error: 'Network error' }))\n        }\n      }\n    }\n\n    fetchProfile()\n    return () => { cancelled = true }\n  }, [])\n\n  const loginPath = orgSlug ? `/${orgSlug}/portal/login` : '/portal/login'\n\n  const logout = useCallback(async () => {\n    try {\n      await apiCall('/api/customer_accounts/portal/logout', { method: 'POST' })\n    } catch {\n      // Best-effort logout \u2014 redirect regardless\n    }\n    setState({\n      user: null,\n      roles: [],\n      resolvedFeatures: [],\n      isPortalAdmin: false,\n      loading: false,\n      error: null,\n    })\n    router.push(loginPath)\n  }, [router, loginPath])\n\n  return { ...state, logout }\n}\n"],
+  "mappings": ";AACA,SAAS,aAAa,WAAW,gBAAgB;AACjD,SAAS,iBAAiB;AAE1B,SAAS,eAAe;AAwBjB,SAAS,gBAAgB,SAAkB;AAChD,QAAM,SAAS,UAAU;AACzB,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA6B;AAAA,IACrD,MAAM;AAAA,IACN,OAAO,CAAC;AAAA,IACR,kBAAkB,CAAC;AAAA,IACnB,eAAe;AAAA,IACf,SAAS;AAAA,IACT,OAAO;AAAA,EACT,CAAC;AAED,YAAU,MAAM;AACd,QAAI,YAAY;AAEhB,mBAAe,eAAe;AAC5B,UAAI;AACF,cAAM,EAAE,IAAI,QAAQ,QAAQ,KAAK,IAAI,MAAM,QAAmK,uCAAuC;AACrP,YAAI,UAAW;AAEf,YAAI,WAAW,KAAK;AAClB,mBAAS,CAAC,UAAU,EAAE,GAAG,MAAM,SAAS,OAAO,MAAM,KAAK,EAAE;AAC5D;AAAA,QACF;AAEA,YAAI,CAAC,MAAM,CAAC,MAAM,IAAI;AACpB,mBAAS,CAAC,UAAU,EAAE,GAAG,MAAM,SAAS,OAAO,OAAO,MAAM,SAAS,QAAQ,MAAM,GAAG,EAAE;AACxF;AAAA,QACF;AAEA,iBAAS;AAAA,UACP,MAAM,KAAK;AAAA,UACX,OAAO,KAAK,SAAS,CAAC;AAAA,UACtB,kBAAkB,KAAK,oBAAoB,CAAC;AAAA,UAC5C,eAAe,KAAK,iBAAiB;AAAA,UACrC,SAAS;AAAA,UACT,OAAO;AAAA,QACT,CAAC;AAAA,MACH,QAAQ;AACN,YAAI,CAAC,WAAW;AACd,mBAAS,CAAC,UAAU,EAAE,GAAG,MAAM,SAAS,OAAO,OAAO,gBAAgB,EAAE;AAAA,QAC1E;AAAA,MACF;AAAA,IACF;AAEA,iBAAa;AACb,WAAO,MAAM;AAAE,kBAAY;AAAA,IAAK;AAAA,EAClC,GAAG,CAAC,CAAC;AAEL,QAAM,YAAY,UAAU,IAAI,OAAO,kBAAkB;AAEzD,QAAM,SAAS,YAAY,YAAY;AACrC,QAAI;AACF,YAAM,QAAQ,wCAAwC,EAAE,QAAQ,OAAO,CAAC;AAAA,IAC1E,QAAQ;AAAA,IAER;AACA,aAAS;AAAA,MACP,MAAM;AAAA,MACN,OAAO,CAAC;AAAA,MACR,kBAAkB,CAAC;AAAA,MACnB,eAAe;AAAA,MACf,SAAS;AAAA,MACT,OAAO;AAAA,IACT,CAAC;AACD,WAAO,KAAK,SAAS;AAAA,EACvB,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,SAAO,EAAE,GAAG,OAAO,OAAO;AAC5B;",
+  "names": []
+}