hpo-react-visualizer 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +59 -0
- package/dist/index.cjs +1483 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +244 -0
- package/dist/index.d.ts +244 -0
- package/dist/index.js +1473 -0
- package/dist/index.js.map +1 -0
- package/package.json +60 -0
- package/src/HpoVisualizer.tsx +210 -0
- package/src/OrganSvg.tsx +141 -0
- package/src/__tests__/colorScheme.test.tsx +146 -0
- package/src/__tests__/createStrictColorPalette.test.ts +135 -0
- package/src/__tests__/renderOrder.test.tsx +146 -0
- package/src/__tests__/setup.ts +1 -0
- package/src/constants.ts +158 -0
- package/src/index.ts +34 -0
- package/src/lib/createStrictColorPalette.ts +57 -0
- package/src/lib/index.ts +1 -0
- package/src/svg/Blood.tsx +23 -0
- package/src/svg/Body.tsx +24 -0
- package/src/svg/Breast.tsx +42 -0
- package/src/svg/Cell.tsx +79 -0
- package/src/svg/Constitutional.tsx +29 -0
- package/src/svg/Digestive.tsx +28 -0
- package/src/svg/Ear.tsx +23 -0
- package/src/svg/Endocrine.tsx +32 -0
- package/src/svg/Eye.tsx +23 -0
- package/src/svg/Growth.tsx +23 -0
- package/src/svg/Head.tsx +51 -0
- package/src/svg/Heart.tsx +23 -0
- package/src/svg/Immune.tsx +32 -0
- package/src/svg/Integument.tsx +58 -0
- package/src/svg/Kidney.tsx +41 -0
- package/src/svg/Limbs.tsx +46 -0
- package/src/svg/Lung.tsx +23 -0
- package/src/svg/Metabolism.tsx +41 -0
- package/src/svg/Muscle.tsx +225 -0
- package/src/svg/Neoplasm.tsx +23 -0
- package/src/svg/Nervous.tsx +49 -0
- package/src/svg/Prenatal.tsx +23 -0
- package/src/svg/ThoracicCavity.tsx +28 -0
- package/src/svg/Voice.tsx +23 -0
- package/src/svg/index.ts +54 -0
- package/src/types.ts +162 -0
- package/src/useOrganInteraction.ts +130 -0
package/README.md
ADDED
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
# hpo-react-visualizer
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/hpo-react-visualizer)
|
|
4
|
+
[](https://opensource.org/licenses/MIT)
|
|
5
|
+
|
|
6
|
+
Interactive Human Phenotype Ontology (HPO) organ visualization library for React.
|
|
7
|
+
|
|
8
|
+
## Installation
|
|
9
|
+
|
|
10
|
+
```bash
|
|
11
|
+
# npm
|
|
12
|
+
npm install hpo-react-visualizer
|
|
13
|
+
|
|
14
|
+
# pnpm
|
|
15
|
+
pnpm add hpo-react-visualizer
|
|
16
|
+
|
|
17
|
+
# yarn
|
|
18
|
+
yarn add hpo-react-visualizer
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Usage
|
|
22
|
+
|
|
23
|
+
```tsx
|
|
24
|
+
import { HpoVisualizer } from "hpo-react-visualizer";
|
|
25
|
+
|
|
26
|
+
export function Example() {
|
|
27
|
+
return (
|
|
28
|
+
<HpoVisualizer
|
|
29
|
+
organs={[
|
|
30
|
+
{ id: 'heart', colorName: 'red' },
|
|
31
|
+
{ id: 'lung', colorName: 'blue' },
|
|
32
|
+
{ id: 'brain', colorName: 'purple' },
|
|
33
|
+
]}
|
|
34
|
+
onSelect={(organId) => console.log('Selected:', organId)}
|
|
35
|
+
onHover={(organId) => console.log('Hovered:', organId)}
|
|
36
|
+
/>
|
|
37
|
+
);
|
|
38
|
+
}
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
## Props
|
|
42
|
+
|
|
43
|
+
| Prop | Type | Description |
|
|
44
|
+
|------|------|-------------|
|
|
45
|
+
| `organs` | `OrganConfig[]` | Array of organ configurations with `id` and optional styling |
|
|
46
|
+
| `onSelect` | `(organId: OrganId \| null) => void` | Callback when an organ is selected |
|
|
47
|
+
| `onHover` | `(organId: OrganId \| null) => void` | Callback when an organ is hovered |
|
|
48
|
+
| `selectedOrganId` | `OrganId \| null` | Controlled selected organ ID |
|
|
49
|
+
| `hoveredOrganId` | `OrganId \| null` | Controlled hovered organ ID |
|
|
50
|
+
| `colorPalette` | `ColorPalette` | Custom color palette for organs |
|
|
51
|
+
|
|
52
|
+
## Available Organs
|
|
53
|
+
|
|
54
|
+
The following organ IDs are supported:
|
|
55
|
+
|
|
56
|
+
- `brain`, `eye`, `ear`, `nose`, `teeth`, `throat`
|
|
57
|
+
- `heart`, `lung`, `liver`, `kidney`, `intestine`, `bladder`
|
|
58
|
+
- `integument`, `muscle`, `blood`, `cell`, `metabolism`
|
|
59
|
+
- `endocrine`, `neoplasm`, `immune`, `growth`, `prenatal`
|