@inseefr/lunatic 0.2.60 → 0.3.0-experimental

package/src/components/dropdown/simple/simple-select-nested.component.js

@@ -1,70 +0,0 @@
-import React, { useState } from 'react';
-import { selectCommonPropTypes } from './prop-types';
-import classnames from 'classnames';
-import SelectBase from '../shared/select-base.component';
-import './simple-select.scss';
-
-const SimpleSelect = ({
-	className,
-	children,
-	name,
-	readOnly,
-	placeHolder,
-	options,
-	value: valueProps,
-	handleChange,
-	...rest
-}) => {
-	const [expanded, setExpanded] = useState(false);
-	const [label, setLabel] = useState(null);
-	const [initialValue, setInitialValue] = useState(
-		valueProps ? valueProps : null
-	);
-	const [value, setValue] = useState(valueProps ? valueProps : null);
-
-	if (valueProps !== initialValue) {
-		setInitialValue(valueProps);
-		setValue(valueProps);
-		// handleChange(valueProps);
-	}
-
-	return (
-		<SelectBase
-			id="simple-select"
-			options={children}
-			expanded={expanded}
-			readOnly={readOnly}
-			value={value}
-			initial={valueProps}
-			placeHolder={placeHolder ? placeHolder : 'Veuillez ...'}
-			setExpanded={ex => setExpanded(ex)}
-			setValue={(val, label) => {
-				setValue(val);
-				setLabel(label);
-				if (typeof handleChange === 'function') {
-					handleChange(val);
-				}
-				return false;
-			}}
-			className={classnames('simple-select', { [className]: className })}
-			{...rest}
-		>
-			<button
-				aria-haspopup="listbox"
-				className={classnames('bouton', { 'read-only': readOnly })}
-				aria-expanded={expanded ? true : undefined}
-				onClick={() => setExpanded(!expanded)}
-				readOnly={readOnly ? true : undefined}
-				name={name}
-			>
-				{label || placeHolder || 'Veuillez....'}
-			</button>
-		</SelectBase>
-	);
-};
-
-SimpleSelect.propTypes = {
-	...selectCommonPropTypes,
-};
-
-export default SimpleSelect;

package/src/components/dropdown/simple/simple-select.scss

@@ -1,84 +0,0 @@
-@mixin arrowUp {
-	margin-left: 5px;
-	content: ' ';
-	border: solid black;
-	border-width: 0 3px 3px 0;
-	display: inline-block;
-	padding: 3px;
-	transform: rotate(-135deg);
-	-webkit-transform: rotate(-135deg);
-}
-
-@mixin arrowDown {
-	margin-left: 5px;
-	content: ' ';
-	border: solid black;
-	border-width: 0 3px 3px 0;
-	display: inline-block;
-	padding: 3px;
-	transform: rotate(45deg);
-	-webkit-transform: rotate(45deg);
-}
-
-.simple-select {
-	display: inline-block;
-	position: relative;
-	button {
-		width: 100%;
-		background-color: snow;
-		border-radius: 4px;
-		border: solid blue 1px;
-		color: black;
-		padding: 5px 8px;
-		text-align: center;
-		text-decoration: none;
-		display: inline-block;
-		font-size: 16px;
-		text-align: left;
-
-		&:after {
-			float: right;
-			@include arrowDown();
-		}
-		&:focus {
-			border: solid 1px rgba(0, 0, 0, 0);
-			box-shadow: 0 0 1pt 1pt rgba(50, 50, 50, 0.5);
-		}
-	}
-
-	button[aria-expanded='true'] {
-		&:after {
-			@include arrowUp();
-		}
-	}
-
-	.read-only {
-		background-color: lightgrey;
-	}
-
-	.options {
-		list-style-type: none;
-		background-color: snow;
-		width: 100%;
-		margin: 0;
-		padding: 0;
-		border: solid blue 1px;
-		position: absolute;
-		overflow-y: auto;
-		max-height: 120px;
-		z-index: 1;
-
-		.option {
-			cursor: pointer;
-		}
-
-		.selected {
-			background-color: darkblue;
-			color: snow;
-		}
-	}
-
-	.hidden {
-		display: none;
-	}
-}

package/src/components/dropdown/writable/index.js

@@ -1 +0,0 @@
-export { default } from './writable-select.component';

package/src/components/dropdown/writable/writable-select.component.js

@@ -1,98 +0,0 @@
-import React from 'react';
-import classnames from 'classnames';
-import SelectBase from '../shared/select-base.component';
-import PropTypes from 'prop-types';
-import './writable-select.scss';
-
-class WritableSelect extends React.Component {
-	state = { expanded: false, value: null, label: null, prefix: null };
-
-	constructor(props) {
-		super(props);
-		if (props.value) {
-			this.state.value = props.value;
-		}
-	}
-
-	delete = () =>
-		this.setState({ expanded: true, prefix: null, value: null, label: null });
-
-	expandPanel = e => {
-		e.stopPropagation();
-		this.setState({ expanded: !this.state.expanded });
-	};
-
-	setValue = (value, label) => {
-		this.setState({ value, label, prefix: null });
-		if (this.props.handleChange) {
-			this.props.handleChange(value);
-		}
-		return false;
-	};
-
-	onFocusInput = () => this.setState({ expanded: true });
-
-	setExpanded = expanded => {
-		this.setState({ expanded });
-	};
-
-	handleChangeInput = e => {
-		this.setState({
-			label: e.target.value,
-			value: e.target.value,
-			expanded: true,
-			prefix: e.target.value,
-		});
-		this.props.handleChange(e.target.value);
-	};
-
-	render() {
-		const { expanded, value, label, prefix } = this.state;
-		const { children, className, placeHolder, readOnly, ...rest } = this.props;
-		return (
-			<SelectBase
-				id="writable-select"
-				prefix={prefix}
-				options={children}
-				expanded={expanded}
-				readOnly={readOnly}
-				value={value}
-				placeHolder={placeHolder ? placeHolder : 'Veuillez ...'}
-				setExpanded={this.setExpanded}
-				setValue={this.setValue}
-				className={classnames('writable-select', { [className]: className })}
-				{...rest}
-			>
-				<span className="champ-saisie">
-					<input
-						type="text"
-						placeholder={placeHolder || 'Veuillez...'}
-						value={label || ''}
-						onChange={this.handleChangeInput}
-						onFocus={this.onFocusInput}
-					/>
-					{value ? (
-						<button className="button-delete" onClick={this.delete} />
-					) : null}
-					<button
-						className={classnames('button-expand', {
-							'arrow-up': expanded,
-							'arrow-down': !expanded,
-						})}
-						onClick={this.expandPanel}
-					/>
-				</span>
-			</SelectBase>
-		);
-	}
-}
-
-WritableSelect.propTypes = {
-	value: PropTypes.object,
-	handleChange: PropTypes.func,
-	className: PropTypes.string,
-	placeHolder: PropTypes.string,
-	readOnly: PropTypes.bool,
-};
-
-export default WritableSelect;

package/src/components/dropdown/writable/writable-select.scss

@@ -1,113 +0,0 @@
-@mixin arrow {
-	width: 10px;
-	height: 10px;
-	content: ' ';
-	border: solid black;
-	border-width: 0 3px 3px 0;
-	display: inline-block;
-}
-
-@mixin buttonClear {
-	background: none;
-	color: inherit;
-	border: none;
-	padding: 0;
-	font: inherit;
-	cursor: pointer;
-	outline: inherit;
-}
-
-.writable-select {
-	position: relative;
-	background-color: snow;
-	border-radius: 4px;
-	border: solid blue 1px;
-	color: black;
-
-	.champ-saisie {
-		input {
-			outline: none;
-			margin: 5px 0 5px 8px;
-			background-color: snow;
-			// border-radius: 4px;
-			border: none;
-			color: black;
-			// padding: 5px 0 5px 8px;
-			text-align: center;
-			text-decoration: none;
-			text-align: left;
-		}
-
-		.button-delete {
-			display: inline-block;
-			@include buttonClear();
-			float: right;
-			margin-right: 24px;
-
-			&:before {
-				transform: rotate(45deg);
-				position: absolute;
-
-				content: ' ';
-				height: 14px;
-				width: 2px;
-				background-color: #333;
-			}
-			&:after {
-				transform: rotate(-45deg);
-				position: absolute;
-
-				content: ' ';
-				height: 14px;
-				width: 2px;
-				background-color: #333;
-			}
-		}
-
-		.button-expand {
-			@include buttonClear();
-			display: inline-block;
-			float: right;
-		}
-		.arrow-up {
-			@include arrow();
-			transform: rotate(-135deg);
-			-webkit-transform: rotate(-135deg);
-		}
-		.arrow-down {
-			@include arrow();
-			transform: rotate(45deg);
-			-webkit-transform: rotate(45deg);
-		}
-	}
-
-	.options {
-		list-style-type: none;
-		background-color: snow;
-		width: 100%;
-		margin: 0;
-		padding: 0;
-		border: solid blue 1px;
-		position: absolute;
-		overflow-y: auto;
-		max-height: 120px;
-		z-index: 1;
-
-		.option {
-			cursor: pointer;
-			&:hover {
-			}
-			&:focus {
-			}
-		}
-
-		.selected {
-			background-color: darkblue;
-			color: snow;
-		}
-	}
-
-	.hidden {
-		display: none;
-	}
-}

package/src/components/subsequence/subsequence.scss

@@ -1,15 +0,0 @@
-@import 'src/components/index.scss';
-
-.subsequence-lunatic {
-	height: 20px;
-	box-sizing: border-box;
-	border-radius: 0px;
-	background-color: $main_color;
-	border: 0.1em solid $main_color;
-	color: white;
-	font-weight: bold;
-	font-size: 90%;
-	padding-left: 10px;
-	display: flex;
-	align-items: center;
-}

package/src/tests/components/dropdown.spec.js

@@ -1,20 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import { Dropdown } from 'components';
-
-const handleChange = jest.fn();
-const defaultProps = {
-	id: 'id',
-	label: 'label',
-	handleChange,
-	options: [
-		{ value: 'france', label: 'France' },
-		{ value: 'italy', label: 'Italy' },
-	],
-};
-
-describe('dropdown', () => {
-	it('renders without crashing', () => {
-		shallow(<Dropdown {...defaultProps} />);
-	});
-});

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

@@ -1,251 +0,0 @@
-import {
-	getState,
-	getCollectedState,
-	getCollectedStateByValueType,
-} from 'utils/to-expose';
-
-describe('init-state', () => {
-	describe('getState', () => {
-		it('should return empty object', () => {
-			expect(getState([])).toEqual({
-				COLLECTED: {},
-				CALCULATED: {},
-				EXTERNAL: {},
-			});
-		});
-		it('should return object', () => {
-			expect(getState(questionnaire)).toEqual(state);
-		});
-	});
-	describe('getCollectedState', () => {
-		it('should return empty object', () => {
-			expect(getCollectedState([])).toEqual({});
-		});
-		it('should return object', () => {
-			expect(getCollectedState(questionnaire)).toEqual(collectedState);
-		});
-	});
-	describe('getCollectedStateByValueType', () => {
-		it('should return empty object', () => {
-			expect(getCollectedStateByValueType([])('')).toEqual({});
-			expect(getCollectedStateByValueType(questionnaire)('')).toEqual({});
-		});
-		it('should return object', () => {
-			expect(getCollectedStateByValueType(questionnaire)('COLLECTED')).toEqual(
-				collectedStateCollected
-			);
-		});
-	});
-});
-
-const questionnaire = {
-	components: [
-		{
-			componentType: 'Sequence',
-		},
-		{
-			componentType: 'Textarea',
-			response: {
-				name: 'COMMENT',
-				valueState: [
-					{ valueType: 'PREVIOUS', value: 'PREVIOUS' },
-					{ valueType: 'COLLECTED', value: 'COLLECTED' },
-					{ valueType: 'FORCED', value: 'FORCED' },
-					{ valueType: 'EDITED', value: 'EDITED' },
-					{ valueType: 'INPUTED', value: 'INPUTED' },
-				],
-			},
-		},
-		{
-			componentType: 'CheckboxGroup',
-			responses: [
-				{
-					response: {
-						name: 'PET1',
-						valueState: [
-							{ valueType: 'PREVIOUS', value: false },
-							{ valueType: 'COLLECTED', value: false },
-							{ valueType: 'FORCED', value: false },
-							{ valueType: 'EDITED', value: false },
-							{ valueType: 'INPUTED', value: false },
-						],
-					},
-				},
-				{
-					response: {
-						name: 'PET2',
-						valueState: [
-							{ valueType: 'PREVIOUS', value: false },
-							{ valueType: 'COLLECTED', value: false },
-							{ valueType: 'FORCED', value: false },
-							{ valueType: 'EDITED', value: false },
-							{ valueType: 'INPUTED', value: false },
-						],
-					},
-				},
-			],
-		},
-		{
-			componentType: 'Table',
-			cells: [
-				[
-					{ value: '1', label: 'Vanilla' },
-					{
-						componentType: 'Radio',
-						response: {
-							name: 'ICE_FLAVOUR1',
-							valueState: [
-								{ valueType: 'PREVIOUS', value: '' },
-								{ valueType: 'COLLECTED', value: '' },
-								{ valueType: 'FORCED', value: '' },
-								{ valueType: 'EDITED', value: '' },
-								{ valueType: 'INPUTED', value: '' },
-							],
-						},
-					},
-				],
-				[
-					{ value: '2', label: 'Other' },
-					{
-						componentType: 'CheckboxGroup',
-						responses: [
-							{
-								response: {
-									name: 'ICE_FLAVOUR21',
-									valueState: [
-										{ valueType: 'PREVIOUS', value: null },
-										{ valueType: 'COLLECTED', value: null },
-										{ valueType: 'FORCED', value: null },
-										{ valueType: 'EDITED', value: null },
-										{ valueType: 'INPUTED', value: null },
-									],
-								},
-							},
-							{
-								response: {
-									name: 'ICE_FLAVOUR22',
-									valueState: [
-										{ valueType: 'PREVIOUS', value: true },
-										{ valueType: 'COLLECTED', value: true },
-										{ valueType: 'FORCED', value: true },
-										{ valueType: 'EDITED', value: true },
-										{ valueType: 'INPUTED', value: true },
-									],
-								},
-							},
-						],
-					},
-				],
-			],
-		},
-	],
-	variables: [
-		{ variableType: 'EXTERNAL', name: 'EXT', label: 'EXT value' },
-		{
-			variableType: 'CALCULATED',
-			name: 'CALC',
-			value: 'XXX',
-		},
-	],
-};
-const state = {
-	COLLECTED: {
-		COMMENT: {
-			PREVIOUS: 'PREVIOUS',
-			COLLECTED: 'COLLECTED',
-			FORCED: 'FORCED',
-			EDITED: 'EDITED',
-			INPUTED: 'INPUTED',
-		},
-		PET1: {
-			PREVIOUS: false,
-			COLLECTED: false,
-			FORCED: false,
-			EDITED: false,
-			INPUTED: false,
-		},
-		PET2: {
-			PREVIOUS: false,
-			COLLECTED: false,
-			FORCED: false,
-			EDITED: false,
-			INPUTED: false,
-		},
-		ICE_FLAVOUR1: {
-			PREVIOUS: '',
-			COLLECTED: '',
-			FORCED: '',
-			EDITED: '',
-			INPUTED: '',
-		},
-		ICE_FLAVOUR21: {
-			PREVIOUS: null,
-			COLLECTED: null,
-			FORCED: null,
-			EDITED: null,
-			INPUTED: null,
-		},
-		ICE_FLAVOUR22: {
-			PREVIOUS: true,
-			COLLECTED: true,
-			FORCED: true,
-			EDITED: true,
-			INPUTED: true,
-		},
-	},
-	EXTERNAL: { EXT: 'EXT value' },
-	CALCULATED: { CALC: 'Evaluation is coming soon!' },
-};
-
-const collectedState = {
-	COMMENT: {
-		PREVIOUS: 'PREVIOUS',
-		COLLECTED: 'COLLECTED',
-		FORCED: 'FORCED',
-		EDITED: 'EDITED',
-		INPUTED: 'INPUTED',
-	},
-	PET1: {
-		PREVIOUS: false,
-		COLLECTED: false,
-		FORCED: false,
-		EDITED: false,
-		INPUTED: false,
-	},
-	PET2: {
-		PREVIOUS: false,
-		COLLECTED: false,
-		FORCED: false,
-		EDITED: false,
-		INPUTED: false,
-	},
-	ICE_FLAVOUR1: {
-		PREVIOUS: '',
-		COLLECTED: '',
-		FORCED: '',
-		EDITED: '',
-		INPUTED: '',
-	},
-	ICE_FLAVOUR21: {
-		PREVIOUS: null,
-		COLLECTED: null,
-		FORCED: null,
-		EDITED: null,
-		INPUTED: null,
-	},
-	ICE_FLAVOUR22: {
-		PREVIOUS: true,
-		COLLECTED: true,
-		FORCED: true,
-		EDITED: true,
-		INPUTED: true,
-	},
-};
-
-const collectedStateCollected = {
-	COMMENT: 'COLLECTED',
-	PET1: false,
-	PET2: false,
-	ICE_FLAVOUR1: '',
-	ICE_FLAVOUR22: true,
-};