@exxatdesignux/ui 0.2.19 → 0.3.0

package/template/lib/list-page-table-properties.ts

@@ -1,48 +1 @@
-/**
- * Connects ListPageTemplate “View → Edit” to a surface that hosts TablePropertiesDrawer
- * (PlacementsTable, TeamTable, ComplianceTable, …). Import from `@/components/table-properties`
- * or use here — see `createListPageEditViewHandler`.
- *
- * View **labels** for tabs and Properties are centralized in `@/lib/data-list-view`
- * (`DATA_LIST_VIEW_TILES`, `dataListViewLabel`, `dataListViewIcon`).
- */
-
-import * as React from "react"
-
-import { dataListViewIcon, type DataListViewType } from "@/lib/data-list-view"
-import { isDataListSurfaceViewType } from "@/lib/data-list-view-registry"
-
-export { isDataListSurfaceViewType }
-
-/** Minimal ref API any list/table surface exposes for the shared Properties drawer. */
-export interface OpenTablePropertiesHandle {
-  openPropertiesDrawer: () => void
-}
-
-export interface CreateListPageEditViewHandlerOptions {
-  /** Delay before opening Properties after switching to table (ms). Default 160. */
-  switchDelayMs?: number
-}
-
-/**
- * Returns `ListPageTemplate`’s `onEditView` handler: optionally coerces the tab to `table`
- * when the view type is unknown, then calls `ref.current.openPropertiesDrawer()`.
- */
-export function createListPageEditViewHandler(
-  tableRef: React.RefObject<OpenTablePropertiesHandle | null>,
-  options?: CreateListPageEditViewHandlerOptions
-) {
-  const delay = options?.switchDelayMs ?? 160
-  return (
-    tab: { viewType: string },
-    { updateTab }: { updateTab: (patch: { viewType?: DataListViewType; icon?: string }) => void }
-  ) => {
-    const mustSwitchToTableSurface = !isDataListSurfaceViewType(tab.viewType)
-    if (mustSwitchToTableSurface) {
-      updateTab({ viewType: "table", icon: dataListViewIcon("table") })
-    }
-    window.setTimeout(() => {
-      tableRef.current?.openPropertiesDrawer()
-    }, mustSwitchToTableSurface ? delay : 0)
-  }
-}
+export * from "@exxatdesignux/ui/lib/list-page-table-properties"

package/template/lib/list-status-badges.ts

@@ -1,16 +1,22 @@
 /**
  * Shared status chip labels, tint classes, and FA icon names for product list hubs
- * (Question bank, list hub, future entities), plus related chips (dashboard **task priority**).
+ * (Placements, Team, Compliance — table, list, board), plus related chips
+ * (dashboard **task priority**, placement **readiness** on the detail drawer).
  *
  * Labels use **sentence / title case** (e.g. "Due soon", "Under Review"). Do **not** add **`uppercase`**.
  *
- * **Rendering:** Use **`ListHubStatusBadge`** from `@/components/list-hub-status-badge`.
- * Task priority → **`TaskPriorityBadge`**.
+ * **Rendering:** Use **`ListHubStatusBadge`** from `@/components/list-hub-status-badge`, or
+ * **`StatusBadge`** from **`components/placements-table-cells.tsx`** for placement rows (wrapper
+ * around **`ListHubStatusBadge`** + **`PLACEMENT_STATUS_*`** below). Task priority → **`TaskPriorityBadge`**.
  *
  * **Semantic tints:** Map domain statuses onto **`LIST_HUB_STATUS_TINT_*`** before inventing new colors.
  * **Icon-on-tinted-disc** (insights / activity): **`TintedIconDisc`** + **`--icon-disc-*`** in **`app/globals.css`**.
  */
 
+import type { ComplianceStatus } from "@/lib/mock/compliance"
+import type { Status as PlacementStatus } from "@/lib/mock/placements"
+import type { TeamMember } from "@/lib/mock/team"
+
 // ─── Semantic variants (reuse for new entities) ─────────────────────────────
 //
 // **Light washes** (same visual weight as before) + **darker ink** via `--chip-*` for WCAG 1.4.3.
@@ -28,10 +34,24 @@ export const LIST_HUB_STATUS_TINT_NEUTRAL =
 export const LIST_HUB_STATUS_TINT_DANGER =
   "bg-destructive/15 text-[var(--chip-destructive)] border-destructive/20 dark:bg-destructive/15 dark:text-red-200"
 
-/** In-progress / review (distinct from warning where both appear). */
+/** In-progress / review (distinct from warning where both appear — e.g. Placements “Under review”). */
 export const LIST_HUB_STATUS_TINT_INFO =
   "bg-sky-500/15 text-[var(--chip-1)] border-sky-500/20 dark:bg-sky-500/15 dark:text-sky-100"
 
+// ─── Placement detail — readiness row (string labels from mock) ─────────────
+
+const PLACEMENT_READINESS_BADGE_CLASS: Record<string, string> = {
+  Ready: LIST_HUB_STATUS_TINT_SUCCESS,
+  "At risk": LIST_HUB_STATUS_TINT_DANGER,
+  Blocked: LIST_HUB_STATUS_TINT_DANGER,
+  "In review": LIST_HUB_STATUS_TINT_INFO,
+}
+
+/** Badge `className` tail for placement readiness labels; unknown → neutral. */
+export function placementReadinessBadgeClass(readiness: string): string {
+  return PLACEMENT_READINESS_BADGE_CLASS[readiness] ?? LIST_HUB_STATUS_TINT_NEUTRAL
+}
+
 // ─── Dashboard task priority (shared chip system) ──────────────────────────
 
 export type TaskPriorityLevel = "high" | "medium" | "low"
@@ -53,3 +73,76 @@ export function normalizeTaskPriority(priority: string): TaskPriorityLevel | nul
   if (k === "high" || k === "medium" || k === "low") return k
   return null
 }
+
+// ─── Placements (lifecycle status) ───────────────────────────────────────
+
+export const PLACEMENT_STATUS_LABEL: Record<PlacementStatus, string> = {
+  confirmed: "Confirmed",
+  pending: "Pending",
+  "under-review": "Under Review",
+  rejected: "Rejected",
+  completed: "Completed",
+}
+
+export const PLACEMENT_STATUS_BADGE_CLASS: Record<PlacementStatus, string> = {
+  confirmed: LIST_HUB_STATUS_TINT_SUCCESS,
+  pending: LIST_HUB_STATUS_TINT_WARNING,
+  "under-review": LIST_HUB_STATUS_TINT_INFO,
+  rejected: LIST_HUB_STATUS_TINT_DANGER,
+  completed: LIST_HUB_STATUS_TINT_NEUTRAL,
+}
+
+export const PLACEMENT_STATUS_ICON: Record<PlacementStatus, string> = {
+  confirmed: "fa-circle-check",
+  pending: "fa-hourglass-half",
+  "under-review": "fa-eye",
+  rejected: "fa-circle-xmark",
+  completed: "fa-clipboard-check",
+}
+
+// ─── Team ─────────────────────────────────────────────────────────────────
+
+export type TeamMemberStatus = TeamMember["status"]
+
+export const TEAM_MEMBER_STATUS_LABEL: Record<TeamMemberStatus, string> = {
+  active: "Active",
+  away: "Away",
+  invited: "Invited",
+}
+
+export const TEAM_MEMBER_STATUS_BADGE_CLASS: Record<TeamMemberStatus, string> = {
+  active: LIST_HUB_STATUS_TINT_SUCCESS,
+  away: LIST_HUB_STATUS_TINT_WARNING,
+  invited: LIST_HUB_STATUS_TINT_NEUTRAL,
+}
+
+/** Font Awesome icon per status — shape + label, not colour alone (WCAG 1.4.1). */
+export const TEAM_MEMBER_STATUS_ICON: Record<TeamMemberStatus, string> = {
+  active: "fa-circle-check",
+  away: "fa-moon",
+  invited: "fa-envelope",
+}
+
+// ─── Compliance ───────────────────────────────────────────────────────────
+
+export const COMPLIANCE_STATUS_LABEL: Record<ComplianceStatus, string> = {
+  compliant: "Compliant",
+  due_soon: "Due soon",
+  overdue: "Overdue",
+  pending: "Pending",
+}
+
+export const COMPLIANCE_STATUS_BADGE_CLASS: Record<ComplianceStatus, string> = {
+  compliant: LIST_HUB_STATUS_TINT_SUCCESS,
+  due_soon: LIST_HUB_STATUS_TINT_WARNING,
+  overdue: LIST_HUB_STATUS_TINT_DANGER,
+  pending: LIST_HUB_STATUS_TINT_NEUTRAL,
+}
+
+export const COMPLIANCE_STATUS_ICON: Record<ComplianceStatus, string> = {
+  compliant: "fa-shield-check",
+  due_soon: "fa-clock",
+  overdue: "fa-triangle-exclamation",
+  pending: "fa-hourglass-half",
+}
+

package/template/lib/mock/compliance-kpi.ts

@@ -0,0 +1,61 @@
+import type { MetricInsight, MetricItem } from "@/components/key-metrics"
+import type { ComplianceItem } from "@/lib/mock/compliance"
+
+export function complianceKpiMetrics(rows: ComplianceItem[]): MetricItem[] {
+  const compliant = rows.filter(r => r.status === "compliant").length
+  const dueSoon = rows.filter(r => r.status === "due_soon").length
+  const overdue = rows.filter(r => r.status === "overdue").length
+  const pending = rows.filter(r => r.status === "pending").length
+
+  return [
+    {
+      id: "total",
+      label: "Total items",
+      value: rows.length,
+      delta: "—",
+      trend: "neutral",
+      href: "#",
+      metricVariant: "hero",
+    },
+    {
+      id: "compliant",
+      label: "Compliant",
+      value: compliant,
+      delta: "—",
+      trend: "neutral",
+      href: "#",
+    },
+    {
+      id: "attention",
+      label: "Due soon",
+      value: dueSoon,
+      delta: dueSoon > 0 ? "!" : "—",
+      trend: dueSoon > 0 ? "up" : "neutral",
+      href: "#",
+    },
+    {
+      id: "risk",
+      label: "Overdue / pending",
+      value: overdue + pending,
+      delta: "—",
+      trend: overdue + pending > 0 ? "up" : "neutral",
+      href: "#",
+    },
+  ]
+}
+
+export function complianceKpiInsight(rows: ComplianceItem[]): MetricInsight {
+  const overdue = rows.filter(r => r.status === "overdue").length
+  const dueSoon = rows.filter(r => r.status === "due_soon").length
+  return {
+    title: "Compliance queue",
+    description:
+      overdue > 0
+        ? `${overdue} item(s) overdue. ${dueSoon} due within 30 days.`
+        : dueSoon > 0
+          ? `${dueSoon} item(s) due soon — review owners and dates.`
+          : "No overdue items in this view.",
+    severity: overdue > 0 ? "warning" : dueSoon > 0 ? "warning" : "info",
+    actionLabel: "Ask Leo",
+  }
+}

package/template/lib/mock/compliance.ts

@@ -0,0 +1,146 @@
+/**
+ * Mock compliance obligations — replace with API data in production.
+ */
+
+export type ComplianceStatus = "compliant" | "due_soon" | "overdue" | "pending"
+
+export interface ComplianceItem extends Record<string, unknown> {
+  id: string
+  title: string
+  category: string
+  status: ComplianceStatus
+  /** MM/DD/YYYY */
+  dueDate: string
+  owner: string
+  /** MM/DD/YYYY */
+  lastReviewed: string
+}
+
+export const COMPLIANCE_ITEMS: ComplianceItem[] = [
+  {
+    id: "1",
+    title: "Annual HIPAA training attestation",
+    category: "HIPAA",
+    status: "compliant",
+    dueDate: "12/31/2026",
+    owner: "Alex Rivera",
+    lastReviewed: "03/01/2026",
+  },
+  {
+    id: "2",
+    title: "OSHA bloodborne pathogen review",
+    category: "OSHA",
+    status: "due_soon",
+    dueDate: "04/10/2026",
+    owner: "Jordan Chen",
+    lastReviewed: "10/15/2025",
+  },
+  {
+    id: "3",
+    title: "Clinical site affiliation agreements",
+    category: "Clinical",
+    status: "pending",
+    dueDate: "05/01/2026",
+    owner: "Sam Patel",
+    lastReviewed: "—",
+  },
+  {
+    id: "4",
+    title: "FERPA student records policy",
+    category: "Privacy",
+    status: "compliant",
+    dueDate: "09/30/2026",
+    owner: "Taylor Brooks",
+    lastReviewed: "02/20/2026",
+  },
+  {
+    id: "5",
+    title: "Background check re-verification",
+    category: "Clinical",
+    status: "overdue",
+    dueDate: "03/01/2026",
+    owner: "Jordan Chen",
+    lastReviewed: "03/01/2025",
+  },
+  {
+    id: "6",
+    title: "Accreditation self-study draft",
+    category: "Accreditation",
+    status: "due_soon",
+    dueDate: "04/22/2026",
+    owner: "Alex Rivera",
+    lastReviewed: "01/10/2026",
+  },
+  {
+    id: "7",
+    title: "Incident response tabletop exercise",
+    category: "HIPAA",
+    status: "pending",
+    dueDate: "06/15/2026",
+    owner: "Sam Patel",
+    lastReviewed: "—",
+  },
+  {
+    id: "8",
+    title: "Emergency preparedness plan",
+    category: "OSHA",
+    status: "compliant",
+    dueDate: "11/01/2026",
+    owner: "Taylor Brooks",
+    lastReviewed: "02/28/2026",
+  },
+  {
+    id: "9",
+    title: "Medication safety competency checklist",
+    category: "Clinical",
+    status: "compliant",
+    dueDate: "08/01/2026",
+    owner: "Alex Rivera",
+    lastReviewed: "03/15/2026",
+  },
+  {
+    id: "10",
+    title: "Data breach notification procedure",
+    category: "Privacy",
+    status: "due_soon",
+    dueDate: "04/05/2026",
+    owner: "Jordan Chen",
+    lastReviewed: "10/01/2025",
+  },
+  {
+    id: "11",
+    title: "LCME / programmatic review evidence",
+    category: "Accreditation",
+    status: "pending",
+    dueDate: "07/30/2026",
+    owner: "Sam Patel",
+    lastReviewed: "—",
+  },
+  {
+    id: "12",
+    title: "Sharps injury log audit",
+    category: "OSHA",
+    status: "overdue",
+    dueDate: "02/20/2026",
+    owner: "Taylor Brooks",
+    lastReviewed: "02/20/2025",
+  },
+  {
+    id: "13",
+    title: "Business associate agreement inventory",
+    category: "HIPAA",
+    status: "compliant",
+    dueDate: "10/15/2026",
+    owner: "Alex Rivera",
+    lastReviewed: "03/01/2026",
+  },
+  {
+    id: "14",
+    title: "Student immunization tracking",
+    category: "Clinical",
+    status: "due_soon",
+    dueDate: "04/18/2026",
+    owner: "Jordan Chen",
+    lastReviewed: "09/01/2025",
+  },
+]

package/template/lib/mock/navigation.tsx

@@ -131,15 +131,6 @@ export const NAV_PRIMARY: NavLinkItem[] = [
       },
     ],
   },
-  {
-    key: "data-list",
-    title: "List hub",
-    url: "/data-list",
-    icon:       <i className="fa-light fa-table" aria-hidden="true" />,
-    iconActive: <i className="fa-solid fa-table" aria-hidden="true" />,
-    badge: 24,
-    secondaryPanel: "list-hub",
-  },
 ]
 
 // ── Documents section ───────────────────────────────────────────────────────

package/template/lib/mock/placements-kpi.ts

@@ -0,0 +1,134 @@
+// ─────────────────────────────────────────────────────────────────────────────
+// List hub — KPI strip + insight (data-list; dashboard view uses row-driven helpers)
+// ─────────────────────────────────────────────────────────────────────────────
+
+import type { MetricInsight, MetricItem } from "@/components/key-metrics"
+import { ALL_PLACEMENTS, type Placement, type Status } from "./placements"
+
+function statusCount(status: Status): number {
+  return ALL_PLACEMENTS.filter((p) => p.status === status).length
+}
+
+/**
+ * KPIs from the current filtered row set (table/list/board/dashboard shared state).
+ * Use for the dashboard view tab; optional for the template metrics strip when you want parity.
+ */
+export function placementKpiMetricsFromRows(rows: Placement[]): MetricItem[] {
+  const total = rows.length
+  const startingWeek = rows.filter(p => p.daysUntilStart >= 0 && p.daysUntilStart <= 7).length
+  const alerts = rows.filter(p => {
+    const r = p.readiness.toLowerCase()
+    return r.includes("risk") || r.includes("blocked")
+  }).length
+  const complete = rows.filter(p => p.compliance === "Complete").length
+  const avgPct = total > 0 ? Math.round((complete / total) * 100) : 0
+
+  return [
+    {
+      id: "total-placements",
+      label: "Total rows",
+      value: total,
+      delta: "—",
+      trend: "neutral",
+      href: "#",
+      metricVariant: "hero",
+    },
+    {
+      id: "starting-week",
+      label: "Due this week",
+      value: startingWeek,
+      delta: "—",
+      trend: startingWeek > 0 ? "up" : "neutral",
+      href: "#",
+    },
+    {
+      id: "compliance-alerts",
+      label: "Attention flags",
+      value: alerts,
+      delta: "—",
+      trend: alerts > 0 ? "up" : "neutral",
+      href: "#",
+    },
+    {
+      id: "avg-compliance",
+      label: "Completeness",
+      value: `${avgPct}%`,
+      delta: "—",
+      trend: "neutral",
+      href: "#",
+    },
+  ]
+}
+
+export function placementKpiInsightFromRows(rows: Placement[]): MetricInsight {
+  const pending = rows.filter(p => p.status === "pending").length
+  const inReview = rows.filter(p => p.status === "under-review").length
+  const n = rows.length
+  return {
+    title: "Queue snapshot",
+    description:
+      n > 0
+        ? `${pending} pending, ${inReview} in review in this view. Clear the queue to keep work moving.`
+        : "No rows match the current filters.",
+    href: "/data-list",
+    severity: pending + inReview > 0 ? "warning" : "info",
+    actionLabel: "Ask Leo",
+  }
+}
+
+/**
+ * KPI row for the list hub metrics strip (demo numbers).
+ */
+export const PLACEMENT_KPI_METRICS: MetricItem[] = [
+  {
+    id: "total-placements",
+    label: "Total rows",
+    value: 50,
+    delta: "+12",
+    trend: "up",
+    href: "#all",
+    metricVariant: "hero",
+  },
+  {
+    id: "starting-week",
+    label: "Due this week",
+    value: 0,
+    delta: "-5",
+    trend: "down",
+    href: "#starting",
+  },
+  {
+    id: "compliance-alerts",
+    label: "Attention flags",
+    value: 23,
+    delta: "+13",
+    trend: "up",
+    href: "#alerts",
+  },
+  {
+    id: "avg-compliance",
+    label: "Completeness",
+    value: "87%",
+    delta: "+3",
+    trend: "up",
+    href: "#compliance",
+  },
+]
+
+/**
+ * Insight copy derived from demo row status counts.
+ */
+export function getPlacementInsight(): MetricInsight {
+  const pending = statusCount("pending")
+  const inReview = statusCount("under-review")
+
+  return {
+    title: "Queue snapshot",
+    description: `${pending} pending, ${inReview} in review. Clear the queue to keep work moving.`,
+    href: "/data-list",
+    severity: "warning",
+    actionLabel: "Ask Leo",
+  }
+}
+
+export const PLACEMENT_KPI_INSIGHT = getPlacementInsight()