@inseefr/lunatic 0.3.4-experimental → 0.3.7-experimental

package/src/components/filter-description/component.js

@@ -1,42 +1,42 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { interpret } from '../../utils/to-expose';
-import { buildStyleObject } from '../../utils/lib';
-
-const FilterDescription = ({
-	id,
-	label,
-	filterDescription,
-	features,
-	bindings,
-	style,
-	logFunction,
-}) =>
-	filterDescription ? (
-		<div
-			id={`filter-description-${id}`}
-			aria-label={`filter-description`}
-			className="filter-description-lunatic"
-			style={buildStyleObject(style)}
-		>
-			{interpret(features, logFunction)(bindings)(label)}
-		</div>
-	) : null;
-
-FilterDescription.defaultProps = {
-	filterDescription: false,
-	features: [],
-	bindings: {},
-	style: {},
-};
-
-FilterDescription.propTypes = {
-	id: PropTypes.string.isRequired,
-	label: PropTypes.string.isRequired,
-	filterDescription: PropTypes.bool,
-	features: PropTypes.arrayOf(PropTypes.string),
-	bindings: PropTypes.object,
-	style: PropTypes.object,
-};
-
-export default FilterDescription;
+import React from 'react';
+import PropTypes from 'prop-types';
+import { interpret } from '../../utils/to-expose';
+import { buildStyleObject } from '../../utils/lib';
+
+const FilterDescription = ({
+	id,
+	label,
+	filterDescription,
+	features,
+	bindings,
+	style,
+	logFunction,
+}) =>
+	filterDescription ? (
+		<div
+			id={`filter-description-${id}`}
+			aria-label={`filter-description`}
+			className="filter-description-lunatic"
+			style={buildStyleObject(style)}
+		>
+			{interpret(features, logFunction)(bindings)(label)}
+		</div>
+	) : null;
+
+FilterDescription.defaultProps = {
+	filterDescription: false,
+	features: [],
+	bindings: {},
+	style: {},
+};
+
+FilterDescription.propTypes = {
+	id: PropTypes.string.isRequired,
+	label: PropTypes.string.isRequired,
+	filterDescription: PropTypes.bool,
+	features: PropTypes.arrayOf(PropTypes.string),
+	bindings: PropTypes.object,
+	style: PropTypes.object,
+};
+
+export default FilterDescription;

package/src/components/icon/component.js

@@ -1,33 +1,33 @@
-import React from 'react';
-import {
-	CheckboxChecked,
-	CheckboxUnchecked,
-	RadioChecked,
-	RadioUnchecked,
-} from './assets';
-import './icon.scss';
-
-const Content = ({ type, checked }) => {
-	if (type === 'radio') {
-		if (checked) return <RadioChecked />;
-		return <RadioUnchecked />;
-	}
-	if (type === 'checkbox') {
-		if (checked) return <CheckboxChecked />;
-		return <CheckboxUnchecked />;
-	}
-	return null;
-};
-
-const Icon = ({ type, checked, disabled, children }) => (
-	<>
-		<span className={`list-icon-wrapper`}>
-			<span className={`list-icon ${disabled ? 'list-icon-disabled' : ''}`}>
-				<Content type={type} checked={checked} />
-			</span>
-			{children}
-		</span>
-	</>
-);
-
-export default Icon;
+import React from 'react';
+import {
+	CheckboxChecked,
+	CheckboxUnchecked,
+	RadioChecked,
+	RadioUnchecked,
+} from './assets';
+import './icon.scss';
+
+const Content = ({ type, checked }) => {
+	if (type === 'radio') {
+		if (checked) return <RadioChecked />;
+		return <RadioUnchecked />;
+	}
+	if (type === 'checkbox') {
+		if (checked) return <CheckboxChecked />;
+		return <CheckboxUnchecked />;
+	}
+	return null;
+};
+
+const Icon = ({ type, checked, disabled, children }) => (
+	<>
+		<span className={`list-icon-wrapper`}>
+			<span className={`list-icon ${disabled ? 'list-icon-disabled' : ''}`}>
+				<Content type={type} checked={checked} />
+			</span>
+			{children}
+		</span>
+	</>
+);
+
+export default Icon;

package/src/components/index.js

@@ -1,3 +1,5 @@
+import 'array-flat-polyfill';
+
 export * from './components';
 export { default as Table } from './table';
 export * from '../utils/to-expose';

package/src/components/input/index.js

@@ -1,2 +1,2 @@
-export { default as Input } from './input';
-export { default as InputNumber } from './input-number';
+export { default as Input } from './input';
+export { default as InputNumber } from './input-number';

package/src/components/loop/index.js

@@ -1 +1 @@
-export { default } from './wrapper';
+export { default } from './wrapper';

package/src/components/loop-constructor/wrapper/body-component.js

@@ -23,6 +23,7 @@ const BodyComponent = ({
 		components,
 		headers,
 	});
+	const featuresWithoutMD = features.filter((f) => f !== 'MD');
 	if (componentType === 'RosterForLoop')
 		return (
 			<table id={`table-${mainId}`} className="table-lunatic">
@@ -38,10 +39,16 @@ const BodyComponent = ({
 									componentType,
 									id,
 									rowNumber,
+									conditionFilter,
 									...componentProps
 								} = component;
 								const localBindings =
 									U.buildBindingsForDeeperComponents(rowNumber)(bindings);
+								if (conditionFilter) {
+									const { value = '' } = conditionFilter;
+									if (!interpret(featuresWithoutMD)(localBindings)(value))
+										return null;
+								}
 								if (componentType) {
 									const Component = lunatic[componentType];
 									return (
@@ -101,7 +108,12 @@ const BodyComponent = ({
 						const localBindings =
 							U.buildBindingsForDeeperComponents(i)(bindings);
 						// ensure to have only N-1 missingResponse
-						const { missingResponse } = componentProps;
+						const { missingResponse, conditionFilter } = componentProps;
+						if (conditionFilter) {
+							const { value = '' } = conditionFilter;
+							if (!interpret(featuresWithoutMD)(localBindings)(value))
+								return null;
+						}
 						return (
 							<div className="block-component" key={`${id}-row-${i}`}>
 								<Component

package/src/components/radio/index.js

@@ -1 +1 @@
-export { default } from './component';
+export { default } from './component';

package/src/components/sequence/index.js

@@ -1 +1 @@
-export { default } from './component';
+export { default } from './component';

package/src/components/subsequence/index.js

@@ -1 +1 @@
-export { default } from './component';
+export { default } from './component';

package/src/components/suggester/check-store.js

@@ -1,70 +1,70 @@
-import React, { useEffect, useState, useCallback } from 'react';
-import { openDb, getEntity } from '../../utils/idb-tools';
-import { CONSTANTES } from '../../utils/store-tools';
-
-function CheckStore({ storeName, version, setStore, children }) {
-	const [ready, setReady] = useState(0);
-	const [refresh, setRefresh] = useState(false);
-	const [disabled, setDisabled] = useState(false);
-
-	const checkStore = useCallback(
-		async function () {
-			try {
-				const db = await openDb(storeName, version);
-				const info = await getEntity(db, CONSTANTES.STORE_INFO_NAME, storeName);
-
-				if (db && info) {
-					setReady(200);
-					setStore(info);
-				}
-			} catch (e) {
-				setReady(400);
-			}
-		},
-		[storeName, version, setStore]
-	);
-
-	useEffect(
-		function () {
-			checkStore();
-		},
-		[checkStore]
-	);
-
-	useEffect(
-		function () {
-			if (refresh) {
-				setRefresh(false);
-				setDisabled(true);
-				async function go() {
-					await checkStore();
-					setDisabled(false);
-				}
-
-				go();
-			}
-		},
-		[refresh]
-	);
-
-	if (ready === 0) {
-		return (
-			<div className="lunatic-suggester-in-progress">
-				Le store {storeName} est en cour de chargement.
-			</div>
-		);
-	}
-	if (ready === 200) {
-		return children;
-	}
-	return (
-		<div className="lunatic-suggester-unvailable">
-			Le store {storeName} n'est pas disponible.
-			<button disabled={disabled} onClick={() => setRefresh(true)}>
-				Refresh
-			</button>
-		</div>
-	);
-}
-
-export default CheckStore;
+import React, { useEffect, useState, useCallback } from 'react';
+import { openDb, getEntity } from '../../utils/idb-tools';
+import { CONSTANTES } from '../../utils/store-tools';
+
+function CheckStore({ storeName, version, setStore, children }) {
+	const [ready, setReady] = useState(0);
+	const [refresh, setRefresh] = useState(false);
+	const [disabled, setDisabled] = useState(false);
+
+	const checkStore = useCallback(
+		async function () {
+			try {
+				const db = await openDb(storeName, version);
+				const info = await getEntity(db, CONSTANTES.STORE_INFO_NAME, storeName);
+
+				if (db && info) {
+					setReady(200);
+					setStore(info);
+				}
+			} catch (e) {
+				setReady(400);
+			}
+		},
+		[storeName, version, setStore]
+	);
+
+	useEffect(
+		function () {
+			checkStore();
+		},
+		[checkStore]
+	);
+
+	useEffect(
+		function () {
+			if (refresh) {
+				setRefresh(false);
+				setDisabled(true);
+				async function go() {
+					await checkStore();
+					setDisabled(false);
+				}
+
+				go();
+			}
+		},
+		[refresh]
+	);
+
+	if (ready === 0) {
+		return (
+			<div className="lunatic-suggester-in-progress">
+				Le store {storeName} est en cour de chargement.
+			</div>
+		);
+	}
+	if (ready === 200) {
+		return children;
+	}
+	return (
+		<div className="lunatic-suggester-unvailable">
+			Le store {storeName} n'est pas disponible.
+			<button disabled={disabled} onClick={() => setRefresh(true)}>
+				Refresh
+			</button>
+		</div>
+	);
+}
+
+export default CheckStore;

package/src/components/suggester/components/create-on-keydown-callback.js

@@ -1,28 +1,28 @@
-import { actions } from '../state-management';
-import { BINDED_KEYS } from '../commons-tools';
-
-function create(dispatch) {
-	return function (e) {
-		const { key } = e;
-		switch (key) {
-			case BINDED_KEYS.Tab:
-				e.stopPropagation();
-				// e.preventDefault();
-				dispatch(actions.onKeyDown(key));
-				break;
-			case BINDED_KEYS.ArrowDown:
-			case BINDED_KEYS.ArrowUp:
-			case BINDED_KEYS.Home:
-			case BINDED_KEYS.End:
-			case BINDED_KEYS.Enter:
-			case BINDED_KEYS.Escape:
-				e.preventDefault();
-				e.stopPropagation();
-				dispatch(actions.onKeyDown(key));
-				break;
-			default:
-		}
-	};
-}
-
-export default create;
+import { actions } from '../state-management';
+import { BINDED_KEYS } from '../commons-tools';
+
+function create(dispatch) {
+	return function (e) {
+		const { key } = e;
+		switch (key) {
+			case BINDED_KEYS.Tab:
+				e.stopPropagation();
+				// e.preventDefault();
+				dispatch(actions.onKeyDown(key));
+				break;
+			case BINDED_KEYS.ArrowDown:
+			case BINDED_KEYS.ArrowUp:
+			case BINDED_KEYS.Home:
+			case BINDED_KEYS.End:
+			case BINDED_KEYS.Enter:
+			case BINDED_KEYS.Escape:
+				e.preventDefault();
+				e.stopPropagation();
+				dispatch(actions.onKeyDown(key));
+				break;
+			default:
+		}
+	};
+}
+
+export default create;

package/src/components/tooltip/response.js

@@ -1,52 +1,52 @@
-import React, { useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import ReactTooltip from 'react-tooltip';
-import * as U from '../../utils/lib';
-import * as img from './img';
-import './tooltip.scss';
-
-const TooltipResponse = ({ id, response }) => {
-	const [tooltipElements, setTooltipElements] = useState(() =>
-		U.buildTooltip(response)
-	);
-
-	useEffect(() => {
-		setTooltipElements(U.buildTooltip(response));
-	}, [response]);
-
-	const { content, imgName } = tooltipElements;
-
-	if (!content) return null;
-
-	const text = content
-		.map(({ key, value }) => `${key} : ${value}<br />`)
-		.join('');
-
-	return (
-		<div className="tooltip-lunatic">
-			<span
-				data-for={`${id}-management-tooltip`}
-				data-tip={text}
-				data-multiline
-			>
-				<img id={id} alt="img-tooltip" src={img[imgName].src || img[imgName]} />
-			</span>
-			<ReactTooltip
-				id={`${id}-management-tooltip`}
-				className="tooltip-text"
-				place="left"
-			/>
-		</div>
-	);
-};
-
-TooltipResponse.defaultProps = {
-	response: {},
-};
-
-TooltipResponse.propTypes = {
-	id: PropTypes.string,
-	response: U.responsePropTypes,
-};
-
-export default TooltipResponse;
+import React, { useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import ReactTooltip from 'react-tooltip';
+import * as U from '../../utils/lib';
+import * as img from './img';
+import './tooltip.scss';
+
+const TooltipResponse = ({ id, response }) => {
+	const [tooltipElements, setTooltipElements] = useState(() =>
+		U.buildTooltip(response)
+	);
+
+	useEffect(() => {
+		setTooltipElements(U.buildTooltip(response));
+	}, [response]);
+
+	const { content, imgName } = tooltipElements;
+
+	if (!content) return null;
+
+	const text = content
+		.map(({ key, value }) => `${key} : ${value}<br />`)
+		.join('');
+
+	return (
+		<div className="tooltip-lunatic">
+			<span
+				data-for={`${id}-management-tooltip`}
+				data-tip={text}
+				data-multiline
+			>
+				<img id={id} alt="img-tooltip" src={img[imgName].src || img[imgName]} />
+			</span>
+			<ReactTooltip
+				id={`${id}-management-tooltip`}
+				className="tooltip-text"
+				place="left"
+			/>
+		</div>
+	);
+};
+
+TooltipResponse.defaultProps = {
+	response: {},
+};
+
+TooltipResponse.propTypes = {
+	id: PropTypes.string,
+	response: U.responsePropTypes,
+};
+
+export default TooltipResponse;

package/src/stories/checkbox-boolean/data-forced.json

@@ -1,48 +1,48 @@
-{
-	"components": [
-		{
-			"id": "1",
-			"componentType": "CheckboxBoolean",
-			"mandatory": false,
-			"label": "➡ 1. Are you ready?",
-			"response": {
-				"name": "READY"
-			}
-		},
-		{
-			"id": "2",
-			"componentType": "CheckboxBoolean",
-			"mandatory": false,
-			"label": "➡ 2. Are you always ready?",
-			"response": {
-				"name": "READY2"
-			}
-		}
-	],
-	"variables": [
-		{
-			"variableType": "COLLECTED",
-			"name": "READY",
-			"componentRef": "1",
-			"values": {
-				"PREVIOUS": null,
-				"COLLECTED": true,
-				"FORCED": null,
-				"EDITED": null,
-				"INPUTED": null
-			}
-		},
-		{
-			"variableType": "COLLECTED",
-			"name": "READY2",
-			"componentRef": "2",
-			"values": {
-				"PREVIOUS": null,
-				"COLLECTED": true,
-				"FORCED": null,
-				"EDITED": null,
-				"INPUTED": null
-			}
-		}
-	]
-}
+{
+	"components": [
+		{
+			"id": "1",
+			"componentType": "CheckboxBoolean",
+			"mandatory": false,
+			"label": "➡ 1. Are you ready?",
+			"response": {
+				"name": "READY"
+			}
+		},
+		{
+			"id": "2",
+			"componentType": "CheckboxBoolean",
+			"mandatory": false,
+			"label": "➡ 2. Are you always ready?",
+			"response": {
+				"name": "READY2"
+			}
+		}
+	],
+	"variables": [
+		{
+			"variableType": "COLLECTED",
+			"name": "READY",
+			"componentRef": "1",
+			"values": {
+				"PREVIOUS": null,
+				"COLLECTED": true,
+				"FORCED": null,
+				"EDITED": null,
+				"INPUTED": null
+			}
+		},
+		{
+			"variableType": "COLLECTED",
+			"name": "READY2",
+			"componentRef": "2",
+			"values": {
+				"PREVIOUS": null,
+				"COLLECTED": true,
+				"FORCED": null,
+				"EDITED": null,
+				"INPUTED": null
+			}
+		}
+	]
+}