diff --git a/docs/mockups/README.md b/docs/mockups/README.md new file mode 100644 index 000000000..1ee67a75f --- /dev/null +++ b/docs/mockups/README.md @@ -0,0 +1,33 @@ +# UI mockups + +Interactive, self-contained HTML mockups for screens that are not built yet. +Open them directly in a browser (double-click; no server, no network, no +account — fonts and data are embedded). Each one is loaded with **real data +from this repo**, so counts and behaviors are what the real screen will show. + +| Mockup | Issue | Data | +|---|---|---| +| [`search-parameter-editor.html`](search-parameter-editor.html) | [#238](https://github.com/HeliosSoftware/hfs/issues/238) | `data/search-parameters-r4.json` (1,375 params, 135 base types) | +| [`compartment-editor.html`](compartment-editor.html) | [#237](https://github.com/HeliosSoftware/hfs/issues/237) | `crates/fhir-gen/resources/R4/compartmentdefinition-*.json` | + +A static `.png` preview sits next to each file. + +## Relationship to the real screens + +These are **prototypes, not the implementation**. Per the `helios-ui` crate +rules, the real markup lives in `templates/` (Askama), interactions are htmx +fragment swaps served by the server, and read paths work with JavaScript +disabled. The mockups' inline JS stands in for what will be server round +trips — e.g. the compartment route tester becomes a `GET /ui/compartments/test` +fragment, and the SearchParameter table reads the live registry (storage-backed +after #235) instead of an embedded snapshot. + +Style is the crate's design system verbatim: `crates/ui/assets/app.css` tokens, +the vendored Figtree face (inlined as a data URI), and both themes via +`prefers-color-scheme` plus the `data-theme` override — with `--ok` / `--warn` / +`--danger` added as semantic tokens held off the accent hue. + +The SearchParameter editor's validation reflects the registry semantics after +#242: a cross-source `(base, code)` shadow is a supported override (chip: +`overrides spec`), a same-source collision is a blocking `conflict` +(`RegistryError::DuplicateCode`). diff --git a/docs/mockups/compartment-editor.html b/docs/mockups/compartment-editor.html new file mode 100644 index 000000000..3dc95455c --- /dev/null +++ b/docs/mockups/compartment-editor.html @@ -0,0 +1,460 @@ +Compartment Editor — HFS mockup + + +
+
+

Compartment Editor

+ Work in Progress + Mockup for #237 +
+ + +
+

+ The real R4 CompartmentDefinition set from crates/fhir-gen/resources/R4/ — five + definitions, 145 resource types each. Edit metadata and membership, then use the + Tester to answer the question you actually have when a compartment route + misbehaves: is this type in this compartment, via which parameters, and what search does the + server run? Nothing persists. +

+
+ + + +
+ +
+
+
+ + + diff --git a/docs/mockups/compartment-editor.png b/docs/mockups/compartment-editor.png new file mode 100644 index 000000000..8b7c2ee59 Binary files /dev/null and b/docs/mockups/compartment-editor.png differ diff --git a/docs/mockups/search-parameter-editor.html b/docs/mockups/search-parameter-editor.html new file mode 100644 index 000000000..8f6a356d6 --- /dev/null +++ b/docs/mockups/search-parameter-editor.html @@ -0,0 +1,632 @@ +SearchParameter Editor — HFS mockup + + +
+
+

SearchParameter Editor

+ Work in Progress + Mockup for #238 +
+ + +
+

+ Browse the 1,375 parameters of the real R4 registry, filter by base resource + type, and create / override / delete tenant-scoped ones. Embedded spec parameters + are read-only with a Create override path; validation reflects the registry's actual + semantics after #242: a cross-source (base, code) shadow is a supported + overrides spec, a same-source collision is a blocking + conflict (DuplicateCode). Two synthetic + tenant parameters exercise the write paths. Nothing persists. +

+
+ + + +
+
+ Type +
+
+ Source +
+
+
+ + + + + +
CodeTypeBaseExpressionSource
+
+
+
+
+ + +
+ + + diff --git a/docs/mockups/search-parameter-editor.png b/docs/mockups/search-parameter-editor.png new file mode 100644 index 000000000..f3de06415 Binary files /dev/null and b/docs/mockups/search-parameter-editor.png differ