@inseefr/lunatic 0.2.63 → 0.3.0-prisme

package/src/tests/utils/to-expose/init-questionnaire/result.json

@@ -0,0 +1,181 @@
+{
+	"components": [
+		{ "id": "1", "componentType": "Sequence", "depth": 1, "page": "1" },
+		{
+			"id": "2",
+			"componentType": "Input",
+			"response": {
+				"name": "inputOk",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "Hello",
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"conditionFilter": { "value": "true" },
+			"depth": 1,
+			"page": "1"
+		},
+		{
+			"id": "3",
+			"componentType": "CheckboxGroup",
+			"bindingDependencies": ["inputOk"],
+			"conditionFilter": {
+				"value": "not(isnull(inputOk))",
+				"bindingDependencies": ["inputOk"]
+			},
+			"page": "2",
+			"responses": [
+				{
+					"response": {
+						"name": "check1",
+						"values": {
+							"PREVIOUS": null,
+							"COLLECTED": true,
+							"FORCED": null,
+							"EDITED": null,
+							"INPUTED": null
+						}
+					}
+				},
+				{
+					"response": {
+						"name": "check2",
+						"values": {
+							"PREVIOUS": null,
+							"COLLECTED": false,
+							"FORCED": true,
+							"EDITED": null,
+							"INPUTED": null
+						}
+					}
+				}
+			],
+			"depth": 1
+		},
+		{
+			"id": "4",
+			"componentType": "Table",
+			"page": "2",
+			"cells": [
+				[
+					{ "label": "label", "depth": 1 },
+					{
+						"componentType": "Radio",
+						"response": {
+							"name": "table11",
+							"values": {
+								"PREVIOUS": null,
+								"COLLECTED": "1",
+								"FORCED": null,
+								"EDITED": null,
+								"INPUTED": null
+							}
+						},
+						"depth": 1
+					}
+				]
+			],
+			"conditionFilter": {
+				"value": "true"
+			},
+			"depth": 1
+		},
+		{
+			"id": "5",
+			"componentType": "RosterForLoop",
+			"page": "2",
+			"components": [
+				{
+					"componentType": "Input",
+					"id": "k3yn2qmr",
+					"response": {
+						"name": "Roster",
+						"values": {
+							"PREVIOUS": [null],
+							"COLLECTED": ["ok"],
+							"FORCED": [null],
+							"EDITED": [null],
+							"INPUTED": [null]
+						}
+					},
+					"page": "2",
+					"depth": 2
+				}
+			],
+			"conditionFilter": {
+				"value": "true"
+			},
+			"depth": 1
+		}
+	],
+	"variables": {
+		"EXTERNAL": { "VAR_EXTERNAL": "Value VAR_EXTERNAL" },
+		"CALCULATED": {
+			"Test": {
+				"expression": "inputMissing || \" world\"",
+				"value": "inputMissing || \" world\"",
+				"bindingDependencies": ["inputMissing"]
+			},
+			"TestOk": {
+				"expression": "inputOk || \" world\"",
+				"value": "Hello world",
+				"bindingDependencies": ["inputOk"]
+			}
+		},
+		"COLLECTED": {
+			"inputOk": {
+				"componentRef": "2",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "Hello",
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"check1": {
+				"componentRef": "3",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": true,
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"check2": {
+				"componentRef": "3",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": false,
+					"FORCED": true,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"table11": {
+				"componentRef": "4",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "1",
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"Roster": {
+				"componentRef": "5",
+				"values": {
+					"PREVIOUS": [null],
+					"COLLECTED": ["ok"],
+					"FORCED": [null],
+					"EDITED": [null],
+					"INPUTED": [null]
+				}
+			}
+		}
+	}
+}

package/src/tests/utils/to-expose/interpret/interpret.spec.js

@@ -0,0 +1,48 @@
+import { interpret } from 'utils/to-expose/interpret';
+
+describe('interpret', () => {
+	describe('interpretVTL', () => {
+		it('should return empty label', () => {
+			expect(interpret()()()).toEqual('');
+		});
+		it('should return empty label', () => {
+			expect(interpret({})()()).toEqual('');
+		});
+		it('should return the same label', () => {
+			expect(interpret([])({})('label')).toEqual('label');
+		});
+		it('should return VTL interpreted label', () => {
+			expect(interpret(['VTL'])({ NAME: 'Mauro' })('"Hello " || NAME')).toEqual(
+				'Hello Mauro'
+			);
+		});
+		it('should return VTL interpreted label with default value', () => {
+			expect(interpret(['VTL'])({ NAME: null })('"Hello " || NAME')).toEqual(
+				'Hello null'
+			);
+		});
+	});
+	describe('interpretVTLMD', () => {
+		it('should return empty label', () => {
+			expect(interpret()()()).toEqual('');
+		});
+		it('should return empty label', () => {
+			expect(interpret({})()()).toEqual('');
+		});
+		it('should return the same label', () => {
+			expect(interpret([])({})('label')).toEqual('label');
+		});
+		it('should return VTL interpreted label', () => {
+			expect(
+				interpret(['VTL', 'MD'])({ NAME: 'Mauro' })('"Hello " || NAME').props
+					.source
+			).toEqual('Hello Mauro');
+		});
+		it('should return VTL interpreted label with default value', () => {
+			expect(
+				interpret(['VTL', 'MD'])({ NAME: null })('"Hello " || NAME').props
+					.source
+			).toEqual('Hello null');
+		});
+	});
+});

package/src/tests/utils/to-expose/state/questionnaire.json

@@ -0,0 +1,61 @@
+{
+	"components": [],
+	"variables": {
+		"EXTERNAL": { "VAR_EXTERNAL": "Value VAR_EXTERNAL" },
+		"CALCULATED": {
+			"VAR_CALCULATED": { "expression": "VTL expression", "value": null }
+		},
+		"COLLECTED": {
+			"input": {
+				"componentRef": "2",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "My input",
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"check1": {
+				"componentRef": "3",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": true,
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"check2": {
+				"componentRef": "3",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": false,
+					"FORCED": true,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"table11": {
+				"componentRef": "4",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "1",
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"table12": {
+				"componentRef": "4",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": null,
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			}
+		}
+	}
+}

package/src/tests/utils/to-expose/state/results.js

@@ -0,0 +1,78 @@
+export const calculatedState = {
+	VAR_CALCULATED: null,
+};
+export const collectedState = {
+	input: {
+		PREVIOUS: null,
+		COLLECTED: 'My input',
+		FORCED: null,
+		EDITED: null,
+		INPUTED: null,
+	},
+	check1: {
+		PREVIOUS: null,
+		COLLECTED: true,
+		FORCED: null,
+		EDITED: null,
+		INPUTED: null,
+	},
+	check2: {
+		PREVIOUS: null,
+		COLLECTED: false,
+		FORCED: true,
+		EDITED: null,
+		INPUTED: null,
+	},
+	table11: {
+		PREVIOUS: null,
+		COLLECTED: '1',
+		FORCED: null,
+		EDITED: null,
+		INPUTED: null,
+	},
+	table12: {
+		PREVIOUS: null,
+		COLLECTED: null,
+		FORCED: null,
+		EDITED: null,
+		INPUTED: null,
+	},
+};
+
+export const externalState = { VAR_EXTERNAL: 'Value VAR_EXTERNAL' };
+
+export const state = {
+	EXTERNAL: externalState,
+	CALCULATED: calculatedState,
+	COLLECTED: collectedState,
+};
+
+export const collectedStateCollected = {
+	input: 'My input',
+	check1: true,
+	check2: false,
+	table11: '1',
+};
+
+export const collectedStateCollectedWithNull = {
+	...collectedStateCollected,
+	table12: null,
+};
+
+export const collectedStateForced = {
+	check2: true,
+};
+
+export const collectedStateForcedWithNull = {
+	input: null,
+	check1: null,
+	check2: true,
+	table11: null,
+	table12: null,
+};
+
+export const bindingsResults = {
+	...collectedStateCollectedWithNull,
+	VAR_CALCULATED: null,
+	...externalState,
+};

package/src/tests/utils/to-expose/state/state.spec.js

@@ -0,0 +1,59 @@
+import {
+	getState,
+	getCollectedState,
+	getCollectedStateByValueType,
+	getBindings,
+} from 'utils/to-expose/state';
+import questionnaire from './questionnaire';
+import * as R from './results';
+
+describe('state', () => {
+	describe('getState', () => {
+		it('should return empty object', () => {
+			expect(getState([])).toEqual({
+				COLLECTED: {},
+				CALCULATED: {},
+				EXTERNAL: {},
+			});
+		});
+		it('should return object', () => {
+			expect(getState(questionnaire)).toEqual(R.state);
+		});
+	});
+	describe('getCollectedState', () => {
+		it('should return empty object', () => {
+			expect(getCollectedState([])).toEqual({});
+		});
+		it('should return object', () => {
+			expect(getCollectedState(questionnaire)).toEqual(R.collectedState);
+		});
+	});
+	describe('getCollectedStateByValueType', () => {
+		it('should return empty object', () => {
+			expect(getCollectedStateByValueType([])('')).toEqual({});
+			expect(getCollectedStateByValueType(questionnaire)('')).toEqual({});
+		});
+		it('should return object', () => {
+			expect(getCollectedStateByValueType(questionnaire)('COLLECTED')).toEqual(
+				R.collectedStateCollected
+			);
+			expect(getCollectedStateByValueType(questionnaire)('FORCED')).toEqual(
+				R.collectedStateForced
+			);
+			expect(
+				getCollectedStateByValueType(questionnaire)('COLLECTED', true)
+			).toEqual(R.collectedStateCollectedWithNull);
+			expect(
+				getCollectedStateByValueType(questionnaire)('FORCED', true)
+			).toEqual(R.collectedStateForcedWithNull);
+		});
+	});
+	describe('getBindings', () => {
+		it('should return empty object', () => {
+			expect(getBindings([])).toEqual({});
+		});
+		it('should return object', () => {
+			expect(getBindings(questionnaire)).toEqual(R.bindingsResults);
+		});
+	});
+});

package/src/utils/components/dragger/dragger.js

@@ -0,0 +1,64 @@
+import React, { useState, useEffect, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import useDocumentAddEventListener from '../../to-expose/hooks/use-document-add-event-listener';
+import './dragger.scss';
+
+function Dragger({ el, children, onDrag }) {
+	const [drag, setDrag] = useState(false);
+	const [delta, setDelta] = useState([undefined, undefined]);
+	const [anchor, setAnchor] = useState([undefined, undefined]);
+
+	function onMouseDown(e) {
+		const { clientX, clientY } = e;
+		setDrag(true);
+		setAnchor([clientX, clientY]);
+		onDrag(true, [clientX, clientY]);
+	}
+
+	function onMouseUp() {
+		setDrag(false);
+		onDrag(false);
+	}
+
+	const onMouseMove = useCallback(
+		function (e) {
+			const { clientX, clientY } = e;
+			if (drag) {
+				const [ax, ay] = anchor;
+				const dx = clientX - ax;
+				const dy = clientY - ay;
+				setAnchor([clientX, clientY]);
+				setDelta([dx, dy]);
+				onDrag(true, [dx, dy]);
+			}
+		},
+		[drag, anchor, onDrag]
+	);
+
+	useEffect(
+		function () {
+			const [dx, dy] = delta;
+			if (el && dx !== undefined && dy !== undefined) {
+				const { top, left } = el.getBoundingClientRect();
+				el.style.top = `${top + dy}px`;
+				el.style.left = `${left + dx}px`;
+			}
+		},
+		[el, delta]
+	);
+
+	useDocumentAddEventListener('mousemove', onMouseMove);
+	useDocumentAddEventListener('mouseup', onMouseUp);
+
+	return (
+		<div className="lunatic-dragger" onMouseDown={onMouseDown}>
+			{children}
+		</div>
+	);
+}
+
+Dragger.propTypes = { el: PropTypes.object, onDrag: PropTypes.func };
+
+Dragger.defaultProps = { el: undefined, onDrag: () => null };
+
+export default Dragger;

package/src/utils/components/dragger/dragger.scss

@@ -0,0 +1,8 @@
+.lunatic-dragger {
+    display: inline-block;;
+    width: 100%;
+    height: 100%;
+    -moz-user-select: -moz-none;
+	-khtml-user-select: none;
+	-webkit-user-select: none;
+}

package/src/utils/components/dragger/index.js

@@ -0,0 +1 @@
+export { default } from './dragger';

package/src/utils/components/fab/fab.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import classnames from 'classnames';
+import PropTypes from 'prop-types';
+import './fab.scss';
+
+function empty() {}
+
+function Fab({
+	className,
+	children,
+	tabIndex,
+	title,
+	onClick,
+	onKeyDown,
+	disabled,
+}) {
+	return (
+		<button
+			className={classnames('lunatic-fab', className)}
+			tabIndex={tabIndex}
+			title={title}
+			onClick={onClick}
+			onKeyDown={onKeyDown}
+			disabled={disabled}
+			aria-label={title}
+		>
+			{children}
+		</button>
+	);
+}
+
+Fab.propTypes = {
+	className: PropTypes.string,
+	tabIndex: PropTypes.string,
+	onClick: PropTypes.func,
+	onKeyDown: PropTypes.func,
+	title: PropTypes.string,
+	disabled: PropTypes.bool,
+};
+
+Fab.defaultProps = {
+	className: undefined,
+	tabIndex: undefined,
+	title: 'Fab',
+	onClick: empty,
+	disabled: false,
+	onKeyDown: empty,
+};
+
+export default Fab;

package/src/utils/components/fab/fab.scss

@@ -0,0 +1,32 @@
+.lunatic-fab {
+	width: 32px;
+	height: 32px;
+	border-radius: 50%;
+	margin: 0;
+	padding: 0;
+	outline: inherit;
+	border: none;
+	background-color: royalblue;
+	box-shadow: 0px 3px 5px -1px rgb(0 0 0 / 20%),
+		0px 6px 10px 0px rgb(0 0 0 / 14%), 0px 1px 18px 0px rgb(0 0 0 / 12%);
+
+	&:hover {
+		cursor: pointer;
+		background-color: navy;
+		transition: background-color 1s;
+	}
+
+	&.mini {
+		width: 18px;
+		height: 18px;
+	}
+
+	&:focus {
+		border: solid 1px black;
+	}
+
+	&:disabled {
+		cursor: default;
+		background-color: darkgray;
+	}
+}

package/src/utils/components/fab/index.js

@@ -0,0 +1 @@
+export { default as Fab } from './fab';

package/src/utils/components/field-wrapper.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import * as U from '../lib';
+import { TooltipResponse } from '../../components/tooltip';
+
+function FieldWrapper({ children, id, management, response }) {
+	return (
+		<div className="field-container">
+			<div className={`${management ? 'field-with-tooltip' : 'field'}`}>
+				{children}
+			</div>
+			{management && (
+				<div className="tooltip">
+					<TooltipResponse
+						id={id}
+						response={U.buildBooleanTooltipResponse(response)}
+					/>
+				</div>
+			)}
+		</div>
+	);
+}
+
+export default FieldWrapper;

package/src/utils/components/is-network/index.js

@@ -0,0 +1 @@
+export { default as IsNetwork } from './is-network';

package/src/utils/components/is-network/is-network.js

@@ -0,0 +1,39 @@
+import React, { useCallback, useState } from 'react';
+import classnames from 'classnames';
+import useOnlineStatus from './use-online-status';
+import NetworkIcon from '../../icons/network.icon';
+
+function getTitle(online) {
+	return `Network ${online ? 'on' : 'off'}`;
+}
+
+function IsNetwork({ notify = () => null, className }) {
+	const [online, setOnline] = useState(window.navigator.onLine);
+	const onlineCallback = useCallback(
+		function () {
+			setOnline(true);
+			notify(true);
+		},
+		[notify]
+	);
+	const offlineCallback = useCallback(
+		function () {
+			setOnline(false);
+			notify(false);
+		},
+		[notify]
+	);
+
+	useOnlineStatus(onlineCallback, offlineCallback);
+
+	return (
+		<div
+			className={classnames('is-network', className, { online })}
+			title={getTitle(online)}
+		>
+			<NetworkIcon />
+		</div>
+	);
+}
+
+export default IsNetwork;