@inseefr/lunatic 2.7.1 → 2.7.2

package/lib/components/duration/durationInput.js

@@ -10,7 +10,9 @@ var _object = require("../../utils/object");
 var _formatDuration = require("./formatDuration");
 var _getDurationFromValue = require("./getDurationFromValue");
 var _durationUtils = require("./durationUtils");
+var _classnames = _interopRequireDefault(require("classnames"));
 var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -25,7 +27,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var DurationInput = function DurationInput(_ref) {
   var value = _ref.value,
     format = _ref.format,
-    onChange = _ref.onChange;
+    onChange = _ref.onChange,
+    label = _ref.label;
   // We need to keep an internal state since one field can be empty (null value in duration)
   // but we still send "0" and we don't want the field to display "0"
   var _useState = (0, _react.useState)((0, _getDurationFromValue.getDurationFromValue)(value, format)),
@@ -39,19 +42,22 @@ var DurationInput = function DurationInput(_ref) {
       if (!e.target.checkValidity()) {
         return;
       }
-      var fieldValue = Number.isNaN(e.target.valueAsNumber) ? null : e.target.valueAsNumber;
+      var fieldValue = (0, _durationUtils.clampDuration)(Number.isNaN(e.target.valueAsNumber) ? null : e.target.valueAsNumber, unit);
       var newDuration = _objectSpread(_objectSpread({}, duration), {}, _defineProperty({}, unit, fieldValue));
       onChange((0, _formatDuration.formatDuration)(newDuration));
       setDuration(newDuration);
     };
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: "field-group",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "input-field-group",
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("fieldset", {
+    className: (0, _classnames["default"])('lunatic-input'),
+    children: [label && /*#__PURE__*/(0, _jsxRuntime.jsx)("legend", {
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "duration-fields",
       children: (0, _object.objectKeys)(duration).map(function (unit) {
         var _duration$unit;
-        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "duration-field",
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
             htmlFor: "".concat(unit, "Input"),
             className: "input-label",
@@ -65,7 +71,7 @@ var DurationInput = function DurationInput(_ref) {
           }, _durationUtils.propsByUnit[unit]))]
         }, unit);
       })
-    })
+    })]
   });
 };
 var _default = exports["default"] = DurationInput;

package/lib/components/duration/durationUtils.js

@@ -3,22 +3,39 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.clampDuration = clampDuration;
 exports.propsByUnit = exports.labelByUnit = void 0;
 var propsByUnit = exports.propsByUnit = {
   hours: {
-    min: '0',
-    max: '23'
+    min: 0,
+    max: 23,
+    size: 2,
+    style: {
+      width: '2.5em'
+    }
   },
   minutes: {
-    min: '0',
-    max: '59'
+    min: 0,
+    max: 59,
+    size: 2,
+    style: {
+      width: '2.5em'
+    }
   },
   months: {
-    min: '0',
-    max: '11'
+    min: 0,
+    max: 11,
+    size: 2,
+    style: {
+      width: '2.5em'
+    }
   },
   years: {
-    min: '0'
+    min: 0,
+    size: 4,
+    style: {
+      width: '4em'
+    }
   }
 };
 var labelByUnit = exports.labelByUnit = {
@@ -26,4 +43,17 @@ var labelByUnit = exports.labelByUnit = {
   minutes: 'Minutes :',
   months: 'Mois : ',
   years: 'Années :'
-};
+};
+function clampDuration(value, unit) {
+  if (value === null) {
+    return value;
+  }
+  var props = propsByUnit[unit];
+  if (value < props.min) {
+    return props.min;
+  }
+  if ('max' in props && value > props.max) {
+    return props.max;
+  }
+  return value;
+}

package/lib/components/input/html/__snapshots__/input.spec.tsx.snap

@@ -6,6 +6,7 @@ exports[`Input > renders without crashing 1`] = `
     class="lunatic-input"
   >
     <input
+      aria-invalid="false"
       aria-labelledby="label-input"
       autocomplete="off"
       id="input"
@@ -22,6 +23,7 @@ exports[`Input > should handle readOnly 1`] = `
     class="lunatic-input"
   >
     <input
+      aria-invalid="false"
       aria-labelledby="label-number"
       autocomplete="off"
       id="number"

package/lib/components/input/html/input.js

@@ -44,10 +44,10 @@ function Input(_ref) {
       onChange: handleChange,
       "aria-required": required,
       required: required,
-      maxLength: maxLength
+      maxLength: maxLength,
+      "aria-invalid": !!errors
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_commons.Errors, {
-      errors: errors,
-      activeId: id
+      errors: errors
     })]
   });
 }

package/lib/components/input/lunatic-input.js

@@ -7,6 +7,7 @@ exports["default"] = void 0;
 var _input = _interopRequireDefault(require("./html/input"));
 var _lunaticComponentWithoutLabel = _interopRequireDefault(require("../commons/components/lunatic-component-without-label"));
 var _useOnHandleChange = _interopRequireDefault(require("../commons/use-on-handle-change"));
+var _errors = require("../commons/components/errors/errors");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function LunaticInput(props) {
@@ -47,7 +48,7 @@ function LunaticInput(props) {
       onChange: onChange,
       label: label,
       disabled: disabled,
-      errors: errors,
+      errors: (0, _errors.getComponentErrors)(errors, id),
       required: required,
       maxLength: maxLength,
       readOnly: readOnly

package/lib/components/input-number/html/__snapshots__/input-number.spec.tsx.snap

@@ -6,13 +6,13 @@ exports[`InputNumber > renders without crashing 1`] = `
     class="lunatic-input-number"
   >
     <input
+      aria-invalid="false"
       aria-labelledby="label-input"
       class=""
       id="input"
       inputmode="numeric"
       lang="en"
       required=""
-      step="1"
       type="text"
       value=""
     />
@@ -26,6 +26,7 @@ exports[`InputNumber > should handle readOnly 1`] = `
     class="lunatic-input-number"
   >
     <input
+      aria-invalid="false"
       aria-labelledby="label-number"
       class=""
       id="number"
@@ -33,7 +34,6 @@ exports[`InputNumber > should handle readOnly 1`] = `
       lang="en"
       readonly=""
       required=""
-      step="1"
       type="text"
       value="123"
     />

package/lib/components/input-number/html/input-number-thousand.js

@@ -10,12 +10,6 @@ var _reactNumberFormat = require("react-number-format");
 var _i18n = require("../../../i18n");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var InputNumberThousand = function InputNumberThousand(_ref) {
   var id = _ref.id,
     onChange = _ref.onChange,
@@ -24,14 +18,9 @@ var InputNumberThousand = function InputNumberThousand(_ref) {
     readOnly = _ref.readOnly,
     required = _ref.required,
     labelId = _ref.labelId,
-    min = _ref.min,
     max = _ref.max,
-    decimals = _ref.decimals;
-  // Decimals is a number indicates the number behind the separator of decimals
-  // Computing step attribute of input according to decimal number
-  var _useState = (0, _react.useState)(decimals ? 1 / Math.pow(10, decimals) : 1),
-    _useState2 = _slicedToArray(_useState, 1),
-    step = _useState2[0];
+    decimals = _ref.decimals,
+    invalid = _ref.invalid;
   var handleChange = (0, _react.useCallback)(function (e) {
     var _e$floatValue;
     var val = (_e$floatValue = e.floatValue) !== null && _e$floatValue !== void 0 ? _e$floatValue : null;
@@ -49,9 +38,6 @@ var InputNumberThousand = function InputNumberThousand(_ref) {
     }),
     onValueChange: handleChange,
     value: value !== null && value !== void 0 ? value : '',
-    min: min,
-    max: max,
-    step: step,
     "aria-labelledby": labelId,
     disabled: disabled,
     readOnly: readOnly,
@@ -63,7 +49,8 @@ var InputNumberThousand = function InputNumberThousand(_ref) {
     decimalScale: decimals,
     allowLeadingZeros: true,
     thousandSeparator: _i18n.inputNumberPropsI18N.thousandSeparator,
-    inputMode: decimals ? 'decimal' : 'numeric'
+    inputMode: decimals ? 'decimal' : 'numeric',
+    "aria-invalid": invalid
   });
 };
 var _default = exports["default"] = InputNumberThousand;

package/lib/components/input-number/html/input-number.js

@@ -20,7 +20,6 @@ function InputNumber(_ref) {
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     _ref$readOnly = _ref.readOnly,
     readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    min = _ref.min,
     max = _ref.max,
     _ref$decimals = _ref.decimals,
     decimals = _ref$decimals === void 0 ? 0 : _ref$decimals,
@@ -46,14 +45,13 @@ function InputNumber(_ref) {
       readOnly: readOnly,
       required: required,
       labelId: labelId,
-      min: min,
       max: max,
-      decimals: decimals
+      decimals: decimals,
+      invalid: !!errors
     }), unit && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       children: unit
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_commons.Errors, {
-      errors: errors,
-      activeId: id
+      errors: errors
     })]
   });
 }

package/lib/components/input-number/lunatic-input-number.js

@@ -7,6 +7,7 @@ exports["default"] = void 0;
 var _lunaticComponentWithoutLabel = _interopRequireDefault(require("../commons/components/lunatic-component-without-label"));
 var _useOnHandleChange = _interopRequireDefault(require("../commons/use-on-handle-change"));
 var _inputNumber = _interopRequireDefault(require("./html/input-number"));
+var _errors = require("../commons/components/errors/errors");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function LunaticInputNumber(props) {
@@ -22,7 +23,6 @@ function LunaticInputNumber(props) {
     missing = props.missing,
     missingResponse = props.missingResponse,
     management = props.management,
-    min = props.min,
     max = props.max,
     decimals = props.decimals,
     unit = props.unit,
@@ -51,12 +51,11 @@ function LunaticInputNumber(props) {
       label: label,
       disabled: disabled,
       readOnly: readOnly,
-      min: min,
       max: max,
       decimals: decimals,
       unit: unit,
       required: required,
-      errors: errors
+      errors: (0, _errors.getComponentErrors)(errors, id)
     })
   });
 }

package/lib/components/loop/roster-for-loop/__snapshots__/roster-for-loop.spec.tsx.snap

@@ -0,0 +1,88 @@
+// Vitest Snapshot v1
+
+exports[`RosterForLoop > renders the right number of columns 1`] = `
+<div>
+  <table
+    class="lunatic-table"
+    id="table-table"
+  >
+    <tbody
+      class="lunatic-table-tbody"
+      id="lunatic-table-tbody-table"
+    >
+      <tr
+        class="lunatic-table-tr"
+        id="lunatic-table-tr-table-0"
+      >
+        <td
+          class="lunatic-table-td"
+          id="lunatic-table-td-jrc3ye5q-QOP-lo6tcvvx-0-0-undefined-undefined"
+        >
+          <div
+            class="field-container"
+          >
+            <div
+              class="field"
+            >
+              <div
+                class="lunatic-input"
+              >
+                <input
+                  aria-invalid="false"
+                  aria-labelledby="label-jrc3ye5q-QOP-lo6tcvvx-0"
+                  autocomplete="off"
+                  id="jrc3ye5q-QOP-lo6tcvvx-0"
+                  maxlength="249"
+                  type="text"
+                  value="azeaze"
+                />
+              </div>
+            </div>
+          </div>
+        </td>
+      </tr>
+      <tr
+        class="lunatic-table-tr"
+        id="lunatic-table-tr-table-1"
+      >
+        <td
+          class="lunatic-table-td"
+          id="lunatic-table-td-jrc3ye5q-QOP-lo6tcvvx-1-1-undefined-undefined"
+        >
+          <div
+            class="field-container"
+          >
+            <div
+              class="field"
+            >
+              <div
+                class="lunatic-input"
+              >
+                <input
+                  aria-invalid="false"
+                  aria-labelledby="label-jrc3ye5q-QOP-lo6tcvvx-1"
+                  autocomplete="off"
+                  id="jrc3ye5q-QOP-lo6tcvvx-1"
+                  maxlength="249"
+                  type="text"
+                  value="azeaze"
+                />
+              </div>
+            </div>
+          </div>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+  <input
+    class="button-lunatic"
+    type="button"
+    value="Ceci est un test"
+  />
+  <input
+    class="button-lunatic"
+    type="button"
+    value="Remove row"
+  />
+</div>
+`;

package/lib/components/loop/roster-for-loop/roster-for-loop.js

@@ -15,6 +15,7 @@ var _tableHeader = require("../../table/table-header");
 var _array = require("../../../utils/array");
 var _lunaticComponents = require("../../lunatic-components");
 var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["value", "lines", "handleChange", "declarations", "label", "headers", "iterations", "id", "getComponents"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -27,6 +28,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 var DEFAULT_MIN_ROWS = 1;
 var DEFAULT_MAX_ROWS = 12;
 
@@ -42,7 +45,8 @@ var RosterForLoop = exports.RosterForLoop = (0, _commons.createCustomizableLunat
     headers = props.headers,
     iterations = props.iterations,
     id = props.id,
-    getComponents = props.getComponents;
+    getComponents = props.getComponents,
+    otherProps = _objectWithoutProperties(props, _excluded);
   var min = (lines === null || lines === void 0 ? void 0 : lines.min) || DEFAULT_MIN_ROWS;
   var max = (lines === null || lines === void 0 ? void 0 : lines.max) || DEFAULT_MAX_ROWS;
   var _useState = (0, _react.useState)(iterations),
@@ -97,7 +101,7 @@ var RosterForLoop = exports.RosterForLoop = (0, _commons.createCustomizableLunat
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_lunaticComponents.LunaticComponents, {
               components: getComponents(n),
               componentProps: function componentProps(c) {
-                return _objectSpread(_objectSpread(_objectSpread({}, props), c), {}, {
+                return _objectSpread(_objectSpread(_objectSpread({}, otherProps), c), {}, {
                   id: "".concat(c.id, "-").concat(n)
                 });
               },
@@ -110,7 +114,7 @@ var RosterForLoop = exports.RosterForLoop = (0, _commons.createCustomizableLunat
                 });
               }
             })
-          });
+          }, n);
         })
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_declarations.DeclarationsDetachable, {

package/lib/components/loop/roster-for-loop/roster-for-loop.spec.js

@@ -0,0 +1,46 @@
+"use strict";
+
+var _vitest = require("vitest");
+var _react = require("@testing-library/react");
+var _rosterForLoop = require("./roster-for-loop");
+var _jsxRuntime = require("react/jsx-runtime");
+(0, _vitest.describe)('RosterForLoop', function () {
+  var mockOnChange = _vitest.vi.fn();
+  (0, _vitest.beforeEach)(function () {
+    mockOnChange.mockClear();
+  });
+  var getComponents = function getComponents(iteration) {
+    return [{
+      componentType: 'Input',
+      maxLength: 249,
+      id: 'jrc3ye5q-QOP-lo6tcvvx',
+      response: {
+        name: 'TABDYN1'
+      },
+      iteration: iteration,
+      value: 'azeaze'
+    }];
+  };
+  (0, _vitest.it)('renders the right number of columns', function () {
+    var _render = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_rosterForLoop.RosterForLoop, {
+        value: {
+          name: ['John Doe', 'Jane Doe']
+        },
+        handleChange: mockOnChange,
+        label: "Ceci est un test",
+        id: "table",
+        lines: {
+          min: 1,
+          max: 3
+        },
+        iterations: 2,
+        getComponents: getComponents,
+        executeExpression: function executeExpression() {
+          return null;
+        }
+      })),
+      container = _render.container;
+    (0, _vitest.expect)(container).toMatchSnapshot();
+    (0, _vitest.expect)(_react.screen.getAllByRole('row')).toHaveLength(2);
+  });
+});

package/lib/components/lunatic-components.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.LunaticComponents = LunaticComponents;
 var _react = require("react");
 var lunaticComponents = _interopRequireWildcard(require("./index"));
+var _useAutoFocus = require("../hooks/use-auto-focus");
 var _component = require("../use-lunatic/commons/component");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -33,18 +34,8 @@ function LunaticComponents(_ref) {
     } : _ref$wrapper;
   var wrapperRef = (0, _react.useRef)(null);
   var hasComponents = components.length > 0;
-  (0, _react.useEffect)(function () {
-    var _wrapperRef$current;
-    if (!autoFocusKey || !hasComponents || !wrapperRef.current) {
-      return;
-    }
-    var firstFocusableElement = (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-    // The first element can be focusable
-    if (firstFocusableElement) {
-      return firstFocusableElement.focus();
-    }
-  }, [autoFocusKey, hasComponents]);
   var WrapperComponent = autoFocusKey ? 'div' : _react.Fragment;
+  (0, _useAutoFocus.useAutoFocus)(wrapperRef, hasComponents ? autoFocusKey : undefined);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrapperComponent, {
     ref: WrapperComponent === _react.Fragment ? undefined : wrapperRef,
     children: components.map(function (component, k) {

package/lib/components/radio/html/radio-group-content.js

@@ -20,7 +20,8 @@ function RadioGroupContent(_ref) {
     checkboxStyle = _ref$checkboxStyle === void 0 ? false : _ref$checkboxStyle,
     shortcut = _ref.shortcut,
     disabled = _ref.disabled,
-    readOnly = _ref.readOnly;
+    readOnly = _ref.readOnly,
+    invalid = _ref.invalid;
   var onKeyDown = (0, _commons.useOptionsKeydown)(options, onClick);
   var maxIndex = options.length;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
@@ -43,7 +44,8 @@ function RadioGroupContent(_ref) {
         codeModality: shortcut ? codeModality : undefined,
         shortcut: shortcut,
         disabled: disabled,
-        readOnly: readOnly
+        readOnly: readOnly,
+        invalid: invalid
       }, radioId);
     })
   });

package/lib/components/radio/html/radio-group.js

@@ -35,10 +35,10 @@ function RadioGroup(_ref) {
       options: options,
       shortcut: shortcut,
       disabled: disabled,
-      readOnly: readOnly
+      readOnly: readOnly,
+      invalid: !!errors
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_commons.Errors, {
-      errors: errors,
-      activeId: id
+      errors: errors
     })]
   });
 }

package/lib/components/radio/html/radio-option.js

@@ -30,7 +30,8 @@ function RadioOption(_ref) {
     description = _ref.description,
     shortcut = _ref.shortcut,
     codeModality = _ref.codeModality,
-    readOnly = _ref.readOnly;
+    readOnly = _ref.readOnly,
+    invalid = _ref.invalid;
   var spanEl = (0, _react.useRef)(null);
   var Icon = getIcon(checked, checkboxStyle);
   var tabIndex = checked ? 0 : -1;
@@ -65,6 +66,7 @@ function RadioOption(_ref) {
           disabled: disabled,
           readOnly: readOnly
         }),
+        "aria-invalid": invalid,
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
           id: id,
           role: "radio",

package/lib/components/radio/lunatic-radio-group.js

@@ -8,6 +8,7 @@ var _radioGroup = _interopRequireDefault(require("./html/radio-group"));
 var _lunaticComponentWithoutLabel = _interopRequireDefault(require("../commons/components/lunatic-component-without-label"));
 var _useOnHandleChange = _interopRequireDefault(require("../commons/use-on-handle-change"));
 var _commons = require("../commons");
+var _errors = require("../commons/components/errors/errors");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function LunaticRadioGroup(props) {
@@ -52,7 +53,7 @@ function LunaticRadioGroup(props) {
       value: value,
       onSelect: onChange,
       checkboxStyle: checkboxStyle,
-      errors: errors,
+      errors: (0, _errors.getComponentErrors)(errors, id),
       label: label,
       className: className,
       shortcut: shortcut,

package/lib/components/suggester/find-best-label/find-best-label.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _createWorker = require("../../../utils/suggester-workers/create-worker");
+var _workerPath = require("../../../utils/suggester-workers/worker-path");
 // @ts-ignore
 
-var WORKER_PATH = process.env.LUNATIC_LABEL_WORKER_PATH || process.env.REACT_APP_LUNATIC_LABEL_WORKER_PATH || '';
 var WORKER;
 var TASKS = new Map();
 function getIdTask() {
@@ -17,9 +17,9 @@ function getIdTask() {
   }
   return id;
 }
-function getWorker() {
+function getWorker(workersBasePath) {
   if (!WORKER) {
-    WORKER = (0, _createWorker.createWorker)(WORKER_PATH);
+    WORKER = (0, _createWorker.createWorker)((0, _workerPath.getWorkerPath)(_workerPath.WorkerEnum.LABEL, workersBasePath));
     WORKER.addEventListener('message', function (e) {
       var data = e.data;
       var response = data.response,
@@ -31,10 +31,10 @@ function getWorker() {
   }
   return WORKER;
 }
-function findBestLabel(option, search) {
+function findBestLabel(option, search, workersBasePath) {
   return new Promise(function (resolve) {
     var idTask = getIdTask();
-    var worker = getWorker();
+    var worker = getWorker(workersBasePath);
     TASKS.set(idTask, function (response) {
       resolve(response);
       TASKS["delete"](idTask);

package/lib/components/suggester/idb-suggester/check-store.js

@@ -19,10 +19,13 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+/**
+ * Check the store info displaying a message while it is fetching
+ */
 function CheckStore(_ref) {
   var storeName = _ref.storeName,
     version = _ref.version,
-    setStore = _ref.setStore,
+    onInfo = _ref.onInfo,
     children = _ref.children;
   var _useState = (0, _react.useState)(0),
     _useState2 = _slicedToArray(_useState, 2),
@@ -48,7 +51,7 @@ function CheckStore(_ref) {
           info = _context.sent;
           if (db && info) {
             setReady(200);
-            setStore(info);
+            onInfo(info);
           }
           _context.next = 13;
           break;
@@ -61,7 +64,7 @@ function CheckStore(_ref) {
           return _context.stop();
       }
     }, _callee, null, [[0, 10]]);
-  })), [storeName, version, setStore]);
+  })), [storeName, version, onInfo]);
   (0, _react.useEffect)(function () {
     checkStore();
   }, [checkStore]);