@exxatdesignux/ui 0.2.19 → 0.4.0

package/template/docs/voice-and-tone.md

@@ -0,0 +1,262 @@
+# Exxat DS — Voice and tone
+
+> The single biggest driver of "this feels like one product" — or "this feels random" — is **copy**. Empty states, errors, buttons, banners, validation, labels. This doc is the binding reference for all of it.
+>
+> **Audience:** designers writing copy, engineers shipping strings, AI agents drafting UI text. Reviewed in PR alongside `.cursor/rules/exxat-accessibility.mdc`.
+
+---
+
+## 1. Voice (the constant)
+
+Exxat copy is **clear, direct, and respectful**. We talk to grown professionals (faculty, admins) and to students. We never:
+
+- talk down (no "Oops!" / "Whoops" / "Uh-oh"),
+- over-celebrate ("Awesome!" / "Great job!" / 🎉),
+- guilt-trip ("You haven't… yet" / "Don't forget!"),
+- hide the cause behind metaphor ("Something went wrong" with no detail),
+- shout (sentence case everywhere; ALL CAPS only for system status acronyms).
+
+We **always**:
+
+- name the **thing**: the entity (placement, site, student), the action (Save, Invite, Export), the outcome (saved, sent, downloaded),
+- say what **changed** or what **the user can do next**,
+- use **present tense** (`Saving` / `Saved` / `Try again`), not past-aspirational (`We've saved your changes!`),
+- use **active voice** (`Exxat couldn't save the placement.` not `The placement could not be saved.`).
+
+---
+
+## 2. Tone (the variable)
+
+Tone shifts by surface. Same voice, different temperature.
+
+| Surface | Tone | Example |
+|---|---|---|
+| Primary action label | Imperative, 1–3 words | "Save", "Invite people", "Export" |
+| Empty state (filtered) | Helpful, names the filter | "No placements match the current filters. Clear them to see all 247." |
+| Empty state (no data ever) | Welcoming, names the next step | "No placements yet. Add your first one to get started." |
+| Inline validation | Neutral, says the rule | "Use the format MM/DD/YYYY." |
+| Banner (informational) | Calm, explains why | "Read-only — this term has ended." |
+| Banner (warning) | Direct, says the consequence | "Saving will overwrite 3 students' assignments." |
+| Banner (error) | Honest, names the failure + next step | "Exxat couldn't reach the placement service. Try again, or check your network." |
+| Dialog (destructive confirm) | Specific, names the object | "Delete placement P-2026-014? This cannot be undone." |
+| Microcopy (helper, hints) | Brief, format-only | "Out of 4.0", "MM/DD/YYYY" |
+
+---
+
+## 3. Buttons
+
+| Pattern | Use | Example |
+|---|---|---|
+| **Sentence case** | Always | `Save`, `Invite people`, `Export selection` |
+| **Title case** | Never | ~~`Save Changes`~~ → `Save changes` |
+| **Verb-first imperative** | Primary actions | `Save`, `Send invite`, `Create placement`, `Download CSV` |
+| **No "Please"** | The button is the request | ~~`Please save`~~ → `Save` |
+| **Don't repeat the field name** | Inline context is enough | ~~`Save changes to placement`~~ → `Save` |
+| **"Cancel" not "Discard"** | Cancel returns to a safe state; Discard is only for destructive draft loss | dialog primary = `Save changes`; cancel = `Cancel` |
+| **Loading verb** | When in-flight, swap to `…` form, preserve width | `Save` → `Saving…` |
+| **Disabled tooltip** | Always say why | "Add at least one collaborator first." |
+
+### Don't
+
+| ❌ Don't | ✅ Do |
+|---|---|
+| `Click here` | `Open placement` |
+| `OK` | `Save`, `Got it`, `Continue` (the actual outcome) |
+| `Submit` | `Send invite`, `Save changes`, `Create placement` |
+| `Yes` / `No` in destructive dialogs | `Delete placement`, `Cancel` |
+| `Loading…` for >2 s with no detail | `Loading placements…` (name the thing) |
+
+---
+
+## 4. Empty states
+
+There are **three** kinds. The copy is different for each.
+
+### 4a. Filter-empty ("zero matches")
+
+The dataset has rows; the active filters hide all of them. Tell the user the filters are responsible and offer to clear them.
+
+```
+No placements match the current filters.
+[Clear filters]
+```
+
+Rules:
+
+- Name the entity ("placements", not "items").
+- Mention "the current filters" — not just "no results".
+- Surface a **Clear filters** action if the toolbar has any filters applied.
+- If the search box is the only filter, the message becomes `No placements match "<query>".` (quote the query exactly).
+
+### 4b. True-empty ("no data ever")
+
+The dataset is empty for this user / scope. Tell them what to do next.
+
+```
+No placements yet.
+Add your first one to start tracking student rotations.
+[New placement]
+```
+
+Rules:
+
+- One-line headline + one-line context.
+- The CTA is the same imperative used elsewhere in the app — don't invent "Start now" for an empty state.
+- If creation requires a precursor ("Add at least one site first"), say so and link to the precursor.
+
+### 4c. Permission-empty ("not allowed to see")
+
+The user can't see anything because of access. Don't show counts; don't suggest creating.
+
+```
+You don't have access to this hub.
+Ask a coordinator to invite you with Viewer or higher access.
+```
+
+Rules:
+
+- Name the access level required.
+- Don't show row counts the user can't see.
+- Don't expose the existence of restricted records by mentioning "0 of N hidden".
+
+---
+
+## 5. Errors
+
+Errors must answer three questions: **What happened? Why? What can the user do?**
+
+| Element | Required? | Example |
+|---|---|---|
+| Subject | required | `Exxat couldn't save the placement.` |
+| Cause | when knowable | `The site was deleted while you were editing.` |
+| Next step | required | `Choose another site or refresh.` |
+
+### Don't
+
+- `Something went wrong.` — every word is empty. Replace with the subject + cause.
+- `Error 500: Internal Server Error.` — leak the trace ID to logs, not the user. User-facing: "Exxat had a problem. Try again in a moment."
+- Toasts for errors. Use `SystemBanner` (route-level) or inline `FormMessage` (field-level). See [`exxat-no-toast.mdc`](../../../.cursor/rules/exxat-no-toast.mdc).
+
+### Field-level (`FormMessage`)
+
+Match the rule, not the field name. Keep under 60 chars.
+
+| Rule | Message |
+|---|---|
+| Required | `This is required.` |
+| Format (date) | `Use MM/DD/YYYY.` |
+| Format (phone) | `Use +1 (555) 555-0100.` |
+| Range (number) | `Enter a number between 0 and 4.0.` |
+| Unique | `That ID is already in use.` |
+| Server | `Exxat couldn't save this field. Try again.` |
+
+---
+
+## 6. Banners
+
+We use **persistent banners** (not toasts) for all product feedback. See [`exxat-no-toast.mdc`](../../../.cursor/rules/exxat-no-toast.mdc) and `LocalBanner` / `SystemBanner` in `packages/ui`.
+
+| Variant | Use | Lead with |
+|---|---|---|
+| `info` | Read-only / scope notice / "you're viewing X" | The fact: "Read-only — this term has ended." |
+| `success` | Confirmed state change (long-lived; toasts forbidden) | The outcome: "Invite sent to 3 collaborators." |
+| `warning` | Action will cause consequence | The consequence: "Saving will overwrite 3 students' assignments." |
+| `error` | Recoverable failure | The subject + next step: "Exxat couldn't reach the placement service. Try again." |
+| `destructive` | Pending destructive change | The object + reversibility: "This term will be archived in 7 days. Restore now to keep it." |
+
+Rules:
+
+- One banner per region. If two compete, the higher-severity wins.
+- Pair a banner with an **action** when there's something the user can do (`[Restore]`, `[Try again]`, `[Open log]`).
+- No exclamation marks. The variant color carries the tone.
+
+---
+
+## 7. Status badges
+
+Status labels live in [`lib/list-status-badges.ts`](../lib/list-status-badges.ts) and are shared across every surface (table, board card, list row). Don't fork labels per page.
+
+| Type | Conventions | Example |
+|---|---|---|
+| Lifecycle | Title case, single word where possible | `Active`, `Draft`, `Archived`, `Pending` |
+| Outcome | Past-tense verb when an action completed | `Approved`, `Rejected`, `Sent`, `Skipped` |
+| Risk | Plain language, no jargon | `On track`, `At risk`, `Blocked` |
+| Mandatory pairing | Color **AND** icon (WCAG 1.4.1 — never color alone) | green check, amber triangle, red circle-x |
+
+Never: `OK`, `N/A`, `?` as a status label. Show the actual lifecycle state or `Unknown` with a tooltip describing how to resolve it.
+
+---
+
+## 8. KPI copy (the highest-stakes copy in the product)
+
+KPIs read top-down: **label → value → trend chip → description**. The reader is scanning, not reading. Each line earns its place.
+
+| Field | Rule | Example |
+|---|---|---|
+| `label` | Sentence case noun phrase. ≤ 24 chars. No "Total" prefix (the value is total by default). | `Active placements`, `New invites`, `Compliance issues` |
+| `value` | The number. Use `tabular-nums`. Round to a sensible precision. Suffix unit (`%`, `hrs`) without space when natural. | `247`, `12 %`, `38 hrs` |
+| `delta` | The **count** of change. Empty (`""` or `0`) hides the chip entirely. Never prose. | `+12`, `-3`, `+8 %` |
+| `description` | The caption beneath the value row. Prose explaining what the number is or how it splits. Never the delta. | `vs last week`, `across 4 sites`, `left + right` |
+
+See [`exxat-kpi-trends.mdc`](../../../.cursor/rules/exxat-kpi-trends.mdc) for the trend-polarity rules (when up means bad, set `trendPolarity: "lower_is_better"`).
+
+### Don't
+
+- `Total: 247` — drop "Total".
+- `247 placements` in `value` — put `247` in `value`, `placements` is in `label`.
+- `+5 (up 12 % from last week)` in `delta` — `delta = "+5"`, `description = "vs last week"`.
+
+---
+
+## 9. Form labels and helper text
+
+| Element | Rule | Example |
+|---|---|---|
+| Label | Sentence case, no colon, no "*" — pair `*` decoration with `aria-required` only. | `Date of birth` |
+| Required marker | Visible `*` (`aria-hidden`), programmatic `aria-required="true"`. | `Date of birth *` |
+| Helper text | Persistent, format-first. Use `FormDescription`. Never placeholder-only. | `MM/DD/YYYY` |
+| Placeholder | May mirror the format. Never the sole carrier. | `MM/DD/YYYY` |
+| Inline error | Replaces helper while active. Match the rule, not the field name. | `Use MM/DD/YYYY.` |
+| Unit in label vs description | Units go in description when context-dependent (`Out of 4.0` under "GPA"), in label when fixed (`Hours per week`). | — |
+
+See [`exxat-accessibility.mdc`](../../../.cursor/rules/exxat-accessibility.mdc) §"Form fields — format hints MUST be persistent".
+
+---
+
+## 10. Dates, times, numbers
+
+| Type | Format | Example |
+|---|---|---|
+| Date (UI) | Locale-aware, defaults to `MM/DD/YYYY` for en-US | `12/14/2025` |
+| Date range | Same format, en-dash with hair-thin spaces (or hyphen-minus in mono) | `12/14/2025 – 12/20/2025` |
+| Time | 12-hour with am/pm in lowercase | `2:30 pm` |
+| Relative time | Use sparingly; pair with absolute on hover/tooltip | `Updated 3 hours ago` (tip: `12/15/2025, 11:14 am`) |
+| Numbers | `tabular-nums`. Use thousands separator (`12,547`) for ≥ 4 digits | `12,547` |
+| Currency | Symbol-first, no space (`$1,200.00`) | `$1,200.00` |
+| Percent | No space (`12 %` is wrong, use `12%`) | `12%` |
+| Duration | Short form (`38 hrs`, `2 wks`) | `38 hrs` |
+
+---
+
+## 11. Reviewer checklist (paste into PRs that touch copy)
+
+- [ ] Sentence case (not title case) everywhere.
+- [ ] No `Click here`, `Submit`, `OK`, `Loading…` without a noun.
+- [ ] No toasts; banners or inline status instead.
+- [ ] Empty state names the entity and surfaces a next action or "Clear filters".
+- [ ] Errors answer: what / why / what now.
+- [ ] Status labels come from `lib/list-status-badges.ts`, not new strings.
+- [ ] KPI `delta` is a count; KPI `description` is prose. Polarity matches the metric.
+- [ ] Form helper text is `FormDescription`, not placeholder-only.
+- [ ] No exclamation marks outside `success` banners (and even those rarely).
+- [ ] No emoji unless explicitly approved for that surface.
+
+---
+
+## See also
+
+- [`HANDBOOK.md`](./HANDBOOK.md) — where this fits in the docs map
+- [`glossary.md`](./glossary.md) — vocabulary
+- [`.cursor/rules/exxat-no-toast.mdc`](../../../.cursor/rules/exxat-no-toast.mdc) — why banners, not toasts
+- [`.cursor/rules/exxat-kpi-trends.mdc`](../../../.cursor/rules/exxat-kpi-trends.mdc) — KPI delta vs description
+- [`.cursor/rules/exxat-accessibility.mdc`](../../../.cursor/rules/exxat-accessibility.mdc) — format-hint persistence rule

package/template/eslint.config.mjs

@@ -1,6 +1,7 @@
 import { defineConfig, globalIgnores } from "eslint/config";
 import nextVitals from "eslint-config-next/core-web-vitals";
 import nextTs from "eslint-config-next/typescript";
+import exxatDs from "@exxatdesignux/eslint-plugin";
 
 const eslintConfig = defineConfig([
   ...nextVitals,
@@ -31,6 +32,32 @@ const eslintConfig = defineConfig([
       ],
     },
   },
+  // -------------------------------------------------------------------------
+  // Exxat DS guardrails (@exxatdesignux/eslint-plugin — packages/eslint-plugin-exxat-ds).
+  // - no-hex-color:           token discipline (no hex literals in JSX/style)
+  // - no-deprecated-tokens:   reads @exxatdesignux/ui tokens/hooks-index.json
+  // - no-sonner-toast:        enforces .cursor/rules/exxat-no-toast.mdc
+  // - no-slds-classes:        enforces .cursor/rules/exxat-no-slds-leakage.mdc
+  // - no-lightning-elements:  enforces .cursor/rules/exxat-no-slds-leakage.mdc
+  // -------------------------------------------------------------------------
+  {
+    files: ["app/**/*.{ts,tsx}", "components/**/*.{ts,tsx}", "lib/**/*.{ts,tsx}", "hooks/**/*.{ts,tsx}", "contexts/**/*.{ts,tsx}", "stores/**/*.{ts,tsx}"],
+    plugins: { "exxat-ds": exxatDs },
+    rules: {
+      "exxat-ds/no-hex-color": [
+        "warn",
+        {
+          // Files where hex is legitimately needed (CSS variable definitions,
+          // OS theme-color meta, etc.) are intentionally excluded by path.
+          allowFiles: ["/app/globals.css", "/packages/ui/src/globals.css", "/lib/theme-color", "/lib/windows-contrast-theme"],
+        },
+      ],
+      "exxat-ds/no-deprecated-tokens": "error",
+      "exxat-ds/no-sonner-toast": "error",
+      "exxat-ds/no-slds-classes": "error",
+      "exxat-ds/no-lightning-elements": "error",
+    },
+  },
 ]);
 
 export default eslintConfig;

package/template/hooks/use-secondary-panel-hub-nav.ts

@@ -3,18 +3,18 @@
 import * as React from "react"
 import { usePathname, useRouter, useSearchParams } from "next/navigation"
 
-import { useSecondaryPanel } from "@/components/secondary-panel"
-import { QUESTION_BANK_HUB_FIND_PATH, QUESTION_BANK_LIBRARY_PATH, QUESTION_BANK_LIST_PATH } from "@/lib/question-bank-nav"
+import { useSecondaryPanel } from "@/components/sidebar"
+import { LIBRARY_HUB_FIND_PATH, LIBRARY_ALL_PATH, LIBRARY_LIST_PATH } from "@/lib/library-nav"
 
 function rewriteLibraryCanonicalToDedicatedSurface(pathname: string, nextHref: string, hash: string): string {
-  if (!nextHref.startsWith(QUESTION_BANK_LIBRARY_PATH)) return `${nextHref}${hash}`
-  const tail = nextHref.slice(QUESTION_BANK_LIBRARY_PATH.length)
-  if (pathname === QUESTION_BANK_LIST_PATH) return `${QUESTION_BANK_LIST_PATH}${tail}${hash}`
-  if (pathname === QUESTION_BANK_HUB_FIND_PATH) return `${QUESTION_BANK_HUB_FIND_PATH}${tail}${hash}`
+  if (!nextHref.startsWith(LIBRARY_ALL_PATH)) return `${nextHref}${hash}`
+  const tail = nextHref.slice(LIBRARY_ALL_PATH.length)
+  if (pathname === LIBRARY_LIST_PATH) return `${LIBRARY_LIST_PATH}${tail}${hash}`
+  if (pathname === LIBRARY_HUB_FIND_PATH) return `${LIBRARY_HUB_FIND_PATH}${tail}${hash}`
   return `${nextHref}${hash}`
 }
 
-function questionBankSearchParamsEqual(a: URLSearchParams, b: URLSearchParams): boolean {
+function librarySearchParamsEqual(a: URLSearchParams, b: URLSearchParams): boolean {
   const keys = new Set([...a.keys(), ...b.keys()])
   for (const k of keys) {
     const av = a.getAll(k).join("\u0000")
@@ -25,11 +25,11 @@ function questionBankSearchParamsEqual(a: URLSearchParams, b: URLSearchParams):
 }
 
 export interface UseSecondaryPanelHubNavOptions<TNav> {
-  /** Primary hub pathname (e.g. `/question-bank/library`). */
+  /** Primary hub pathname (e.g. `/library/all`). */
   hubPathname: string
   /** When set, these pathnames are treated as the same hub (e.g. library + list search surface). */
   hubPathnames?: readonly string[]
-  /** `PANELS` / `useAutoPanel` id (e.g. `question-bank`). */
+  /** `PANELS` / `useAutoPanel` id (e.g. `library`). */
   panelId: string
   parseNav: (searchParams: URLSearchParams) => TNav
   /** When non-null, the hub URL is rewritten (keeps the current hash). */
@@ -79,7 +79,7 @@ export function useSecondaryPanelHubNav<TNav>({
     if (!nextHref) return
     const hash = typeof window !== "undefined" ? window.location.hash : ""
     let target = `${nextHref}${hash}`
-    if (pathname === QUESTION_BANK_LIST_PATH || pathname === QUESTION_BANK_HUB_FIND_PATH) {
+    if (pathname === LIBRARY_LIST_PATH || pathname === LIBRARY_HUB_FIND_PATH) {
       target = rewriteLibraryCanonicalToDedicatedSurface(pathname, nextHref, hash)
     }
     try {
@@ -87,7 +87,7 @@ export function useSecondaryPanelHubNav<TNav>({
       const u = new URL(target, origin)
       const want = u.searchParams
       const cur = new URLSearchParams(searchParamsKey)
-      if (u.pathname === pathname && questionBankSearchParamsEqual(want, cur)) return
+      if (u.pathname === pathname && librarySearchParamsEqual(want, cur)) return
     } catch {
       /* ignore parse errors — fall through to replace */
     }

package/template/lib/ask-leo-route-context.ts

@@ -55,18 +55,6 @@ export function getAskLeoRouteContext(pathname: string | null): AskLeoRouteConte
     }
   }
 
-  if (pathname.startsWith("/examples")) {
-    return {
-      title: "Patterns",
-      description: "Entry points for reusable shells and demos.",
-      suggestions: [
-        "Where is the list hub implemented?",
-        "How is the command palette wired?",
-        "What is the sidebar + content layout pattern?",
-      ],
-    }
-  }
-
   if (pathname.startsWith("/settings")) {
     return {
       title: "Settings",
@@ -78,25 +66,25 @@ export function getAskLeoRouteContext(pathname: string | null): AskLeoRouteConte
     }
   }
 
-  if (pathname.startsWith("/question-bank/library") || pathname.startsWith("/question-bank/list") || pathname.startsWith("/question-bank/find")) {
+  if (pathname.startsWith("/library/all") || pathname.startsWith("/library/list") || pathname.startsWith("/library/find")) {
     return {
       title: "Question library",
       description: "Browse folders, views, and mock assessment items.",
       suggestions: [
-        "Summarize questions in the active folder scope",
-        "Suggest folders for a new pediatrics module",
+        "Summarize items in the active folder scope",
+        "Suggest folders for a new library section",
         "How do panel and tree views relate to the same dataset?",
       ],
     }
   }
 
-  if (pathname.startsWith("/question-bank")) {
+  if (pathname.startsWith("/library")) {
     return {
-      title: "Question bank",
+      title: "Library",
       description: "Search in plain language, draft items with AI, or open the full library.",
       suggestions: [
         "Draft a multiple-choice question on clinical reasoning",
-        "Outline a new question bank for a course module",
+        "Outline a new library for a course module",
         "Rewrite this stem for clarity and bias-free wording",
       ],
     }

package/template/lib/coach-mark-registry.ts

@@ -49,20 +49,4 @@ export const COACH_MARK_FLOWS: CoachMarkFlowDef[] = [
     pageUrl: "/data-list",
     stepCount: 1,
   },
-  {
-    id: "team-dashboard-customize",
-    name: "Customize dashboard (Team pattern)",
-    description: "Same toolbar pattern as the list hub — Edit layout for a Data dashboard tab.",
-    page: "Examples",
-    pageUrl: "/examples",
-    stepCount: 1,
-  },
-  {
-    id: "compliance-dashboard-customize",
-    name: "Customize dashboard (Compliance pattern)",
-    description: "Same toolbar pattern as the list hub — Edit layout for a Data dashboard tab.",
-    page: "Examples",
-    pageUrl: "/examples",
-    stepCount: 1,
-  },
 ]

package/template/lib/command-menu-config.ts

@@ -88,27 +88,19 @@ const STATIC_COMMAND_GROUPS: CommandMenuGroup[] = [
     items: [
       { id: "nav-dashboard", icon: "fa-light fa-grid-2", label: "Dashboard", href: "/dashboard" },
       {
-        id: "nav-examples",
-        icon: "fa-light fa-layer-group",
-        label: "Patterns",
-        href: "/examples",
-        keywords: "examples gallery showcase",
-      },
-      {
-        id: "nav-question-bank",
+        id: "nav-library",
         icon: "fa-light fa-books",
-        label: "Question bank",
-        href: "/question-bank",
+        label: "Library",
+        href: "/library",
         keywords: "search ai create ask leo discovery hub",
       },
       {
-        id: "nav-question-bank-library",
+        id: "nav-library-all",
         icon: "fa-light fa-table-list",
         label: "Question library",
-        href: "/question-bank/library",
+        href: "/library/all",
         keywords: "folders assessment items tree panel table",
       },
-      { id: "nav-data-list", icon: "fa-light fa-table", label: "List hub", href: "/data-list" },
       { id: "nav-settings", icon: "fa-light fa-gear", label: "Settings", href: "/settings" },
       { id: "nav-help", icon: "fa-light fa-circle-question", label: "Help", href: "/help" },
     ],

package/template/lib/command-menu-search-data.ts

@@ -1,31 +1,16 @@
 /**
  * Searchable ⌘K rows from mock/API data. Wire new sources here — not in `command-menu-config.ts`.
+ *
+ * In this demo app the global ⌘K palette ships with route + Ask Leo entries only.
+ * When a consumer adds a real data source (e.g. a Students hub), build a
+ * `CommandMenuGroup` here with `searchOnly: true` so the palette stays
+ * lightweight on open and the items only surface once the user types.
  */
 
-import type { CommandMenuGroup, CommandMenuItem } from "@/lib/command-menu-config"
-import { LIST_HUB_DIRECTORY } from "@/lib/mock/list-hub-directory"
+import type { CommandMenuGroup } from "@/lib/command-menu-config"
 
-function sampleRowSearchItems(): CommandMenuItem[] {
-  return LIST_HUB_DIRECTORY.map(row => ({
-    id: `sample-row-${row.id}`,
-    label: row.title,
-    icon: "fa-light fa-calendar-days",
-    href: "/data-list",
-    keywords: [row.id, row.title, row.category, row.eventDate, "list hub", "calendar"]
-      .filter(Boolean)
-      .join(" "),
-  }))
-}
-
-/** Built once at module load — avoids remapping rows on every layout render. */
-export const COMMAND_MENU_SEARCH_DATA_GROUPS: CommandMenuGroup[] = [
-  {
-    id: "sample-rows",
-    heading: "Demo rows",
-    items: sampleRowSearchItems(),
-    searchOnly: true,
-  },
-]
+/** Demo rows for hubs — none in this app. Real apps populate this from their primary entity. */
+export const COMMAND_MENU_SEARCH_DATA_GROUPS: CommandMenuGroup[] = []
 
 export function getCommandMenuSearchDataGroups(): CommandMenuGroup[] {
   return COMMAND_MENU_SEARCH_DATA_GROUPS

package/template/lib/conditional-rule-match.ts

@@ -1,97 +1,6 @@
-import type { ConditionalRule, FilterTextMask } from "@/components/table-properties/types"
-
-export type ConditionalColumnHint = {
-  key: string
-  sortKey?: string
-  filter?: { type?: string; textMask?: FilterTextMask }
-}
-
-function rowValueForRule<T extends Record<string, unknown>>(
-  row: T,
-  rule: ConditionalRule,
-  columns?: ConditionalColumnHint[],
-): string {
-  const col = columns?.find(c => c.key === rule.fieldKey)
-  const dataKey = (col?.sortKey ?? rule.fieldKey) as keyof T
-  return String(row[dataKey] ?? "")
-}
-
-function ruleHasActiveValues(
-  rule: ConditionalRule,
-  columns?: ConditionalColumnHint[],
-): boolean {
-  if (rule.values.length === 0) return false
-  const col = columns?.find(c => c.key === rule.fieldKey)
-  if (col?.filter?.type === "text") return (rule.values[0] ?? "").trim().length > 0
-  return true
-}
-
-function conditionalTextMatches(
-  cellVal: string,
-  needle: string,
-  op: "contains" | "not_contains",
-  textMask: FilterTextMask | undefined,
-) {
-  const v = cellVal.trim()
-  const n = needle.trim()
-  if (!n) return op === "not_contains"
-  if (textMask === "phone" || textMask === "zip") {
-    const nd = n.replace(/\D/g, "")
-    const hay = v.replace(/\D/g, "")
-    if (!nd) return op === "not_contains"
-    const hit = hay.includes(nd)
-    return op === "contains" ? hit : !hit
-  }
-  const hit = v.toLowerCase().includes(n.toLowerCase())
-  return op === "contains" ? hit : !hit
-}
-
-/** Whether a conditional rule matches a row (same logic as DataTable cells). */
-export function conditionalRuleMatchesRow<T extends Record<string, unknown>>(
-  row: T,
-  rule: ConditionalRule,
-  columns?: ConditionalColumnHint[],
-): boolean {
-  if (!ruleHasActiveValues(rule, columns)) return false
-  const v = rowValueForRule(row, rule, columns).trim()
-  const col = columns?.find(c => c.key === rule.fieldKey)
-  const textMask = col?.filter?.type === "text" ? col.filter.textMask : undefined
-  switch (rule.operator) {
-    case "is":
-      return rule.values.includes(v)
-    case "is_not":
-      return !rule.values.includes(v)
-    case "contains":
-      return rule.values.some(val => conditionalTextMatches(v, val, "contains", textMask))
-    case "not_contains":
-      return !rule.values.some(val => conditionalTextMatches(v, val, "contains", textMask))
-    default:
-      return false
-  }
-}
-
-/** First matching conditional rule background for a row (list/board row tint). */
-export function getConditionalRowBackground<T extends Record<string, unknown>>(
-  row: T,
-  rules: ConditionalRule[] | undefined,
-  columns?: ConditionalColumnHint[],
-): string | undefined {
-  if (!rules?.length) return undefined
-  for (const rule of rules) {
-    if (conditionalRuleMatchesRow(row, rule, columns)) return rule.bgColor
-  }
-  return undefined
-}
-
-/** Background for one table cell from conditional rules on that column. */
-export function getConditionalCellBackground<T extends Record<string, unknown>>(
-  row: T,
-  colKey: string,
-  rules: ConditionalRule[] | undefined,
-  columns?: ConditionalColumnHint[],
-): string | undefined {
-  if (!rules?.length) return undefined
-  const rule = rules.find(r => r.fieldKey === colKey)
-  if (!rule || !conditionalRuleMatchesRow(row, rule, columns)) return undefined
-  return rule.bgColor
-}
+export {
+  conditionalRuleMatchesRow,
+  getConditionalRowBackground,
+  getConditionalCellBackground,
+  type ConditionalColumnHint,
+} from "@exxatdesignux/ui/lib/conditional-rule-match"

package/template/lib/data-list-display-options.ts

@@ -1,49 +1 @@
-/**
- * Display options for Data list (table / board / calendar / etc.) — shared across view types
- * so hide/show preferences persist when switching views.
- */
-
-export type BoardLineCount = 1 | 2 | 3
-
-/** Right-hand calendar body: month grid vs week rows (scroll stack uses the same months). */
-export type CalendarMainView = "month" | "week"
-
-export interface DataListDisplayOptions {
-  /**
-   * Board swimlanes: dataset field (table column key) used to split cards into columns.
-   * Each hub passes allowed keys via `TablePropertiesDrawer` `boardGroupByColumnOptions`.
-   */
-  boardGroupByColumnKey: string
-  /** Max lines for primary text blocks on board cards */
-  boardLineCount: BoardLineCount
-  /** Page title block */
-  showViewTitle: boolean
-  /** Board: phase column titles + descriptions. Table: column header row. */
-  showColumnLabels: boolean
-  /** Board: “N cards” under each phase column */
-  showBoardColumnCounts: boolean
-  boardNewCardAbove: boolean
-  /** Toolbar search control (table view) */
-  showToolbarSearch: boolean
-  /** Calendar: left column — mini month, event list, layout tiles */
-  showCalendarSummaryPanel: boolean
-  /** Calendar: main scrollable body layout */
-  calendarMainView: CalendarMainView
-}
-
-export const DEFAULT_DATA_LIST_DISPLAY_OPTIONS: DataListDisplayOptions = {
-  boardGroupByColumnKey: "topic",
-  boardLineCount: 2,
-  showViewTitle: true,
-  showColumnLabels: true,
-  showBoardColumnCounts: true,
-  boardNewCardAbove: true,
-  showToolbarSearch: true,
-  showCalendarSummaryPanel: false,
-  calendarMainView: "month",
-}
-
-export const CALENDAR_MAIN_VIEW_TILES = [
-  { value: "month" as const, label: "Month", icon: "fa-calendar-days" },
-  { value: "week" as const, label: "Week", icon: "fa-calendar-week" },
-]
+export * from "@exxatdesignux/ui/lib/data-list-display-options"