# @artezio/surveybuilder

> FHIR R4 compatibly questionnaire designer/player. If you are not familiar with medical standard FHIR R4 check out the [following refs](#interesting-references).

Latest version **1.0.6** (published 2020-03-31) · MIT license · 0 weekly downloads

## Install

```sh
npm install @artezio/surveybuilder
pnpm add @artezio/surveybuilder
yarn add @artezio/surveybuilder
bun add @artezio/surveybuilder
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.6 |
| Published | 2020-03-31 |
| First published | 2019-12-23 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 324.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 9 |
| Maintainers | daniil_yakovenko, kluiko |

## Links

- npm: https://www.npmjs.com/package/@artezio/surveybuilder
- Repository: https://github.com/Artezio/SURVEYBUILDER
- Homepage: https://github.com/Artezio/SURVEYBUILDER#readme
- Issues: https://github.com/Artezio/SURVEYBUILDER/issues
- npm.io page: https://npm.io/package/@artezio/surveybuilder

## Dependencies (6)

- [@artezio/models](https://npm.io/package/@artezio/models.md) ^0.1.14
- [@artezio/player](https://npm.io/package/@artezio/player.md) ^0.1.11
- [@artezio/designer](https://npm.io/package/@artezio/designer.md) ^0.1.15
- [@artezio/observable](https://npm.io/package/@artezio/observable.md) ^1.0.6
- [@artezio/fhir-converter](https://npm.io/package/@artezio/fhir-converter.md) ^1.0.8
- [@artezio/observable-react](https://npm.io/package/@artezio/observable-react.md) ^1.0.8

## Recent versions

- 1.0.6 (latest) — 2020-03-31
- 1.0.5 — 2019-12-24
- 1.0.4 — 2019-12-23

## README

# **SURVEYBUILDER**
FHIR R4 compatibly questionnaire designer/player. If you are not familiar with medical standard FHIR R4 check out the [following refs](#interesting-references).

Surveybuilder is a set of typescript packages. It presents two react components: "Questionnaire Designer" and "Questionnaire Player". Questionnaire designer is designed to create/update questionnaires. Questionnaire player is designed to answer questionnaires. Components are designed in bootstrap style, so you can easily add bootstrap themes to change there appearance. This components work with our observable models from models package, but this models are fully compatible with FHIR R4 standard. All models can be converted to FHIR R4 standard and back via fhir-converter package. Surveybuilder can be also used in other spheres. To serialize models to another format different from FHIR R4 you must use your custom converter. See how to add your converter in section [below](#applying-custom-converter).

# Interesting references

* HL7 FHIR - http://hl7.org/fhir/
* Questionnaire FHIR model - https://www.hl7.org/fhir/questionnaire.html
* Questionnaire response FHIR model - https://www.hl7.org/fhir/questionnaireresponse.html


# Installation

Using npm:
>$ npm install @artezio/surveybuilder

Using yarn:
>$ yarn add @artezio/surveybuilder

# Usage 

Designer
```TSX
import { render } from 'react-dom';
import { Questionnaire, QuestionnaireDesigner } from '@artezio/surveybuilder';

const questionnaireModel = new Questionnaire();
render(<QuestionnaireDesigner questionnaireModel={questionnaireModel} />, document.getElementById('root'));
```

Player
```TSX
import { render } from 'react-dom';
import { QuestionnaireResponse, QuestionnairePlayer } from '@artezio/surveybuilder';

const questionnaire = { 
    title: 'My Questionnaire', 
    items: [
        { test: 'Do you smoke?', type: 'BOOLEAN' }
    ] 
};
const questionnaireResponseModel = new QuestionnaireResponse(questionnaire);
render(<QuestionnairePlayer questionnaireResponseModel={questionnaireModel} questionnaire={questionnaire} />, document.getElementById('root'));
```

Read instructions how to use packages separately in [section below](#learn-more-about-packages).

# Components diagram

![uml diagram](./doc/Uml-diagram-modules.jpg)

# Learn more about packages
* [designer](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/designer/README.md "@artezio/designer package")
* [player](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/player/README.md "@artezio/player package")
* [models](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/models/README.md "@artezio/models package")
* [fhir-converter](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/fhir-converter/README.md "@artezio/fhir-converter package")
* [observable](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/observable/README.md "@artezio/observable package")
* [observable-react](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/observable-react/README.md)


&nbsp;
# What does it look like
We created demo app to show you how our components can be used.
* ## Demo
    https://surveybuilder.now.sh/

* ## Demo with code in sandbox
    https://codesandbox.io/s/github/Artezio/SURVEYBUILDER/tree/master/demo-app?fontsize=14&hidenavigation=1&theme=dark

* ## Launch on your computer
    First clone the repository. Then you are to download all dependencies, to do it run following command in the root dir(surveybuilder/): 

    > $ yarn

    To find out how to run it follow the link [README.md](https://github.com/Artezio/SURVEYBUILDER/tree/master/demo-app/README.md).


# Applying custom converter

Your custom converter must have 2 objects: questionnaire converter and questionnaire response converter. For example lets consider how they are used with fhir-converter:

```javascript
import { questionnaireConverter } from "@artezio/fhir-converter";

const questionnaireModel = {
    "id": '1',
    "title": 'Questionnaire',
    "items": [
        {
            "id": 'item_1',
            "type": 'CHOICE'
        }
    ]
};
const questionnaireFhirR4Model = questionnaireConverter.fromModel(questionnaireModel);
```

```javascript
import { questionnaireResponseConverter } from "@artezio/fhir-converter";

const responseFhirR4Model = {
    "resourceType": "QuestionnaireResponse",
    "id": "3141",
    "item": [
        {
        "linkId": "1"
        }
    ]
};
const responseModel = questionnaireResponseConverter.toModel(responseFhirR4Model);
```

Each converter must have 2 functions:

| Name | argument | Description | 
| :---- | :-------- | :----- |
| toModel | customModel | This function must receive custom mode and return model in format described below |
| fromModel | model | This function must receive model in format described below and return custom model |

Models interfaces are described in [models package](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/models/README.md "@artezio/models package") in "Detailed description for models" section.

---
_Source: https://npm.io/package/@artezio/surveybuilder · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._