@inseefr/lunatic 0.3.0-experimental → 0.3.0-prisme

package/src/stories/questionnaire/questionnaire.stories.js

@@ -1,172 +1,236 @@
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import Orchestrator from '../utils/orchestrator';
-import { titleDecorator } from 'utils/lib';
-import calcVar from './calc-var';
-import logement from './logement';
-import logementQueen from './logement-queen';
-import logementS2 from './logement-s2';
-import logementSequence from './logement-sequence';
-import dataLogement from './data-logement';
-import simpsons from './simpsons';
-import arithmetic from './arithmetic';
-import { positioningOptions, featuresOptions } from '../utils/options';
-import { boolean, select } from '@storybook/addon-knobs/react';
-
-const def = storiesOf('Questionnaire/Default', module).addDecorator(
-	(Component) => {
-		const WrappedComponent = titleDecorator(Component);
-		return <WrappedComponent title="<Questionnaire />" />;
-	}
-);
-
-def.addWithJSX('Calculated Variables', () => (
-	<Orchestrator
-		id="props"
-		source={calcVar}
-		missing={boolean('Missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-	/>
-));
-
-def.addWithJSX('Logement', () => (
-	<Orchestrator
-		id="props"
-		source={logement}
-		missing={boolean('Missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-	/>
-));
-
-def.addWithJSX('Arithmetic', () => (
-	<Orchestrator
-		id="props"
-		source={arithmetic}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-	/>
-));
-
-def.addWithJSX('Simpsons', () => (
-	<Orchestrator
-		id="props"
-		source={simpsons}
-		missing={boolean('Missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-	/>
-));
-
-const paginated = storiesOf('Questionnaire/Paginated', module).addDecorator(
-	(Component) => {
-		const WrappedComponent = titleDecorator(Component);
-		return <WrappedComponent title="<Questionnaire />" />;
-	}
-);
-
-paginated.addWithJSX('Calculated Variables', () => (
-	<Orchestrator
-		id="props"
-		source={calcVar}
-		missing={boolean('Missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-		pagination
-	/>
-));
-
-paginated.addWithJSX('Logement', () => (
-	<Orchestrator
-		id="props"
-		source={logement}
-		data={dataLogement}
-		missing={boolean('Missing', false)}
-		activeGoNextForMissing={boolean('Active go next for missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-		pagination
-		modalForControls
-	/>
-));
-
-paginated.addWithJSX('Logement - Queen', () => (
-	<Orchestrator
-		id="props"
-		source={logementQueen}
-		data={dataLogement}
-		missing={boolean('Missing', false)}
-		activeGoNextForMissing={boolean('Active go next for missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-		pagination
-	/>
-));
-
-paginated.addWithJSX('Logement - Sequence', () => (
-	<Orchestrator
-		id="props"
-		source={logementSequence}
-		data={dataLogement}
-		missing={boolean('Missing', false)}
-		activeGoNextForMissing={boolean('Active go next for missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-		pagination
-	/>
-));
-
-paginated.addWithJSX('Logement - S2', () => (
-	<Orchestrator
-		id="props"
-		source={logementS2}
-		missing={boolean('Missing', false)}
-		activeGoNextForMissing={boolean('Active go next for missing', false)}
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-		pagination
-	/>
-));
-
-paginated.addWithJSX('Simpsons', () => (
-	<Orchestrator
-		id="props"
-		source={simpsons}
-		missing={boolean('Missing', false)}
-		activeGoNextForMissing={boolean('Active go next for missing', false)}
-		missingShortcut={{ dontKnow: 'f2', refused: 'f4' }}
-		shortcut
-		features={select('Features', featuresOptions, ['VTL', 'MD'])}
-		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
-		disabled={boolean('Disabled', false)}
-		focused={boolean('Focused', false)}
-		management={boolean('Management', false)}
-		pagination
-	/>
-));
+import React, { useState } from 'react';
+import { storiesOf } from '@storybook/react';
+import Orchestrator from '../utils/orchestrator';
+import OrchestratorSplit from '../utils/orchestrator-split';
+import { titleDecorator } from 'utils/lib';
+import calcVar from './calc-var';
+import logement from './logement';
+import logementQueen from './logement-queen';
+import logementS2 from './logement-s2';
+import logementSequence from './logement-sequence';
+import dataLogement from './data-logement';
+import simpsons from './simpsons';
+import loopAndControls from './loop-and-controls.json';
+import arithmetic from './arithmetic';
+import kish from './kish';
+import arithmeticManagement from './arithmetic-management';
+import updateExternalQuestionnaire from './update-external/questionnaire';
+import updateExternalData from './update-external/data';
+import { positioningOptions, featuresOptions } from '../utils/options';
+import { boolean, select } from '@storybook/addon-knobs/react';
+
+const def = storiesOf('Questionnaire/Default', module).addDecorator(
+	(Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Questionnaire />" />;
+	}
+);
+
+def.addWithJSX('Calculated Variables', () => (
+	<Orchestrator
+		id="props"
+		source={calcVar}
+		missing={boolean('Missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+	/>
+));
+
+def.addWithJSX('Arithmetic', () => (
+	<Orchestrator
+		id="props"
+		source={arithmetic}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+	/>
+));
+
+def.addWithJSX('Arithmetic - Management', () => (
+	<Orchestrator
+		id="props"
+		source={arithmeticManagement}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		management={boolean('Management', true)}
+	/>
+));
+
+def.addWithJSX('Simpsons', () => (
+	<Orchestrator
+		id="props"
+		source={simpsons}
+		missing={boolean('Missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+	/>
+));
+
+const paginated = storiesOf('Questionnaire/Paginated', module).addDecorator(
+	(Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Questionnaire />" />;
+	}
+);
+
+paginated.addWithJSX('Calculated Variables', () => (
+	<Orchestrator
+		id="props"
+		source={calcVar}
+		missing={boolean('Missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+	/>
+));
+
+paginated.addWithJSX('Kish', () => (
+	<Orchestrator
+		id="props"
+		source={kish}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		pagination
+	/>
+));
+
+paginated.addWithJSX('Logement', () => (
+	<OrchestratorSplit
+		id="props"
+		source={logement}
+		data={dataLogement}
+		missing={boolean('Missing', false)}
+		activeGoNextForMissing={boolean('Active go next for missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+		modalForControls
+	/>
+));
+
+paginated.addWithJSX('Logement - Queen', () => (
+	<OrchestratorSplit
+		id="props"
+		source={logementQueen}
+		data={dataLogement}
+		missing={boolean('Missing', true)}
+		activeGoNextForMissing={boolean('Active go next for missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+	/>
+));
+
+paginated.addWithJSX('Logement - Sequence', () => (
+	<OrchestratorSplit
+		id="props"
+		source={logementSequence}
+		data={dataLogement}
+		missing={boolean('Missing', false)}
+		activeGoNextForMissing={boolean('Active go next for missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+	/>
+));
+
+paginated.addWithJSX('Logement - S2', () => (
+	<OrchestratorSplit
+		id="props"
+		source={logementS2}
+		missing={boolean('Missing', false)}
+		activeGoNextForMissing={boolean('Active go next for missing', false)}
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+	/>
+));
+
+paginated.addWithJSX('Simpsons', () => (
+	<Orchestrator
+		id="props"
+		source={simpsons}
+		missing={boolean('Missing', false)}
+		activeGoNextForMissing={boolean('Active go next for missing', false)}
+		missingShortcut={{ dontKnow: 'f2', refused: 'f4' }}
+		shortcut
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+	/>
+));
+
+const other = storiesOf('Questionnaire/Other', module).addDecorator(
+	(Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Questionnaire />" />;
+	}
+);
+
+other.addWithJSX('Controls', () => (
+	<Orchestrator
+		id="props"
+		modalForControls={true}
+		source={loopAndControls}
+		missing={boolean('Missing', false)}
+		activeGoNextForMissing={boolean('Active go next for missing', false)}
+		missingShortcut={{ dontKnow: 'f2', refused: 'f4' }}
+		shortcut
+		features={select('Features', featuresOptions, ['VTL', 'MD'])}
+		positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+		disabled={boolean('Disabled', false)}
+		focused={boolean('Focused', false)}
+		management={boolean('Management', false)}
+		pagination
+	/>
+));
+
+other.addWithJSX('Update external', () => {
+	const [addExternal, setAddExternal] = useState(null);
+	return (
+		<>
+			<button
+				onClick={() => setAddExternal({ PROMO: true })}
+			>{`Fire PROMO --> True`}</button>
+			<button
+				onClick={() => setAddExternal({ PROMO: false })}
+			>{`Fire PROMO --> False`}</button>
+			<Orchestrator
+				id="props"
+				source={updateExternalQuestionnaire}
+				data={updateExternalData}
+				features={select('Features', featuresOptions, ['VTL', 'MD'])}
+				positioning={select('Items positioning', positioningOptions, 'DEFAULT')}
+				disabled={boolean('Disabled', false)}
+				focused={boolean('Focused', false)}
+				addExternal={addExternal}
+			/>
+		</>
+	);
+});

package/src/stories/questionnaire/update-external/data.json

@@ -0,0 +1 @@
+{ "EXTERNAL": { "PROMO": null } }

package/src/stories/questionnaire/update-external/questionnaire.json

@@ -0,0 +1,75 @@
+{
+	"components": [
+		{
+			"id": "seq1",
+			"componentType": "Sequence",
+			"label": "\"I - Collect number\"",
+			"conditionFilter": { "value": "true" }
+		},
+		{
+			"id": "input1",
+			"componentType": "InputNumber",
+			"label": "Number",
+			"conditionFilter": { "value": "true" },
+			"response": { "name": "NUM" },
+			"bindingDependencies": ["NUM"]
+		},
+		{
+			"id": "seq2",
+			"componentType": "Sequence",
+			"label": "\"II - Promo rate\"",
+			"conditionFilter": {
+				"value": "PROMO = true",
+				"bindingDependencies": ["PROMO"]
+			},
+			"bindingDependencies": ["PROMO"]
+		},
+		{
+			"id": "input2",
+			"componentType": "InputNumber",
+			"label": "Rate",
+			"conditionFilter": {
+				"value": "PROMO = true",
+				"bindingDependencies": ["PROMO"]
+			},
+			"response": {
+				"name": "PROMO_RATE",
+				"bindingDependencies": ["PROMO_RATE"]
+			},
+			"bindingDependencies": ["PROMO", "PROMO_RATE"]
+		}
+	],
+	"variables": [
+		{
+			"variableType": "COLLECTED",
+			"name": "NUM",
+			"componentRef": "input1",
+			"values": {
+				"PREVIOUS": null,
+				"COLLECTED": null,
+				"FORCED": null,
+				"EDITED": null,
+				"INPUTED": null
+			}
+		},
+		{
+			"variableType": "COLLECTED",
+			"name": "PROMO_RATE",
+			"componentRef": "input2",
+			"values": {
+				"PREVIOUS": null,
+				"COLLECTED": null,
+				"FORCED": null,
+				"EDITED": null,
+				"INPUTED": null
+			}
+		},
+		{ "variableType": "EXTERNAL", "name": "PROMO", "value": null },
+		{
+			"variableType": "CALCULATED",
+			"name": "DOUBLE_PROMO_RATE",
+			"expression": "cast(PROMO_RATE, integer) * 2",
+			"bindingDependencies": ["PROMO_RATE"]
+		}
+	]
+}

package/src/stories/sequence/sequence.stories.js

@@ -1,32 +1,32 @@
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withReadme } from 'storybook-readme';
-import { Sequence } from 'components';
-import readme from './README.md';
-import { titleDecorator } from 'utils/lib';
-import { featuresOptions } from '../utils/options';
-import { text, object, select } from '@storybook/addon-knobs/react';
-
-const stories = storiesOf('Sequence', module)
-	.addDecorator(withReadme(readme))
-	.addDecorator((Component) => {
-		const WrappedComponent = titleDecorator(Component);
-		return <WrappedComponent title="<Sequence />" />;
-	});
-
-stories.addWithJSX('Default', () => (
-	<div className="lunatic-component">
-		<Sequence id="default" label="Label of my sequence" />
-	</div>
-));
-
-stories.addWithJSX('Props', () => (
-	<div className="lunatic-component">
-		<Sequence
-			id="props"
-			label={text('Label', '"Label of my sequence: " || TEST')}
-			features={select('Features', featuresOptions, ['VTL', 'MD'])}
-			bindings={object('Bindings', { TEST: 'test' })}
-		/>
-	</div>
-));
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { withReadme } from 'storybook-readme';
+import { Sequence } from 'components';
+import readme from './README.md';
+import { titleDecorator } from 'utils/lib';
+import { featuresOptions } from '../utils/options';
+import { text, object, select } from '@storybook/addon-knobs/react';
+
+const stories = storiesOf('Sequence', module)
+	.addDecorator(withReadme(readme))
+	.addDecorator((Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Sequence />" />;
+	});
+
+stories.addWithJSX('Default', () => (
+	<div className="lunatic-component">
+		<Sequence id="default" label="Label of my sequence" />
+	</div>
+));
+
+stories.addWithJSX('Props', () => (
+	<div className="lunatic-component">
+		<Sequence
+			id="props"
+			label={text('Label', '"Label of my sequence: " || TEST')}
+			features={select('Features', featuresOptions, ['VTL', 'MD'])}
+			bindings={object('Bindings', { TEST: 'test' })}
+		/>
+	</div>
+));

package/src/stories/subsequence/subsequence.stories.js

@@ -1,32 +1,32 @@
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withReadme } from 'storybook-readme';
-import { Subsequence } from 'components';
-import readme from './README.md';
-import { titleDecorator } from 'utils/lib';
-import { featuresOptions } from '../utils/options';
-import { text, object, select } from '@storybook/addon-knobs/react';
-
-const stories = storiesOf('Subsequence', module)
-	.addDecorator(withReadme(readme))
-	.addDecorator((Component) => {
-		const WrappedComponent = titleDecorator(Component);
-		return <WrappedComponent title="<Subsequence />" />;
-	});
-
-stories.addWithJSX('Default', () => (
-	<div className="lunatic-component">
-		<Subsequence id="default" label="Label of my subsequence" />
-	</div>
-));
-
-stories.addWithJSX('Props', () => (
-	<div className="lunatic-component">
-		<Subsequence
-			id="props"
-			label={text('Label', '"Label of my subsequence: " || test')}
-			features={select('Features', featuresOptions, ['VTL', 'MD'])}
-			bindings={object('Bindings', { test: 'test' })}
-		/>
-	</div>
-));
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { withReadme } from 'storybook-readme';
+import { Subsequence } from 'components';
+import readme from './README.md';
+import { titleDecorator } from 'utils/lib';
+import { featuresOptions } from '../utils/options';
+import { text, object, select } from '@storybook/addon-knobs/react';
+
+const stories = storiesOf('Subsequence', module)
+	.addDecorator(withReadme(readme))
+	.addDecorator((Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Subsequence />" />;
+	});
+
+stories.addWithJSX('Default', () => (
+	<div className="lunatic-component">
+		<Subsequence id="default" label="Label of my subsequence" />
+	</div>
+));
+
+stories.addWithJSX('Props', () => (
+	<div className="lunatic-component">
+		<Subsequence
+			id="props"
+			label={text('Label', '"Label of my subsequence: " || test')}
+			features={select('Features', featuresOptions, ['VTL', 'MD'])}
+			bindings={object('Bindings', { test: 'test' })}
+		/>
+	</div>
+));