@inseefr/lunatic 0.2.3-experimental → 0.2.3-prisme

package/src/components/textarea/textarea.scss

@@ -1,8 +1,8 @@
-// see input.scss
-
-.lunatic-component {
-	.textarea-lunatic {
-		height: 3em;
-		width: 100%;
-	}
-}
+// see input.scss
+
+.lunatic-component {
+	.textarea-lunatic {
+		height: 3em;
+		width: 100%;
+	}
+}

package/src/components/tooltip/tooltip.scss

@@ -1,30 +1,30 @@
-// Import index once for bundle
-@import 'src/components/index.scss';
-
-.lunatic-component {
-	/* Tooltip container */
-	.tooltip-lunatic {
-		position: relative;
-		display: inline-block;
-		align-items: center;
-	}
-
-	/* Tooltip text */
-	.tooltip-lunatic .tooltip-text {
-		min-width: 10em;
-		max-width: 20em;
-		background-color: var(--color-primary-dark);
-		color: #fff;
-		padding: 0.5em;
-		border-radius: 6px;
-		font-size: 1em;
-		&.place-left {
-			&::before {
-				border-left: 10px solid var(--color-primary-dark);
-			}
-			&::after {
-				content: none;
-			}
-		}
-	}
-}
+// Import index once for bundle
+@import 'src/components/index.scss';
+
+.lunatic-component {
+	/* Tooltip container */
+	.tooltip-lunatic {
+		position: relative;
+		display: inline-block;
+		align-items: center;
+	}
+
+	/* Tooltip text */
+	.tooltip-lunatic .tooltip-text {
+		min-width: 10em;
+		max-width: 20em;
+		background-color: var(--color-primary-dark);
+		color: #fff;
+		padding: 0.5em;
+		border-radius: 6px;
+		font-size: 1em;
+		&.place-left {
+			&::before {
+				border-left: 10px solid var(--color-primary-dark);
+			}
+			&::after {
+				content: none;
+			}
+		}
+	}
+}

package/src/stories/breadcrumb/breadcrumb.stories.js

@@ -1,21 +1,21 @@
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { Breadcrumb } from 'components';
-import { withReadme } from 'storybook-readme';
-import readme from './README.md';
-import { titleDecorator } from 'utils/lib';
-
-const elements = ['Sequence', 'Sub-sequence', 'Question'];
-
-const stories = storiesOf('Breadcrumb', module)
-	.addDecorator(withReadme(readme))
-	.addDecorator((Component) => {
-		const WrappedComponent = titleDecorator(Component);
-		return <WrappedComponent title="<Breadcrumb />" />;
-	});
-
-stories.addWithJSX('Default', () => (
-	<div className="lunatic-component">
-		<Breadcrumb id="default" elements={elements} />
-	</div>
-));
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { Breadcrumb } from 'components';
+import { withReadme } from 'storybook-readme';
+import readme from './README.md';
+import { titleDecorator } from 'utils/lib';
+
+const elements = ['Sequence', 'Sub-sequence', 'Question'];
+
+const stories = storiesOf('Breadcrumb', module)
+	.addDecorator(withReadme(readme))
+	.addDecorator((Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Breadcrumb />" />;
+	});
+
+stories.addWithJSX('Default', () => (
+	<div className="lunatic-component">
+		<Breadcrumb id="default" elements={elements} />
+	</div>
+));

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

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

package/src/stories/datepicker/data.json

@@ -11,7 +11,9 @@
 			"dateFormat": "jj/mm/aaaa",
 			"missingResponse": {
 				"name": "DATEFIRST_MISSING"
-			}
+			},
+			"min": "1900-01-01",
+			"max": "2099-12-31"
 		}
 	],
 	"variables": [

package/src/stories/declarations/declarations.stories.js

@@ -1,116 +1,116 @@
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withReadme } from 'storybook-readme';
-import { Declarations } from 'components';
-import readme from './README.md';
-import { titleDecorator } from 'utils/lib';
-import * as C from '../../constants';
-import { featuresOptions } from '../utils/options';
-import { object, select } from '@storybook/addon-knobs/react';
-
-const stories = storiesOf('Declarations', module)
-	.addDecorator(withReadme(readme))
-	.addDecorator((Component) => {
-		const WrappedComponent = titleDecorator(Component);
-		return <WrappedComponent title="<Declarations />" />;
-	});
-
-stories.addWithJSX('Default', () => (
-	<div className="lunatic-component">
-		<Declarations
-			id="default"
-			type={C.BEFORE_QUESTION_TEXT}
-			declarations={declarations}
-		/>
-	</div>
-));
-
-stories.addWithJSX('Props', () => (
-	<div className="lunatic-component">
-		<Declarations
-			id="default"
-			type={C.BEFORE_QUESTION_TEXT}
-			declarations={declarationsVtl}
-			features={select('Features', featuresOptions, ['VTL', 'MD'])}
-			bindings={object('Bindings', { test: 'test' })}
-		/>
-	</div>
-));
-
-const declarations = [
-	{
-		id: '1',
-		label: "I'm the label of the instruction declaration",
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.INSTRUCTION,
-	},
-	{
-		id: '2',
-		label: "I'm the label of the comment declaration",
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.COMMENT,
-	},
-	{
-		id: '3',
-		label: "I'm the label of the help declaration",
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.HELP,
-	},
-	{
-		id: '4',
-		label: "I'm the label of the warning declaration",
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.WARNING,
-	},
-	{
-		id: '5',
-		label: "I'm the label of the message filter declaration",
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.MESSAGE_FILTER,
-	},
-	{
-		id: '6',
-		label: "I'm the label of the statement declaration",
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.STATEMENT,
-	},
-];
-
-const declarationsVtl = [
-	{
-		id: '1',
-		label: '"I\'m the label of the instruction declaration"',
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.INSTRUCTION,
-	},
-	{
-		id: '2',
-		label: '"I\'m the label of the comment declaration"',
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.COMMENT,
-	},
-	{
-		id: '3',
-		label: '"I\'m the label of the help declaration"',
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.HELP,
-	},
-	{
-		id: '4',
-		label: '"I\'m the label of the warning declaration"',
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.WARNING,
-	},
-	{
-		id: '5',
-		label: '"I\'m the label of the message filter declaration"',
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.MESSAGE_FILTER,
-	},
-	{
-		id: '6',
-		label: '"I\'m the label of the statement declaration"',
-		position: C.BEFORE_QUESTION_TEXT,
-		declarationType: C.STATEMENT,
-	},
-];
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { withReadme } from 'storybook-readme';
+import { Declarations } from 'components';
+import readme from './README.md';
+import { titleDecorator } from 'utils/lib';
+import * as C from '../../constants';
+import { featuresOptions } from '../utils/options';
+import { object, select } from '@storybook/addon-knobs/react';
+
+const stories = storiesOf('Declarations', module)
+	.addDecorator(withReadme(readme))
+	.addDecorator((Component) => {
+		const WrappedComponent = titleDecorator(Component);
+		return <WrappedComponent title="<Declarations />" />;
+	});
+
+stories.addWithJSX('Default', () => (
+	<div className="lunatic-component">
+		<Declarations
+			id="default"
+			type={C.BEFORE_QUESTION_TEXT}
+			declarations={declarations}
+		/>
+	</div>
+));
+
+stories.addWithJSX('Props', () => (
+	<div className="lunatic-component">
+		<Declarations
+			id="default"
+			type={C.BEFORE_QUESTION_TEXT}
+			declarations={declarationsVtl}
+			features={select('Features', featuresOptions, ['VTL', 'MD'])}
+			bindings={object('Bindings', { test: 'test' })}
+		/>
+	</div>
+));
+
+const declarations = [
+	{
+		id: '1',
+		label: "I'm the label of the instruction declaration",
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.INSTRUCTION,
+	},
+	{
+		id: '2',
+		label: "I'm the label of the comment declaration",
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.COMMENT,
+	},
+	{
+		id: '3',
+		label: "I'm the label of the help declaration",
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.HELP,
+	},
+	{
+		id: '4',
+		label: "I'm the label of the warning declaration",
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.WARNING,
+	},
+	{
+		id: '5',
+		label: "I'm the label of the message filter declaration",
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.MESSAGE_FILTER,
+	},
+	{
+		id: '6',
+		label: "I'm the label of the statement declaration",
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.STATEMENT,
+	},
+];
+
+const declarationsVtl = [
+	{
+		id: '1',
+		label: '"I\'m the label of the instruction declaration"',
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.INSTRUCTION,
+	},
+	{
+		id: '2',
+		label: '"I\'m the label of the comment declaration"',
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.COMMENT,
+	},
+	{
+		id: '3',
+		label: '"I\'m the label of the help declaration"',
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.HELP,
+	},
+	{
+		id: '4',
+		label: '"I\'m the label of the warning declaration"',
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.WARNING,
+	},
+	{
+		id: '5',
+		label: '"I\'m the label of the message filter declaration"',
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.MESSAGE_FILTER,
+	},
+	{
+		id: '6',
+		label: '"I\'m the label of the statement declaration"',
+		position: C.BEFORE_QUESTION_TEXT,
+		declarationType: C.STATEMENT,
+	},
+];

package/src/stories/dropdown/README.md

@@ -1,44 +1,44 @@
-# Dropdown component
-
-## Props
-
-|      Props       |  Type  | Default value | Required | Description                                          |
-| :--------------: | :----: | :-----------: | :------: | ---------------------------------------------------- |
-|        id        | string |       -       |    ✓     | Id of the dropdown                                   |
-|      label       | string |      ""       |          | Label of the dropdown                                |
-|  preferences \*  | array  | ["COLLECTED"] |          | Preferences to manage dropdown response              |
-|   response \*    | object |      {}       |          | Response concerned by the component                  |
-|    options \*    | array  |       -       |    ✓     | Options of the dropdown                              |
-|   handleChange   |  func  |       -       |    ✓     | Handler of the dropdown                              |
-| placeholderList  | string |      ""       |          | Placeholder of the dropdown                          |
-|     disabled     |  bool  |     false     |          | Is the dropdown disabled                             |
-|     writable     |  bool  |     false     |          | Is the dropdown writable                             |
-|    mandatory     |  bool  |     false     |          | Is the dropdown mandatory                            |
-|    widthAuto     |  bool  |     false     |          | Add the width-auto props for options of the Dropdown |
-| labelPosition \* | string |   "DEFAULT"   |          | Position of the dropdown label                       |
-| declarations \*  | array  |      []       |          | Declarations of the dropdown                         |
-|     features     | array  |      [ ]      |          | Component features for labels                        |
-|     bindings     | object |      [ ]      |          | Questionnaire bindings                               |
-|    management    |  bool  |     false     |          | Management mode of the dropdown                      |
-|      zIndex      | number |       0       |          | z-index of the dropdown                              |
-|      style       | object |      {}       |          | Style of the dropdown                                |
-
-- `preferences` props has to be an ordered array of `COLLECTED`, `FORCED` or `EDITED`
-- `response` props has to be a shape of `{name: string, values: object}`
-- `options` props has to be an array made by objects with a shape of `{label: string, value: string}`
-- `labelPosition` props has to be one of `DEFAULT`, `TOP`, `BOTTOM`, `RIGHT` or `LEFT`
-- `declarations` are documented in the `Declarations` component
-
-## Styles
-
-**Dropdown** component has cascade classes:
-
-- `lunatic-dropdown`
-- `lunatic-dropdown-container`
-- `lunatic-dropdown-content`
-- `lunatic-dropdown-input`
-- `lunatic-icon`
-- `lunatic-transition`
-- `lunatic-dropdown-panel`
-- `lunatic-dropdown-option`
-- `lunatic-prefix`
+# Dropdown component
+
+## Props
+
+|      Props       |  Type  | Default value | Required | Description                                          |
+| :--------------: | :----: | :-----------: | :------: | ---------------------------------------------------- |
+|        id        | string |       -       |    ✓     | Id of the dropdown                                   |
+|      label       | string |      ""       |          | Label of the dropdown                                |
+|  preferences \*  | array  | ["COLLECTED"] |          | Preferences to manage dropdown response              |
+|   response \*    | object |      {}       |          | Response concerned by the component                  |
+|    options \*    | array  |       -       |    ✓     | Options of the dropdown                              |
+|   handleChange   |  func  |       -       |    ✓     | Handler of the dropdown                              |
+| placeholderList  | string |      ""       |          | Placeholder of the dropdown                          |
+|     disabled     |  bool  |     false     |          | Is the dropdown disabled                             |
+|     writable     |  bool  |     false     |          | Is the dropdown writable                             |
+|    mandatory     |  bool  |     false     |          | Is the dropdown mandatory                            |
+|    widthAuto     |  bool  |     false     |          | Add the width-auto props for options of the Dropdown |
+| labelPosition \* | string |   "DEFAULT"   |          | Position of the dropdown label                       |
+| declarations \*  | array  |      []       |          | Declarations of the dropdown                         |
+|     features     | array  |      [ ]      |          | Component features for labels                        |
+|     bindings     | object |      [ ]      |          | Questionnaire bindings                               |
+|    management    |  bool  |     false     |          | Management mode of the dropdown                      |
+|      zIndex      | number |       0       |          | z-index of the dropdown                              |
+|      style       | object |      {}       |          | Style of the dropdown                                |
+
+- `preferences` props has to be an ordered array of `COLLECTED`, `FORCED` or `EDITED`
+- `response` props has to be a shape of `{name: string, values: object}`
+- `options` props has to be an array made by objects with a shape of `{label: string, value: string}`
+- `labelPosition` props has to be one of `DEFAULT`, `TOP`, `BOTTOM`, `RIGHT` or `LEFT`
+- `declarations` are documented in the `Declarations` component
+
+## Styles
+
+**Dropdown** component has cascade classes:
+
+- `lunatic-dropdown`
+- `lunatic-dropdown-container`
+- `lunatic-dropdown-content`
+- `lunatic-dropdown-input`
+- `lunatic-icon`
+- `lunatic-transition`
+- `lunatic-dropdown-panel`
+- `lunatic-dropdown-option`
+- `lunatic-prefix`