@exxatdesignux/ui 0.0.6 → 0.0.7

package/template/lib/mock/question-bank.ts

@@ -0,0 +1,142 @@
+/**
+ * Mock question bank items — replace with API in production.
+ */
+
+export type QuestionBankStatus = "published" | "draft" | "in_review"
+export type QuestionBankType = "multiple_choice" | "true_false" | "short_answer"
+export type QuestionBankDifficulty = "easy" | "medium" | "hard"
+
+export interface QuestionBankItem extends Record<string, unknown> {
+  id: string
+  /** Short preview / stem */
+  stem: string
+  topic: string
+  type: QuestionBankType
+  difficulty: QuestionBankDifficulty
+  status: QuestionBankStatus
+  author: string
+  updatedAt: string
+}
+
+export const QUESTION_BANK_ITEMS: QuestionBankItem[] = [
+  {
+    id: "q1",
+    stem: "Which nerve roots contribute to the brachial plexus?",
+    topic: "Anatomy",
+    type: "multiple_choice",
+    difficulty: "medium",
+    status: "published",
+    author: "Dr. Chen",
+    updatedAt: "2026-03-28",
+  },
+  {
+    id: "q2",
+    stem: "Document baseline vitals before administering contrast.",
+    topic: "Clinical skills",
+    type: "true_false",
+    difficulty: "easy",
+    status: "published",
+    author: "Jordan Lee",
+    updatedAt: "2026-03-27",
+  },
+  {
+    id: "q3",
+    stem: "List three red flags for cauda equina syndrome.",
+    topic: "Neurology",
+    type: "short_answer",
+    difficulty: "hard",
+    status: "in_review",
+    author: "Alex Rivera",
+    updatedAt: "2026-03-26",
+  },
+  {
+    id: "q4",
+    stem: "HIPAA permits disclosure to family without consent when…",
+    topic: "Ethics & law",
+    type: "multiple_choice",
+    difficulty: "medium",
+    status: "draft",
+    author: "Sam Patel",
+    updatedAt: "2026-03-25",
+  },
+  {
+    id: "q5",
+    stem: "Calculate BMI given height and weight (metric).",
+    topic: "Assessment",
+    type: "short_answer",
+    difficulty: "easy",
+    status: "published",
+    author: "Dr. Chen",
+    updatedAt: "2026-03-24",
+  },
+  {
+    id: "q6",
+    stem: "Sterile field must be prepared before which step?",
+    topic: "Infection control",
+    type: "multiple_choice",
+    difficulty: "medium",
+    status: "published",
+    author: "Morgan Lee",
+    updatedAt: "2026-03-23",
+  },
+  {
+    id: "q7",
+    stem: "SOAP note: subjective section documents patient-reported data only.",
+    topic: "Documentation",
+    type: "true_false",
+    difficulty: "easy",
+    status: "draft",
+    author: "Casey Nguyen",
+    updatedAt: "2026-03-22",
+  },
+  {
+    id: "q8",
+    stem: "Contrast MRI safety screening includes renal function when…",
+    topic: "Radiology",
+    type: "multiple_choice",
+    difficulty: "hard",
+    status: "in_review",
+    author: "Riley Johnson",
+    updatedAt: "2026-03-21",
+  },
+  {
+    id: "q9",
+    stem: "Therapeutic communication: reflect feelings before offering solutions.",
+    topic: "Communication",
+    type: "true_false",
+    difficulty: "medium",
+    status: "published",
+    author: "Quinn Martinez",
+    updatedAt: "2026-03-20",
+  },
+  {
+    id: "q10",
+    stem: "Pediatric dose calculation uses body surface area when…",
+    topic: "Pharmacology",
+    type: "short_answer",
+    difficulty: "hard",
+    status: "published",
+    author: "Dr. Chen",
+    updatedAt: "2026-03-19",
+  },
+  {
+    id: "q11",
+    stem: "Fall risk assessment should be repeated after medication changes.",
+    topic: "Safety",
+    type: "true_false",
+    difficulty: "easy",
+    status: "draft",
+    author: "Taylor Brooks",
+    updatedAt: "2026-03-18",
+  },
+  {
+    id: "q12",
+    stem: "Describe hand hygiene moments (WHO five moments).",
+    topic: "Infection control",
+    type: "short_answer",
+    difficulty: "medium",
+    status: "in_review",
+    author: "Jordan Lee",
+    updatedAt: "2026-03-17",
+  },
+]

package/template/lib/mock/sites-directory.ts

@@ -0,0 +1,16 @@
+import { NAV_PRIMARY } from "@/lib/mock/navigation"
+
+/** Clinical site row — same source as legacy Sites nav children. */
+export interface SiteDirectoryRow extends Record<string, unknown> {
+  id: string
+  name: string
+  url: string
+}
+
+export const SITES_DIRECTORY: SiteDirectoryRow[] = (NAV_PRIMARY.find(i => i.key === "sites")?.children ?? []).map(
+  c => ({
+    id: c.key,
+    name: c.title,
+    url: c.url,
+  }),
+)

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

@@ -0,0 +1,25 @@
+import type { MetricInsight, MetricItem } from "@/components/key-metrics"
+
+export function sitesKpiMetrics(count: number): MetricItem[] {
+  const active = Math.max(0, count - 3)
+  const pending = Math.min(count, 3)
+  return [
+    {
+      id: "total-sites",
+      label: "Total sites",
+      value: count,
+      delta: "+4",
+      trend: "up",
+      href: "#",
+      metricVariant: "hero",
+    },
+    { id: "active", label: "Active", value: active, delta: "+3", trend: "up", href: "#" },
+    { id: "pending", label: "Pending", value: pending, delta: "—", trend: "neutral", href: "#" },
+    { id: "archived", label: "Archived", value: 0, delta: "—", trend: "neutral", href: "#" },
+  ]
+}
+
+export const SITES_KPI_INSIGHT: MetricInsight = {
+  title: "4 new sites added this month",
+  description: "Most recent additions are affiliated with the Nursing program.",
+}

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

@@ -0,0 +1,60 @@
+// ─────────────────────────────────────────────────────────────────────────────
+// Team page — KPI strip (mirrors placements-kpi pattern for primary list template)
+// ─────────────────────────────────────────────────────────────────────────────
+
+import type { MetricInsight, MetricItem } from "@/components/key-metrics"
+import type { TeamMember } from "@/lib/mock/team"
+
+export function teamKpiMetrics(members: TeamMember[]): MetricItem[] {
+  const active = members.filter(m => m.status === "active").length
+  const away = members.filter(m => m.status === "away").length
+  const invited = members.filter(m => m.status === "invited").length
+  return [
+    {
+      id: "total-members",
+      label: "Total members",
+      value: members.length,
+      delta: "+2",
+      trend: "up",
+      href: "#",
+      metricVariant: "hero",
+    },
+    {
+      id: "active",
+      label: "Active",
+      value: active,
+      delta: "—",
+      trend: "neutral",
+      href: "#",
+    },
+    {
+      id: "away",
+      label: "Away",
+      value: away,
+      delta: "—",
+      trend: "neutral",
+      href: "#",
+    },
+    {
+      id: "invited",
+      label: "Invited",
+      value: invited,
+      delta: invited > 0 ? "+1" : "—",
+      trend: invited > 0 ? "up" : "neutral",
+      href: "#",
+    },
+  ]
+}
+
+export function teamKpiInsight(members: TeamMember[]): MetricInsight {
+  const invited = members.filter(m => m.status === "invited").length
+  return {
+    title: "Pending invites",
+    description:
+      invited > 0
+        ? `${invited} invitation(s) outstanding. Resend or revoke from the roster.`
+        : "No pending invitations.",
+    severity: invited > 0 ? "warning" : "info",
+    actionLabel: "Ask Leo",
+  }
+}

package/template/lib/mock/team.ts

@@ -0,0 +1,118 @@
+/**
+ * Mock team directory — replace with API data in production.
+ * Kept at 11+ rows so the Team page demonstrates search / sort / properties toolbar (see data-views-pattern.md).
+ */
+
+export interface TeamMember extends Record<string, unknown> {
+  id: string
+  name: string
+  role: string
+  email: string
+  /** US 10-digit storage (filter uses masked entry; matching normalizes digits). */
+  phone: string
+  initials: string
+  /** Shown as a subtle status chip */
+  status: "active" | "away" | "invited"
+}
+
+export const TEAM_MEMBERS: TeamMember[] = [
+  {
+    id: "1",
+    name: "Alex Rivera",
+    role: "Program Administrator",
+    email: "alex.rivera@school.edu",
+    phone: "5550100001",
+    initials: "AR",
+    status: "active",
+  },
+  {
+    id: "2",
+    name: "Jordan Chen",
+    role: "Clinical Coordinator",
+    email: "jordan.chen@school.edu",
+    phone: "5550100002",
+    initials: "JC",
+    status: "active",
+  },
+  {
+    id: "3",
+    name: "Sam Patel",
+    role: "Field Education",
+    email: "sam.patel@school.edu",
+    phone: "5550100003",
+    initials: "SP",
+    status: "away",
+  },
+  {
+    id: "4",
+    name: "Taylor Brooks",
+    role: "Viewer",
+    email: "taylor.brooks@school.edu",
+    phone: "5550100004",
+    initials: "TB",
+    status: "invited",
+  },
+  {
+    id: "5",
+    name: "Morgan Lee",
+    role: "Program Administrator",
+    email: "morgan.lee@school.edu",
+    phone: "5550100005",
+    initials: "ML",
+    status: "active",
+  },
+  {
+    id: "6",
+    name: "Casey Nguyen",
+    role: "Clinical Coordinator",
+    email: "casey.nguyen@school.edu",
+    phone: "5550100006",
+    initials: "CN",
+    status: "active",
+  },
+  {
+    id: "7",
+    name: "Riley Johnson",
+    role: "Field Education",
+    email: "riley.johnson@school.edu",
+    phone: "5550100007",
+    initials: "RJ",
+    status: "away",
+  },
+  {
+    id: "8",
+    name: "Quinn Martinez",
+    role: "Viewer",
+    email: "quinn.martinez@school.edu",
+    phone: "5550100008",
+    initials: "QM",
+    status: "active",
+  },
+  {
+    id: "9",
+    name: "Jamie Wilson",
+    role: "Program Administrator",
+    email: "jamie.wilson@school.edu",
+    phone: "5550100009",
+    initials: "JW",
+    status: "invited",
+  },
+  {
+    id: "10",
+    name: "Drew Anderson",
+    role: "Clinical Coordinator",
+    email: "drew.anderson@school.edu",
+    phone: "5550100010",
+    initials: "DA",
+    status: "active",
+  },
+  {
+    id: "11",
+    name: "Skyler Kim",
+    role: "Field Education",
+    email: "skyler.kim@school.edu",
+    phone: "5550100011",
+    initials: "SK",
+    status: "active",
+  },
+]

package/template/lib/motion-ui.ts

@@ -0,0 +1,17 @@
+/**
+ * Motion presets — same spirit as Animate UI (open component distribution:
+ * https://animate-ui.com/docs — copy/tweak in-repo, Motion + Tailwind).
+ */
+export const motionEaseOut = [0.22, 1, 0.36, 1] as const
+
+/** App chrome (sidebar header stack, etc.) — `motion/react` */
+export const motionHeaderEnter = {
+  duration: 0.22,
+  ease: motionEaseOut,
+} as const
+
+/**
+ * Sheet / Vaul drawer timing — implemented in `@exxatdesignux/ui` `Sheet` + `Drawer`
+ * (`duration-300 ease-out`, shorter slide distance) so all panels animate consistently.
+ */
+export const motionSheetMs = 300

package/template/lib/placement-board-card-layout.ts

@@ -0,0 +1,79 @@
+/**
+ * Board placement card layout — which fields appear by default per lifecycle tab,
+ * which keys are grouped into header / site / schedule blocks, and helpers to
+ * resolve “active” fields when a column exists only on some tabs (e.g. status).
+ */
+
+import type { ColumnDef } from "@/components/data-table/types"
+import type { Placement } from "@/lib/mock/placements"
+
+/** Mirrors PlacementLifecycleTabId without importing data-list-table (avoids circular imports). */
+export type BoardCardLifecycleTabId = "all" | "upcoming" | "ongoing" | "completed"
+
+/** Default card fields per tab — intersected with visible table columns (except header-only rules below). */
+export const DEFAULT_BOARD_CARD_KEYS: Record<BoardCardLifecycleTabId, readonly string[]> = {
+  all: ["student", "specialization", "site", "status", "internship", "start", "duration"],
+  upcoming: ["student", "specialization", "site", "status", "internship", "start", "daysUntilStart"],
+  ongoing: ["student", "specialization", "site", "status", "internship", "progressWeeksDone", "endDate"],
+  completed: ["student", "specialization", "site", "status", "internship", "completionDate", "finalStatus"],
+}
+
+export function scheduleKeysForTab(tab: BoardCardLifecycleTabId): readonly string[] {
+  switch (tab) {
+    case "all":
+      return ["start", "duration"]
+    case "upcoming":
+      return ["start", "daysUntilStart"]
+    case "ongoing":
+      return ["progressWeeksDone", "endDate"]
+    case "completed":
+      return ["completionDate", "finalStatus"]
+    default:
+      return []
+  }
+}
+
+/** Keys rendered in the title/header cluster (not as icon rows). Status + New only — not internship/specialization. */
+export function consumedKeysForCard(tab: BoardCardLifecycleTabId): Set<string> {
+  const schedule = scheduleKeysForTab(tab)
+  return new Set<string>(["student", "status", "site", ...schedule])
+}
+
+export function isKeyInBoardWhitelist(tab: BoardCardLifecycleTabId, key: string): boolean {
+  return DEFAULT_BOARD_CARD_KEYS[tab].includes(key)
+}
+
+/**
+ * Field is allowed on the card when it is in the tab whitelist, not hidden, and either
+ * the column exists in this view and is visible, or the column does not exist (e.g. status on Upcoming)
+ * — then we still show from row data for header/summary fields.
+ */
+export function isBoardFieldActive<Row extends Placement>(
+  key: string,
+  tab: BoardCardLifecycleTabId,
+  hiddenColKeys: Set<string>,
+  boardColumns: ColumnDef<Row>[],
+): boolean {
+  if (hiddenColKeys.has(key)) return false
+  if (!isKeyInBoardWhitelist(tab, key)) return false
+  const hasCol = boardColumns.some(c => c.key === key)
+  if (!hasCol) return true
+  return boardColumns.some(c => c.key === key && !hiddenColKeys.has(c.key))
+}
+
+/** Visible columns that pass whitelist (intersection). Order follows boardColumns. */
+export function filterColumnsForBoardCard<Row extends Placement>(
+  tab: BoardCardLifecycleTabId,
+  visibleCols: ColumnDef<Row>[],
+): ColumnDef<Row>[] {
+  return visibleCols.filter(c => isKeyInBoardWhitelist(tab, c.key))
+}
+
+/** Body rows only: columns not consumed by title, header badges, site block, or schedule block. */
+export function remainingBodyColumns<Row extends Placement>(
+  tab: BoardCardLifecycleTabId,
+  cardCols: ColumnDef<Row>[],
+): ColumnDef<Row>[] {
+  const consumed = consumedKeysForCard(tab)
+  return cardCols.filter(c => !consumed.has(c.key))
+}

package/template/lib/placement-lifecycle.ts

@@ -0,0 +1,5 @@
+/**
+ * Placements lifecycle tab ids — shared by data list page, table shell, and layout helpers
+ * without importing column definitions.
+ */
+export type PlacementLifecycleTabId = "all" | "upcoming" | "ongoing" | "completed"

package/template/lib/row-height.ts

@@ -0,0 +1,10 @@
+/**
+ * Table row density — shared by Properties drawer tiles and useTableState.
+ */
+export type RowHeight = "compact" | "default" | "comfortable"
+
+export const ROW_HEIGHT_TILES: readonly { value: RowHeight; label: string; icon: string }[] = [
+  { value: "compact",     label: "Compact",     icon: "fa-down-to-line" },
+  { value: "default",     label: "Default",     icon: "fa-arrows-up-down" },
+  { value: "comfortable", label: "Comfortable", icon: "fa-up-to-line" },
+]

package/template/lib/stock-portrait.ts

@@ -0,0 +1,11 @@
+/**
+ * Deterministic stock portrait URLs via randomuser.me static assets (no API key).
+ * Same seed → same image across reloads.
+ */
+export function stockPortraitUrl(seed: string): string {
+  let h = 0
+  for (let i = 0; i < seed.length; i++) h = (h * 31 + seed.charCodeAt(i)) >>> 0
+  const n = h % 99
+  const gender = h % 2 === 0 ? "men" : "women"
+  return `https://randomuser.me/api/portraits/${gender}/${n}.jpg`
+}

package/template/lib/utils.test.ts

@@ -0,0 +1,13 @@
+import { describe, expect, it } from "vitest"
+
+import { cn } from "./utils"
+
+describe("cn", () => {
+  it("merges class names and drops falsy entries", () => {
+    expect(cn("a", false && "b", "c")).toBe("a c")
+  })
+
+  it("merges tailwind conflicts toward last wins", () => {
+    expect(cn("p-2", "p-4")).toBe("p-4")
+  })
+})

package/template/lib/utils.ts

@@ -0,0 +1 @@
+export { cn } from "../../../packages/ui/src/lib/utils"

package/template/next.config.mjs

@@ -0,0 +1,15 @@
+import bundleAnalyzer from "@next/bundle-analyzer"
+
+const withBundleAnalyzer = bundleAnalyzer({
+  enabled: process.env.ANALYZE === "true",
+})
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  transpilePackages: ["@exxatdesignux/ui"],
+  experimental: {
+    optimizePackageImports: ["lucide-react", "recharts", "@exxatdesignux/ui"],
+  },
+}
+
+export default withBundleAnalyzer(nextConfig)

package/template/package.json

@@ -0,0 +1,83 @@
+{
+  "name": "my-exxat-app",
+  "version": "0.0.1",
+  "description": "Starter app built on @exxatdesignux/ui design system.",
+  "type": "module",
+  "private": true,
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "dev": "next dev --turbopack",
+    "dev:3001": "next dev --turbopack -p 3001",
+    "dev:3005": "next dev --turbopack -p 3005",
+    "dev:daemon": "pm2 start ecosystem.config.cjs",
+    "dev:daemon:stop": "pm2 stop exxat-ds",
+    "dev:daemon:restart": "pm2 restart exxat-ds",
+    "dev:daemon:delete": "pm2 delete exxat-ds",
+    "dev:daemon:logs": "pm2 logs exxat-ds --lines 80",
+    "dev:daemon:status": "pm2 status",
+    "build": "next build",
+    "analyze": "ANALYZE=true next build",
+    "start": "next start",
+    "lint": "eslint",
+    "format": "prettier --write \"**/*.{ts,tsx}\"",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "fa:subset-audit": "node scripts/fontawesome-subset-audit.mjs"
+  },
+  "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@exxatdesignux/ui": "latest",
+    "@hookform/resolvers": "^5.2.2",
+    "@tabler/icons-react": "^3.41.1",
+    "@tanstack/react-table": "^8.21.3",
+    "@tanstack/react-virtual": "^3.13.23",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^1.1.1",
+    "lucide-react": "^0.577.0",
+    "motion": "^12.38.0",
+    "next": "16.1.7",
+    "next-themes": "^0.4.6",
+    "radix-ui": "^1.4.3",
+    "react": "^19.2.4",
+    "react-day-picker": "^9.14.0",
+    "react-dom": "^19.2.4",
+    "react-hook-form": "^7.72.0",
+    "recharts": "^2.15.4",
+    "shadcn": "^4.1.0",
+    "sonner": "^2.0.7",
+    "tailwind-merge": "^3.5.0",
+    "tw-animate-css": "^1.4.0",
+    "vaul": "^1.1.2",
+    "zod": "^4.3.6",
+    "zustand": "^5.0.12"
+  },
+  "devDependencies": {
+    "@eslint/eslintrc": "^3",
+    "@next/bundle-analyzer": "^16.2.1",
+    "@tailwindcss/postcss": "^4.2.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.0",
+    "@types/node": "^25.5.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^4.7.0",
+    "eslint": "^9.39.4",
+    "eslint-config-next": "16.1.7",
+    "jsdom": "^26.1.0",
+    "pm2": "^6.0.14",
+    "postcss": "^8",
+    "prettier": "^3.8.1",
+    "prettier-plugin-tailwindcss": "^0.7.2",
+    "tailwindcss": "^4.2.1",
+    "typescript": "^5.9.3",
+    "vite": "^6.4.1",
+    "vitest": "^3.2.4"
+  }
+}

package/template/postcss.config.mjs

@@ -0,0 +1,8 @@
+/** @type {import('postcss-load-config').Config} */
+const config = {
+  plugins: {
+    "@tailwindcss/postcss": {},
+  },
+}
+
+export default config