diff --git a/CLAUDE.md b/CLAUDE.md index 6ac9ed2..d729eae 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -6,9 +6,10 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co `scadaproj` is primarily an umbrella/index workspace that aggregates a family of related SCADA / OT / Wonderware / OPC UA "sister projects" that live as **sibling -directories under `~/Desktop/`**. It now also **hosts one piece of source itself** — -the shared [`ZB.MOM.WW.Auth/`](ZB.MOM.WW.Auth/) library (its own nested git repo), the -realized output of the auth component normalization (see [Component normalization](#component-normalization)). +directories under `~/Desktop/`**. It now also **hosts two pieces of source itself** — +the shared [`ZB.MOM.WW.Auth/`](ZB.MOM.WW.Auth/) library and the shared +[`ZB.MOM.WW.Theme/`](ZB.MOM.WW.Theme/) UI kit — both the realized output of their +respective component normalizations (see [Component normalization](#component-normalization)). The point of this file is to give a high-level scan of each sister project — its purpose, location, stack, and primary commands — so a fresh Claude Code session can orient across the whole family without opening each repo first. @@ -117,6 +118,7 @@ each project's **code-verified current state**, and the **gaps** between. See | Component | Status | Goal | Design | Implementation | |---|---|---|---|---| | Auth (login / identity / authz) | Built (lib `0.1.0`) | Shared `ZB.MOM.WW.Auth` lib | [`components/auth/`](components/auth/) | [`ZB.MOM.WW.Auth/`](ZB.MOM.WW.Auth/) | +| UI Theme (layout / tokens / components) | Built (lib `0.1.0`) | Shared `ZB.MOM.WW.Theme` RCL | [`components/ui-theme/`](components/ui-theme/) | [`ZB.MOM.WW.Theme/`](ZB.MOM.WW.Theme/) | The auth component is fully populated: a normalized [`spec`](components/auth/spec/SPEC.md), a proposed [`shared-contract`](components/auth/shared-contract/ZB.MOM.WW.Auth.md), three @@ -132,6 +134,21 @@ The shared library is **built and lives in this repo** at [`ZB.MOM.WW.Auth/`](ZB Build/test from `ZB.MOM.WW.Auth/`: `dotnet test`. Consumer matrix: OtOpcUa → Abstractions+Ldap+AspNetCore; MxAccessGateway & ScadaBridge → all four (ApiKeys not used by OtOpcUa). +The UI-theme component is fully populated: a normalized [`spec`](components/ui-theme/spec/SPEC.md), +a [`design-tokens`](components/ui-theme/spec/DESIGN-TOKENS.md) reference, a +[`shared-contract`](components/ui-theme/shared-contract/ZB.MOM.WW.Theme.md), three +[`current-state`](components/ui-theme/current-state/) docs, and an adoption [`GAPS`](components/ui-theme/GAPS.md) +backlog. Shared = Technical-Light tokens + IBM Plex fonts + side-rail shell + widgets; left +per-project = each app's `site.css` page layout, route content, scoped `.razor.css`. + +The shared RCL is **built and lives in this repo** at [`ZB.MOM.WW.Theme/`](ZB.MOM.WW.Theme/) +(.NET 10 Razor Class Library; single package; 32 bUnit tests; `dotnet pack` → 1 nupkg @ 0.1.0). +The implementation plan is at +[`docs/plans/2026-06-01-zb-mom-ww-theme-shared-library.md`](docs/plans/2026-06-01-zb-mom-ww-theme-shared-library.md). +**Not yet adopted** by the three apps — that's the follow-on tracked in [`components/ui-theme/GAPS.md`](components/ui-theme/GAPS.md). +Build/test from `ZB.MOM.WW.Theme/`: `dotnet test`. Consumer matrix: all three apps consume +the single `ZB.MOM.WW.Theme` package (OtOpcUa AdminUI, MxGateway Server, ScadaBridge Host + CentralUI). + ## Per-project primary commands Run these from inside each project directory (not from `scadaproj`). diff --git a/README.md b/README.md index e721f5d..ac65e54 100644 --- a/README.md +++ b/README.md @@ -17,8 +17,10 @@ it produces. | [`CLAUDE.md`](CLAUDE.md) | High-level index of the sister projects + working guidance | | [`components/`](components/) | Component-normalization framework (per concern: target spec, current state, gaps) | | [`components/auth/`](components/auth/) | First normalized component — login / identity / authorization | -| [`docs/plans/`](docs/plans/) | Implementation plans (e.g. the ZB.MOM.WW.Auth build) | +| [`components/ui-theme/`](components/ui-theme/) | Second normalized component — UI theme / design tokens / layout | +| [`docs/plans/`](docs/plans/) | Implementation plans (e.g. the ZB.MOM.WW.Auth and ZB.MOM.WW.Theme builds) | | [`ZB.MOM.WW.Auth/`](ZB.MOM.WW.Auth/) | **Built shared library** (.NET 10) — the realized output of the auth normalization | +| [`ZB.MOM.WW.Theme/`](ZB.MOM.WW.Theme/) | **Built shared RCL** (.NET 10) — the realized output of the UI-theme normalization | ## The sister projects @@ -52,6 +54,42 @@ The sister repos kept re-implementing the same cross-cutting concerns and drifti | Component | Status | Folder | |---|---|---| | Auth (login / identity / authz) | Built (library 0.1.0); apps not yet adopted | [`components/auth/`](components/auth/) | +| UI Theme (layout / tokens / components) | Built (RCL 0.1.0); apps not yet adopted | [`components/ui-theme/`](components/ui-theme/) | + +## `ZB.MOM.WW.Theme` — the shared UI kit + +The UI-theme component, realized as a single-package .NET 10 Razor Class Library the three +apps can adopt to stop copy-pasting the Technical-Light design system. **Built and tested at +0.1.0; adoption by the apps is the follow-on** (tracked in +[`components/ui-theme/GAPS.md`](components/ui-theme/GAPS.md)). + +| Asset / Component | Purpose | Used by | +|---|---|---| +| `_content/ZB.MOM.WW.Theme/css/theme.css` | Design tokens, IBM Plex typography, Bootstrap overrides | all | +| `_content/ZB.MOM.WW.Theme/css/layout.css` | Side-rail shell layout, nav CSS, chip/card helpers | all | +| `_content/ZB.MOM.WW.Theme/fonts/*.woff2` | IBM Plex Sans 400/600 + Mono 500, vendored | all | +| `ThemeHead`, `ThemeShell`, `BrandBar` | Shell entry point and chassis components | all | +| `NavRailItem`, `NavRailSection` | Rail nav components | all | +| `StatusPill` (`StatusState`) | Inline status chip — replaces per-app `StatusBadge` | all | +| `LoginCard` | Static form-POST sign-in card | OtOpcUa, ScadaBridge (MxGateway when login page added) | +| `TechButton`, `TechCard`, `TechField` | Common controls (Bootstrap 5 wrappers) | all | + +**Consumer matrix:** all three apps consume the single `ZB.MOM.WW.Theme` package — +OtOpcUa `AdminUI`, MxAccessGateway `Server`, ScadaBridge `Host` + `CentralUI`. + +### Build & test + +```bash +cd ZB.MOM.WW.Theme +dotnet build -c Release # 0 warnings (TreatWarningsAsErrors) +dotnet test # 32 bUnit tests +./build/pack.sh # → ./artifacts/ZB.MOM.WW.Theme.0.1.0.nupkg +``` + +Stack: .NET 10 · Razor Class Library · bUnit · xUnit · central package management. +More detail: [`ZB.MOM.WW.Theme/README.md`](ZB.MOM.WW.Theme/README.md). + +--- ## `ZB.MOM.WW.Auth` — the shared library @@ -98,4 +136,7 @@ ZB_LDAP_IT=1 dotnet test # requires a reachable GLAuth (e.g. a sister repo's i - ✅ Auth component normalized (spec + canonical roles + current-state + gaps). - ✅ `ZB.MOM.WW.Auth` shared library built and tested (0.1.0). - ⬜ Adopt `ZB.MOM.WW.Auth` in OtOpcUa, MxAccessGateway, ScadaBridge — [`components/auth/GAPS.md`](components/auth/GAPS.md) (#8). +- ✅ UI-theme component normalized (spec + design tokens + current-state + gaps). +- ✅ `ZB.MOM.WW.Theme` shared UI kit built and tested (0.1.0); apps not yet adopted. +- ⬜ Adopt `ZB.MOM.WW.Theme` in OtOpcUa [low risk], ScadaBridge [med], MxAccessGateway [high risk] — [`components/ui-theme/GAPS.md`](components/ui-theme/GAPS.md). - ⬜ Normalize the next cross-cutting component. diff --git a/components/README.md b/components/README.md index a65fa6b..5dfd0ef 100644 --- a/components/README.md +++ b/components/README.md @@ -18,6 +18,7 @@ specs and analyses that *drive* changes made in the individual repos. | Component | Status | Applies to | Goal | Folder | |---|---|---|---|---| | Auth (login / identity / authz) | Draft | OtOpcUa, MxAccessGateway, ScadaBridge | Path to shared code (`ZB.MOM.WW.Auth`) | [`auth/`](auth/) | +| UI Theme (layout / tokens / components) | Draft | OtOpcUa, MxAccessGateway, ScadaBridge | Path to shared code (`ZB.MOM.WW.Theme`) | [`ui-theme/`](ui-theme/) | > Add a row when you start normalizing a new component. Status: `Draft` → `Reviewed` → `Adopting` → `Converged`.