Skip to content

Commit 23ad3f3

Browse files
committed
Add lhc-forms
1 parent c640f34 commit 23ad3f3

9 files changed

Lines changed: 1125 additions & 4 deletions

File tree

.github/workflows/gh-pages.yaml

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,9 +88,12 @@ jobs:
8888
- name: Build Aidbox Forms renderers
8989
run: |
9090
pnpm install --frozen-lockfile --dir aidbox-forms/aidbox-forms-builder-custom-renderer/smart-forms-renderer
91+
pnpm install --dir aidbox-forms/aidbox-forms-builder-custom-renderer/lhc-forms-renderer
9192
pnpm --dir aidbox-forms/aidbox-forms-builder-custom-renderer/smart-forms-renderer build
92-
mkdir -p renderers/smart-forms
93+
pnpm --dir aidbox-forms/aidbox-forms-builder-custom-renderer/lhc-forms-renderer build
94+
mkdir -p renderers/smart-forms renderers/lhc-forms
9395
cp -R aidbox-forms/aidbox-forms-builder-custom-renderer/smart-forms-renderer/dist/* renderers/smart-forms/
96+
cp -R aidbox-forms/aidbox-forms-builder-custom-renderer/lhc-forms-renderer/dist/* renderers/lhc-forms/
9497
rm aidbox-integrations/apollo-graphql-federation/README.md
9598
9699
- name: Publish

aidbox-forms/aidbox-forms-builder-custom-renderer/README.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,21 +31,23 @@ cp .env.example .env
3131

3232
### Step 2: Pick a Renderer and Build It (Vite)
3333

34-
This repo includes a renderer page: `smart-forms-renderer`.
34+
This repo includes renderer pages: `smart-forms-renderer` and `lhc-forms-renderer`.
3535

3636
```bash
3737
cd smart-forms-renderer
3838
pnpm install
3939
pnpm build
4040
```
4141

42+
For LHC-Forms, run the same commands from `lhc-forms-renderer`.
43+
4244
If you want to host the renderer elsewhere, repeat the same steps in that environment.
4345

4446
### Step 3: Use Renderer Pages (SDC SWM)
4547

4648
The Forms Builder loads a renderer by URL. The renderer page must implement [SDC SMART Web Messaging](https://github.com/brianpos/sdc-smart-web-messaging) and respond to `postMessage` requests from the host.
4749

48-
Each renderer page in this repo is a Vite app (`index.html` + `src/index.js`) that builds to a static `dist/` folder, mounts the SmartForms renderer, and bridges messages to the host.
50+
Each renderer page in this repo is a Vite app (`index.html` + `src/index.js`) that builds to a static `dist/` folder, mounts a renderer (SmartForms or LHC-Forms), and bridges messages to the host.
4951

5052
### Step 4: Host Your Renderer
5153

@@ -58,7 +60,7 @@ cd smart-forms-renderer
5860
pnpm dev
5961
```
6062

61-
If you are using a different folder, run the same command from there instead.
63+
If you are using a different folder (e.g. `lhc-forms-renderer`), run the same command from there instead.
6264

6365
2) Built files hosted anywhere (for preview):
6466

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
dist
2+
node_modules
3+
*.log
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# lhc-forms-renderer
2+
3+
This package builds a static renderer page (`index.html` + `src/index.js`) that
4+
mounts LHC-Forms and speaks [SDC SMART Web Messaging](https://github.com/brianpos/sdc-smart-web-messaging).
5+
6+
Official renderer site: https://lhncbc.github.io/lforms/
7+
8+
## Run locally
9+
10+
```bash
11+
pnpm install
12+
pnpm dev
13+
```
14+
15+
This renderer loads LHC-Forms via script tags from the official hosted build
16+
(`https://lhncbc.github.io/lforms/`). If you need fully offline hosting, mirror
17+
those assets and update `index.html` accordingly.
18+
19+
Then add the URL (for example `http://localhost:5173`) in Forms Builder
20+
via **Add custom renderer**.
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>LHC-Forms Renderer</title>
7+
<link
8+
rel="stylesheet"
9+
href="https://lhcforms-static.nlm.nih.gov/lforms-versions/38.7.2/webcomponent/styles.css"
10+
/>
11+
<style>
12+
body {
13+
margin: 0;
14+
padding: 8px;
15+
}
16+
</style>
17+
</head>
18+
<body>
19+
<div id="root"></div>
20+
<script src="https://lhcforms-static.nlm.nih.gov/lforms-versions/38.7.2/webcomponent/assets/lib/zone.min.js"></script>
21+
<script src="https://lhcforms-static.nlm.nih.gov/lforms-versions/38.7.2/webcomponent/lhc-forms.js"></script>
22+
<script src="https://lhcforms-static.nlm.nih.gov/lforms-versions/38.7.2/fhir/lformsFHIRAll.min.js"></script>
23+
<script type="module" src="/src/index.js"></script>
24+
</body>
25+
</html>
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"name": "lhc-forms-renderer",
3+
"type": "module",
4+
"private": true,
5+
"devDependencies": {
6+
"vite": "^7.3.1"
7+
},
8+
"scripts": {
9+
"dev": "vite",
10+
"build": "vite build",
11+
"preview": "vite preview"
12+
}
13+
}

0 commit comments

Comments
 (0)