@eintrek/erp-shell 0.1.44 → 0.1.46

package/dist/navigation/app-layout-shell.d.ts

@@ -1,4 +1,5 @@
 import * as React from "react";
+import { type ShellChrome } from "./chrome";
 /**
  * Shape the shell needs from an organization to wire the URL `[code]` segment
  * back to the active org id. Hosts already keep richer types around — this is
@@ -43,6 +44,18 @@ export interface AppLayoutShellProps {
     signInUrl: string;
     /** Absolute path to redirect to when the URL has no `[code]` segment. */
     selectOrganizationUrl: string;
+    /** Which look the chrome takes — see `ShellChrome`. Default "brand". */
+    chrome?: ShellChrome;
+    /**
+     * Right-hand end of the top bar (workspace chrome): typically the
+     * organisation switcher and a help button.
+     */
+    headerEnd?: React.ReactNode;
+    /**
+     * Product mark for the top bar when the sidebar is a drawer (workspace
+     * chrome, ≤1024px), so the app is still named with the sidebar closed.
+     */
+    mobileBrand?: React.ReactNode;
 }
 /**
  * Top-level app chrome: sticky header, sidebar slot, content gutter and the
@@ -56,4 +69,4 @@ export interface AppLayoutShellProps {
  * an erp-shell bump — domain components must NOT add their own root padding
  * or content gets indented twice.
  */
-export declare function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, signInUrl, selectOrganizationUrl, }: AppLayoutShellProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, signInUrl, selectOrganizationUrl, chrome, headerEnd, mobileBrand, }: AppLayoutShellProps): import("react/jsx-runtime").JSX.Element;

package/dist/navigation/app-sidebar.d.ts

@@ -1,5 +1,6 @@
 import * as React from "react";
 import type { Module, Tool } from "./navigation-types";
+import type { ShellChrome } from "./chrome";
 export interface AppSidebarProps {
     /** Visible modules (already permission-filtered by the app). */
     modules: Module[];
@@ -20,6 +21,14 @@ export interface AppSidebarProps {
     header?: React.ReactNode;
     /** Footer content — typically the app's `<NavUser>`. */
     footer?: React.ReactNode;
+    /**
+     * Between the navigation and the footer (workspace chrome): a help card,
+     * a link to the manual — whatever should sit at the bottom above the
+     * profile row.
+     */
+    bottom?: React.ReactNode;
+    /** Which look — match the `chrome` given to AppLayoutShell. */
+    chrome?: ShellChrome;
     className?: string;
 }
-export declare function AppSidebar({ modules, tools, activeModule, orgCode, approvalCounts, closeOnNavigation, header, footer, className, }: AppSidebarProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function AppSidebar({ modules, tools, activeModule, orgCode, approvalCounts, closeOnNavigation, header, footer, bottom, chrome, className, }: AppSidebarProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/navigation/chrome.d.ts

@@ -0,0 +1,24 @@
+import type * as React from "react";
+/**
+ * The two looks the app chrome comes in.
+ *
+ * - "brand": the original — a header painted in the app's --primary
+ *   gradient with white text, and a floating rounded sidebar. Every app
+ *   uses it until it opts in to the other.
+ * - "workspace": the layout of the Platform app hub design (11 Oct 2026) —
+ *   one top-bar row with the trail and page title on the left and room on
+ *   the right for the organisation and help, and a full-height sidebar with
+ *   the product mark, grouped navigation, a help card and the profile row.
+ *   The top bar keeps the app's gradient: the colour is how people tell the
+ *   apps apart, so only the layout follows the design.
+ *
+ * Opt-in per app, so bumping the shell for some other fix never restyles
+ * an app by accident.
+ */
+export type ShellChrome = "brand" | "workspace";
+/**
+ * Header ink as CSS variables. Header-borne pieces — breadcrumb, sidebar
+ * trigger, the org switcher, the app's own page title — read these, with
+ * white as the fallback, so the brand chrome looks exactly as before.
+ */
+export declare const WORKSPACE_HEADER_VARS: React.CSSProperties;

package/dist/navigation/nav-main.d.ts

@@ -1,4 +1,5 @@
 import type { Module } from "./navigation-types";
+import type { ShellChrome } from "./chrome";
 export interface NavMainProps {
     items: Module[];
     /**
@@ -14,5 +15,7 @@ export interface NavMainProps {
      * sub-modules whose count is > 0 (e.g. HR pending approvals).
      */
     approvalCounts?: Record<string, number>;
+    /** Workspace chrome draws icons, group headings and badges. */
+    chrome?: ShellChrome;
 }
-export declare function NavMain({ items, orgCode, closeOnNavigation, approvalCounts, }: NavMainProps): import("react/jsx-runtime").JSX.Element;
+export declare function NavMain({ items, orgCode, closeOnNavigation, approvalCounts, chrome, }: NavMainProps): import("react/jsx-runtime").JSX.Element;

package/dist/navigation/nav-user.d.ts

@@ -50,5 +50,10 @@ export interface NavUserProps {
      * Show the "เปลี่ยนภาษา" language switch. Default: true.
      */
     showLanguageSwitch?: boolean;
+    /**
+     * "workspace" draws the trigger as the workspace sidebar's profile row: a
+     * rule above, a round avatar, and up/down chevrons. Default "brand".
+     */
+    variant?: "brand" | "workspace";
 }
-export declare function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref, signInRedirectHref, systemLinks, showSelectOrganization, showLanguageSwitch, }?: NavUserProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref, signInRedirectHref, systemLinks, showSelectOrganization, showLanguageSwitch, variant, }?: NavUserProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/navigation/navigation-types.d.ts

@@ -12,6 +12,14 @@ export interface Module {
     /** Hide unless user matches ui_route_permissions for this key. */
     permissionRouteKey?: string;
     subModules?: SubModule[];
+    /**
+     * Section heading this item sits under (workspace chrome). Consecutive
+     * items with the same group share one heading; items without a group get
+     * none.
+     */
+    group?: string;
+    /** Small count or label at the end of the row (workspace chrome). */
+    badge?: string | number;
 }
 export interface SubPage {
     id: string;

package/dist/navigation/organization-switcher.d.ts

@@ -25,6 +25,12 @@ export interface OrganizationSwitcherProps {
     setOrganizationCookie: (id: string | number) => Promise<unknown>;
     /** Where to navigate on "เพิ่มองค์กร". Default: "/register-organization". */
     registerOrganizationHref?: string;
+    /**
+     * "sidebar" (default) is the row at the top of the sidebar. "header" is
+     * the workspace top bar's: an outlined mark, "องค์กรที่กำลังใช้งาน" over
+     * the name, and the list opening downwards from the right.
+     */
+    placement?: "sidebar" | "header";
     className?: string;
 }
-export declare function OrganizationSwitcher({ activeOrganization, isContextLoading, organizations, isLoadingOrgs, setOrganizationCookie, registerOrganizationHref, className, }: OrganizationSwitcherProps): import("react/jsx-runtime").JSX.Element;
+export declare function OrganizationSwitcher({ activeOrganization, isContextLoading, organizations, isLoadingOrgs, setOrganizationCookie, registerOrganizationHref, placement, className, }: OrganizationSwitcherProps): import("react/jsx-runtime").JSX.Element;

package/dist/navigation/sidebar-help-card.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+export interface SidebarHelpCardProps {
+    title: string;
+    description?: string;
+    actionLabel: string;
+    href: string;
+    icon?: React.ReactNode;
+    className?: string;
+}
+/**
+ * The card at the foot of the workspace sidebar that points someone who
+ * does not know where to start at the place that will tell them.
+ */
+export declare function SidebarHelpCard({ title, description, actionLabel, href, icon, className, }: SidebarHelpCardProps): import("react/jsx-runtime").JSX.Element;
+export interface SidebarHelpLinkProps {
+    label: string;
+    href: string;
+    icon?: React.ReactNode;
+    className?: string;
+}
+/** A quiet row under the help card — the manual, the support chat. */
+export declare function SidebarHelpLink({ label, href, icon, className }: SidebarHelpLinkProps): import("react/jsx-runtime").JSX.Element;

package/dist/navigation/workspace-brand.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+export interface WorkspaceBrandProps {
+    /** Product name, e.g. "AntNiti" or "Peoplx". */
+    name: string;
+    /** Small spaced caption under the name, e.g. "WORKSPACE" or "งานบุคคล". */
+    caption?: string;
+    /** The mark — an <img> of the app icon, or any node 44px square. */
+    mark: React.ReactNode;
+    /** Where the brand links to — the app's home for the organisation. */
+    href?: string;
+    /** Mark only, for the top bar when the sidebar is a drawer. */
+    compact?: boolean;
+    className?: string;
+}
+/**
+ * The product mark at the top of the workspace sidebar: the app icon, the
+ * name, and a spaced caption beneath it.
+ */
+export declare function WorkspaceBrand({ name, caption, mark, href, compact, className, }: WorkspaceBrandProps): import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eintrek/erp-shell",
-  "version": "0.1.44",
+  "version": "0.1.46",
   "private": false,
   "type": "module",
   "description": "Shared frontend platform for ERP apps — HTTP client, providers, navigation, hooks.",