@inseefr/lunatic 2.0.2 → 2.0.3-v2

package/lib/stories/Introduction.stories.mdx

@@ -0,0 +1,114 @@
+import { Meta } from '@storybook/addon-docs';
+import Lunatic from '../../docs/img/lunatic-logo.png';
+
+<Meta title="Introduction" />
+
+<style>
+	{`
+    .subheading {
+      --mediumdark: '#999999';
+      font-weight: 900;
+      font-size: 13px;
+      color: #999;
+      letter-spacing: 6px;
+      line-height: 24px;
+      text-transform: uppercase;
+      margin-bottom: 12px;
+      margin-top: 40px;
+    }
+
+    .link-list {
+      display: grid;
+      grid-template-columns: 1fr;
+      grid-template-rows: 1fr 1fr;
+      row-gap: 10px;
+    }
+
+    @media (min-width: 620px) {
+      .link-list {
+        row-gap: 20px;
+        column-gap: 20px;
+        grid-template-columns: 1fr 1fr;
+      }
+    }
+
+    @media all and (-ms-high-contrast:none) {
+    .link-list {
+        display: -ms-grid;
+        -ms-grid-columns: 1fr 1fr;
+        -ms-grid-rows: 1fr 1fr;
+      }
+    }
+
+    .link-item {
+      display: block;
+      padding: 20px 30px 20px 15px;
+      border: 1px solid #00000010;
+      border-radius: 5px;
+      transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;
+      color: #333333;
+      display: flex;
+      align-items: flex-start;
+    }
+
+    .link-item:hover {
+      border-color: #1EA7FD50;
+      transform: translate3d(0, -3px, 0);
+      box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;
+    }
+
+    .link-item:active {
+      border-color: #1EA7FD;
+      transform: translate3d(0, 0, 0);
+    }
+
+    .link-item strong {
+      font-weight: 700;
+      display: block;
+      margin-bottom: 2px;
+    }
+
+    .link-item img {
+      height: 40px;
+      width: 40px;
+      margin-right: 15px;
+      flex: none;
+    }
+
+    .link-item span {
+      font-size: 14px;
+      line-height: 20px;
+    }
+
+    .tip {
+      display: inline-block;
+      border-radius: 1em;
+      font-size: 11px;
+      line-height: 12px;
+      font-weight: 700;
+      background: #E7FDD8;
+      color: #66BF3C;
+      padding: 4px 12px;
+      margin-right: 10px;
+      vertical-align: top;
+    }
+
+    .tip-wrapper {
+      font-size: 13px;
+      line-height: 20px;
+      margin-top: 40px;
+      margin-bottom: 40px;
+    }
+
+    .tip-wrapper code {
+      font-size: 12px;
+      display: inline-block;
+    }
+  `}
+</style>
+
+# Welcome to Lunatic storybook
+
+<p>
+	<img src={Lunatic} alt="Lunatic logo" />
+</p>

package/lib/stories/checkboxBoolean/checkboxBoolean.stories.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _orchestrator = _interopRequireDefault(require("../utils/orchestrator"));
+
+var _source = _interopRequireDefault(require("./source"));
+
+var _defaultArgTypes = _interopRequireDefault(require("../utils/default-arg-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var stories = {
+  title: 'Components/Checkboolean',
+  component: _orchestrator["default"],
+  argTypes: _defaultArgTypes["default"]
+};
+var _default = stories;
+exports["default"] = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/_react["default"].createElement(_orchestrator["default"], args);
+};
+
+var Default = Template.bind({});
+exports.Default = Default;
+Default.args = {
+  id: 'checkboxBoolean',
+  source: _source["default"]
+};

package/lib/stories/checkboxBoolean/source.json

@@ -0,0 +1,36 @@
+{
+	"components": [
+		{
+			"id": "checkboxboolean",
+			"componentType": "CheckboxBoolean",
+			"mandatory": false,
+			"page": "1",
+			"label": {
+				"value": "checkboxBoolean component (checked: true, unchecked: false)",
+				"type": "VTL|MD"
+			},
+
+			"conditionFilter": { "value": "true", "type": "VTL" },
+
+			"options": [
+				{ "value": "1", "label": { "value": "oui", "type": "VTL|MD" } },
+
+				{ "value": "2", "label": { "value": "non", "type": "VTL|MD" } }
+			],
+			"response": { "name": "Q2" }
+		}
+	],
+	"variables": [
+		{
+			"variableType": "COLLECTED",
+			"name": "Q2",
+			"values": {
+				"PREVIOUS": null,
+				"COLLECTED": null,
+				"FORCED": null,
+				"EDITED": null,
+				"INPUTED": null
+			}
+		}
+	]
+}

package/lib/stories/checkboxOne/checkboxOne.stories.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _orchestrator = _interopRequireDefault(require("../utils/orchestrator"));
+
+var _source = _interopRequireDefault(require("./source"));
+
+var _defaultArgTypes = _interopRequireDefault(require("../utils/default-arg-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var stories = {
+  title: 'Components/CheckboxOne',
+  component: _orchestrator["default"],
+  argTypes: _defaultArgTypes["default"]
+};
+var _default = stories;
+exports["default"] = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/_react["default"].createElement(_orchestrator["default"], args);
+};
+
+var Default = Template.bind({});
+exports.Default = Default;
+Default.args = {
+  id: 'checkboxOne',
+  source: _source["default"]
+};

package/lib/stories/checkboxOne/source.json

@@ -0,0 +1,36 @@
+{
+	"components": [
+		{
+			"id": "checkboxone",
+			"componentType": "CheckboxOne",
+			"mandatory": false,
+			"page": "3",
+			"label": {
+				"value": "checkboxone component",
+				"type": "VTL|MD"
+			},
+
+			"conditionFilter": { "value": "true", "type": "VTL" },
+
+			"options": [
+				{ "value": "1", "label": { "value": "oui", "type": "VTL|MD" } },
+
+				{ "value": "2", "label": { "value": "non", "type": "VTL|MD" } }
+			],
+			"response": { "name": "Q2" }
+		}
+	],
+	"variables": [
+		{
+			"variableType": "COLLECTED",
+			"name": "Q2",
+			"values": {
+				"PREVIOUS": null,
+				"COLLECTED": null,
+				"FORCED": null,
+				"EDITED": null,
+				"INPUTED": null
+			}
+		}
+	]
+}

package/lib/stories/custom-mui/checkbox-boolean-mui.js

@@ -0,0 +1,39 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function CheckboxBooleanMui(_ref) {
+  var checked = _ref.checked,
+      id = _ref.id,
+      disabled = _ref.disabled,
+      onClick = _ref.onClick,
+      labelId = _ref.labelId;
+  var handleClick = (0, _react.useCallback)(function () {
+    onClick(!checked);
+  }, [checked, onClick]);
+  return /*#__PURE__*/_react["default"].createElement(_Checkbox["default"], {
+    disabled: disabled,
+    checked: checked,
+    id: id,
+    onClick: handleClick,
+    "aria-labelledby": labelId
+  });
+}
+
+var _default = CheckboxBooleanMui;
+exports["default"] = _default;

package/lib/stories/custom-mui/checkbox-group-mui.js

@@ -0,0 +1,80 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _FormGroup = _interopRequireDefault(require("@mui/material/FormGroup"));
+
+var _FormControlLabel = _interopRequireDefault(require("@mui/material/FormControlLabel"));
+
+var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function CheckBoxOption(_ref) {
+  var checkboxId = _ref.checkboxId,
+      labelId = _ref.labelId,
+      label = _ref.label,
+      checked = _ref.checked,
+      handleChange = _ref.handleChange,
+      response = _ref.response;
+  var onClickOption = (0, _react.useCallback)(function () {
+    handleChange(response, !checked);
+  }, [handleChange, response, checked]);
+  return /*#__PURE__*/_react["default"].createElement(_FormControlLabel["default"], {
+    id: checkboxId,
+    control: /*#__PURE__*/_react["default"].createElement(_Checkbox["default"], {
+      checked: checked,
+      onClick: onClickOption
+    }),
+    label: label,
+    "aria-labelledby": labelId
+  });
+}
+
+function CheckboxGroup(_ref2) {
+  var options = _ref2.options,
+      value = _ref2.value,
+      id = _ref2.id,
+      handleChange = _ref2.handleChange;
+  var optionsEl = options.map(function (option, index) {
+    var label = option.label,
+        response = option.response;
+
+    if (response && value) {
+      var name = response.name;
+
+      if (name in value) {
+        var checked = value[name] || false;
+        var checkboxId = "lunatic-checkbox-".concat(id, "-").concat(name);
+        var labelId = "lunatic-checkbox-label-".concat(id, "-").concat(name);
+        return /*#__PURE__*/_react["default"].createElement(CheckBoxOption, {
+          key: name,
+          checkboxId: checkboxId,
+          index: index,
+          label: label,
+          labelId: labelId,
+          checked: checked,
+          response: response,
+          handleChange: handleChange
+        });
+      }
+    }
+
+    return null;
+  });
+  return /*#__PURE__*/_react["default"].createElement(_FormGroup["default"], null, optionsEl);
+}
+
+var _default = CheckboxGroup;
+exports["default"] = _default;

package/lib/stories/custom-mui/checkbox-one-mui.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function CheckboxOneMui() {
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, "Use Radio group please!");
+}
+
+var _default = CheckboxOneMui;
+exports["default"] = _default;

package/lib/stories/custom-mui/index.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "CheckboxBoolean", {
+  enumerable: true,
+  get: function get() {
+    return _checkboxBooleanMui["default"];
+  }
+});
+Object.defineProperty(exports, "CheckboxGroup", {
+  enumerable: true,
+  get: function get() {
+    return _checkboxGroupMui["default"];
+  }
+});
+Object.defineProperty(exports, "CheckboxOne", {
+  enumerable: true,
+  get: function get() {
+    return _checkboxOneMui["default"];
+  }
+});
+Object.defineProperty(exports, "Input", {
+  enumerable: true,
+  get: function get() {
+    return _inputMui["default"];
+  }
+});
+Object.defineProperty(exports, "InputNumber", {
+  enumerable: true,
+  get: function get() {
+    return _inputNumberMui["default"];
+  }
+});
+Object.defineProperty(exports, "Radio", {
+  enumerable: true,
+  get: function get() {
+    return _radioMui["default"];
+  }
+});
+Object.defineProperty(exports, "Suggester", {
+  enumerable: true,
+  get: function get() {
+    return _suggesterMui["default"];
+  }
+});
+Object.defineProperty(exports, "Switch", {
+  enumerable: true,
+  get: function get() {
+    return _switchMui["default"];
+  }
+});
+Object.defineProperty(exports, "Table", {
+  enumerable: true,
+  get: function get() {
+    return _tableMui["default"];
+  }
+});
+Object.defineProperty(exports, "Tbody", {
+  enumerable: true,
+  get: function get() {
+    return _tbodyMui["default"];
+  }
+});
+Object.defineProperty(exports, "Td", {
+  enumerable: true,
+  get: function get() {
+    return _tdMui["default"];
+  }
+});
+Object.defineProperty(exports, "Textarea", {
+  enumerable: true,
+  get: function get() {
+    return _textareaMui["default"];
+  }
+});
+Object.defineProperty(exports, "Th", {
+  enumerable: true,
+  get: function get() {
+    return _thMui["default"];
+  }
+});
+Object.defineProperty(exports, "Thead", {
+  enumerable: true,
+  get: function get() {
+    return _theadMui["default"];
+  }
+});
+Object.defineProperty(exports, "TrMui", {
+  enumerable: true,
+  get: function get() {
+    return _trMui["default"];
+  }
+});
+
+var _inputNumberMui = _interopRequireDefault(require("./input-number-mui"));
+
+var _switchMui = _interopRequireDefault(require("./switch-mui"));
+
+var _tableMui = _interopRequireDefault(require("./table-mui"));
+
+var _theadMui = _interopRequireDefault(require("./thead-mui"));
+
+var _tbodyMui = _interopRequireDefault(require("./tbody-mui"));
+
+var _thMui = _interopRequireDefault(require("./th-mui"));
+
+var _tdMui = _interopRequireDefault(require("./td-mui"));
+
+var _inputMui = _interopRequireDefault(require("./input-mui"));
+
+var _trMui = _interopRequireDefault(require("./tr-mui"));
+
+var _textareaMui = _interopRequireDefault(require("./textarea-mui"));
+
+var _suggesterMui = _interopRequireDefault(require("./suggester-mui"));
+
+var _checkboxBooleanMui = _interopRequireDefault(require("./checkbox-boolean-mui"));
+
+var _checkboxGroupMui = _interopRequireDefault(require("./checkbox-group-mui"));
+
+var _checkboxOneMui = _interopRequireDefault(require("./checkbox-one-mui"));
+
+var _radioMui = _interopRequireDefault(require("./radio-mui"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/lib/stories/custom-mui/input-mui.js

@@ -0,0 +1,61 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function checkValue(value) {
+  return value || '';
+}
+
+function InputMui(_ref) {
+  var value = _ref.value,
+      onChange = _ref.onChange,
+      disabled = _ref.disabled,
+      required = _ref.required,
+      maxLength = _ref.maxLength,
+      id = _ref.id,
+      labelledBy = _ref.labelledBy,
+      readOnly = _ref.readOnly;
+  var handleChange = (0, _react.useCallback)(function (e) {
+    var value = e.target.value;
+    onChange(value);
+  }, [onChange]);
+  return /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
+    id: "lunatic-mui-".concat(id),
+    "aria-labelledby": labelledBy,
+    autoComplete: "off",
+    type: "text",
+    disabled: disabled,
+    className: (0, _classnames["default"])('lunatic-mui-input'),
+    value: checkValue(value),
+    onChange: handleChange,
+    "aria-required": required,
+    required: required,
+    maxLength: maxLength,
+    readOnly: readOnly
+  });
+}
+
+InputMui.defaultProps = {
+  disabled: false,
+  required: true,
+  maxLength: Number.MAX_SAFE_INTEGER
+};
+var _default = InputMui;
+exports["default"] = _default;

package/lib/stories/custom-mui/input-number-mui.js

@@ -0,0 +1,47 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function InputNumberMui(_ref) {
+  var value = _ref.value,
+      onChange = _ref.onChange,
+      disabled = _ref.disabled,
+      readOnly = _ref.readOnly,
+      labelId = _ref.labelId,
+      min = _ref.min,
+      max = _ref.max,
+      step = _ref.step;
+  var handleChange = (0, _react.useCallback)(function (e) {
+    var value = e.target.value;
+    onChange(value);
+  }, [onChange]);
+  return /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
+    type: "number",
+    onChange: handleChange,
+    value: value,
+    disabled: disabled,
+    "aria-labelledby": labelId,
+    min: min,
+    max: max,
+    step: step,
+    readOnly: readOnly
+  });
+}
+
+var _default = InputNumberMui;
+exports["default"] = _default;