@inseefr/lunatic 3.0.0-rc.1 → 3.0.0-rc.5

package/lib/components/Sequence/Sequence.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Sequence = void 0;
 require("./Sequence.scss");
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _LabelDescription = require("../shared/LabelDescription");
 var _Declarations = require("../shared/Declarations/Declarations");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -30,4 +30,4 @@ function LunaticSequence(_ref) {
     })]
   });
 }
-var Sequence = exports.Sequence = (0, _customizedComponent.customizedComponent)('Sequence', LunaticSequence);
+var Sequence = exports.Sequence = (0, _slottableComponent.slottableComponent)('Sequence', LunaticSequence);

package/lib/components/Subsequence/Subsequence.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Subsequence = void 0;
 var _Declarations = require("../shared/Declarations/Declarations");
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function LunaticSubsequence(_ref) {
   var id = _ref.id,
@@ -24,4 +24,4 @@ function LunaticSubsequence(_ref) {
     })]
   });
 }
-var Subsequence = exports.Subsequence = (0, _customizedComponent.customizedComponent)('Subsequence', LunaticSubsequence);
+var Subsequence = exports.Subsequence = (0, _slottableComponent.slottableComponent)('Subsequence', LunaticSubsequence);

package/lib/components/Suggester/CustomSuggester.js

@@ -8,7 +8,7 @@ exports.CustomSuggester = void 0;
 var _react = require("react");
 var _function = require("../../utils/function");
 var _i18n = _interopRequireDefault(require("../../i18n"));
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _Combobox = require("../shared/Combobox/Combobox");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -21,7 +21,7 @@ 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; }
-var CustomSuggester = exports.CustomSuggester = (0, _customizedComponent.customizedComponent)('Suggester', function (_ref) {
+var CustomSuggester = exports.CustomSuggester = (0, _slottableComponent.slottableComponent)('Suggester', function (_ref) {
   var className = _ref.className,
     _ref$classNamePrefix = _ref.classNamePrefix,
     classNamePrefix = _ref$classNamePrefix === void 0 ? 'lunatic' : _ref$classNamePrefix,

package/lib/components/Suggester/SuggesterNotification.js

@@ -7,7 +7,7 @@ exports.SuggesterNotification = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _SuggesterStatus = require("./SuggesterStatus");
 var _Notification = require("../shared/Notification");
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _Label = require("../shared/Label/Label");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -57,4 +57,4 @@ function LunaticSuggesterNotification(_ref) {
     children: children
   });
 }
-var SuggesterNotification = exports.SuggesterNotification = (0, _customizedComponent.customizedComponent)('SuggesterNotification', LunaticSuggesterNotification);
+var SuggesterNotification = exports.SuggesterNotification = (0, _slottableComponent.slottableComponent)('SuggesterNotification', LunaticSuggesterNotification);

package/lib/components/Summary/Summary.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Summary = Summary;
 exports.SummaryTitle = exports.SummaryResponses = void 0;
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -61,14 +61,14 @@ function Summary(props) {
 /**
  * Title displayed on top of the Summary
  */
-var SummaryTitle = exports.SummaryTitle = (0, _customizedComponent.customizedComponent)('SummaryTitle', function (_ref) {
+var SummaryTitle = exports.SummaryTitle = (0, _slottableComponent.slottableComponent)('SummaryTitle', function (_ref) {
   var label = _ref.label;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     className: "lunatic-summary-label",
     children: label
   });
 });
-var SummaryResponses = exports.SummaryResponses = (0, _customizedComponent.customizedComponent)('SummaryResponses', function (_ref2) {
+var SummaryResponses = exports.SummaryResponses = (0, _slottableComponent.slottableComponent)('SummaryResponses', function (_ref2) {
   var sections = _ref2.sections;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: sections.map(function (section, index) {

package/lib/components/Switch/Switch.js

@@ -1,45 +1,66 @@
 "use strict";
 
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Switch = void 0;
+exports.Switch = exports.CustomSwitch = void 0;
 var _ComponentErrors = require("../shared/ComponentErrors/ComponentErrors");
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _Label = require("../shared/Label/Label");
 var _Declarations = require("../shared/Declarations/Declarations");
 var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["handleChange", "response", "errors", "value", "statusLabel"];
 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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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 defaultLabel = {
   "true": 'True',
   "false": 'False'
 };
 function LunaticSwitch(_ref) {
-  var id = _ref.id,
-    value = _ref.value,
-    _ref$statusLabel = _ref.statusLabel,
-    statusLabel = _ref$statusLabel === void 0 ? defaultLabel : _ref$statusLabel,
-    handleChange = _ref.handleChange,
+  var handleChange = _ref.handleChange,
     response = _ref.response,
-    label = _ref.label,
     errors = _ref.errors,
-    disabled = _ref.disabled,
-    declarations = _ref.declarations;
+    value = _ref.value,
+    statusLabel = _ref.statusLabel,
+    props = _objectWithoutProperties(_ref, _excluded);
   var checked = value !== null && value !== void 0 ? value : false;
-  var handleClick = function handleClick() {
-    handleChange(response, !checked);
-  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomSwitch, _objectSpread(_objectSpread({}, props), {}, {
+    statusLabel: statusLabel !== null && statusLabel !== void 0 ? statusLabel : defaultLabel,
+    checked: value !== null && value !== void 0 ? value : false,
+    onChange: function onChange() {
+      return handleChange(response, !checked);
+    },
+    errors: (0, _ComponentErrors.getComponentErrors)(errors, props.id)
+  }));
+}
+var CustomSwitch = exports.CustomSwitch = (0, _slottableComponent.slottableComponent)('Switch', function (props) {
+  var id = props.id,
+    onChange = props.onChange,
+    checked = props.checked,
+    _props$statusLabel = props.statusLabel,
+    statusLabel = _props$statusLabel === void 0 ? defaultLabel : _props$statusLabel,
+    label = props.label,
+    errors = props.errors,
+    disabled = props.disabled,
+    declarations = props.declarations;
+  var labelTrue = statusLabel["true"],
+    labelFalse = statusLabel["false"];
+  var labelId = "lunatic-switch-label-".concat(id);
   var handleKeyDown = function handleKeyDown(e) {
     var code = e.code;
     if (code === 'Space') {
-      handleChange(response, !checked);
+      onChange();
     }
   };
-  var labelTrue = statusLabel["true"],
-    labelFalse = statusLabel["false"];
-  var labelId = "lunatic-switch-label-".concat(id);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Label.Label, {
       htmlFor: id,
@@ -66,7 +87,7 @@ function LunaticSwitch(_ref) {
           disabled: disabled,
           checked: checked
         }),
-        onClick: handleClick,
+        onClick: onChange,
         onKeyDown: handleKeyDown,
         "aria-labelledby": labelId,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -79,9 +100,8 @@ function LunaticSwitch(_ref) {
         children: labelTrue
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ComponentErrors.ComponentErrors, {
-      errors: errors,
-      componentId: id
+      errors: errors
     })]
   });
-}
-var Switch = exports.Switch = (0, _customizedComponent.customizedComponent)('Switch', LunaticSwitch);
+});
+var Switch = exports.Switch = (0, _slottableComponent.slottableComponent)('Switch', LunaticSwitch);

package/lib/components/Textarea/Textarea.js

@@ -1,34 +1,53 @@
 "use strict";
 
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Textarea = void 0;
+exports.CustomTextarea = void 0;
+exports.Textarea = Textarea;
 require("./Textarea.scss");
 var _Label = require("../shared/Label/Label");
 var _ComponentErrors = require("../shared/ComponentErrors/ComponentErrors");
-var _customizedComponent = require("../shared/HOC/customizedComponent");
+var _slottableComponent = require("../shared/HOC/slottableComponent");
 var _Declarations = require("../shared/Declarations/Declarations");
 var _jsxRuntime = require("react/jsx-runtime");
-function LunaticTextarea(_ref) {
-  var id = _ref.id,
-    rows = _ref.rows,
-    maxLength = _ref.maxLength,
-    cols = _ref.cols,
-    value = _ref.value,
-    label = _ref.label,
-    handleChange = _ref.handleChange,
+var _excluded = ["handleChange", "response", "errors"];
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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; }
+function Textarea(_ref) {
+  var handleChange = _ref.handleChange,
     response = _ref.response,
-    description = _ref.description,
     errors = _ref.errors,
-    placeHolder = _ref.placeHolder,
-    readOnly = _ref.readOnly,
-    required = _ref.required,
-    declarations = _ref.declarations;
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTextarea, _objectSpread(_objectSpread({}, props), {}, {
+    onChange: function onChange(v) {
+      return handleChange(response, v);
+    },
+    errors: (0, _ComponentErrors.getComponentErrors)(errors, props.id)
+  }));
+}
+var CustomTextarea = exports.CustomTextarea = (0, _slottableComponent.slottableComponent)('Input', function (props) {
+  var value = props.value,
+    _onChange = props.onChange,
+    disabled = props.disabled,
+    required = props.required,
+    maxLength = props.maxLength,
+    label = props.label,
+    description = props.description,
+    id = props.id,
+    errors = props.errors,
+    readOnly = props.readOnly,
+    declarations = props.declarations,
+    rows = props.rows,
+    cols = props.cols,
+    placeHolder = props.placeHolder;
   var labelId = "label-".concat(id);
-  var onChange = function onChange(e) {
-    handleChange(response, e.target.value);
-  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "lunatic-textarea",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Label.Label, {
@@ -42,19 +61,20 @@ function LunaticTextarea(_ref) {
       id: id
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("textarea", {
       required: required,
+      disabled: disabled,
       id: id,
       rows: rows,
       maxLength: maxLength,
       cols: cols,
-      onChange: onChange,
+      onChange: function onChange(e) {
+        return _onChange(e.target.value);
+      },
       value: value !== null && value !== void 0 ? value : '',
       placeholder: placeHolder,
       readOnly: readOnly,
       "aria-invalid": !!errors
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ComponentErrors.ComponentErrors, {
-      errors: errors,
-      componentId: id
+      errors: errors
     })]
   });
-}
-var Textarea = exports.Textarea = (0, _customizedComponent.customizedComponent)('Textarea', LunaticTextarea);
+});

package/lib/components/library.js

@@ -17,7 +17,6 @@ var _Textarea = require("./Textarea/Textarea");
 var _Switch = require("./Switch/Switch");
 var _FilterDescription = require("./FilterDescription/FilterDescription");
 var _Question = require("./Question/Question");
-var _ComponentSet = require("./ComponentSet/ComponentSet");
 var _InputNumber = require("./InputNumber/InputNumber");
 var _Duration = require("./Duration/Duration");
 var _Loop = require("./Loop/Loop");
@@ -45,7 +44,6 @@ var library = exports.library = {
   Textarea: _Textarea.Textarea,
   Switch: _Switch.Switch,
   Question: _Question.Question,
-  ComponentSet: _ComponentSet.ComponentSet,
   FilterDescription: _FilterDescription.FilterDescription,
   Dropdown: _Dropdown.Dropdown,
   PairwiseLinks: _PairwiseLinks.PairwiseLinks,

package/lib/components/shared/Button/Button.js

@@ -8,7 +8,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _dom = require("../../../utils/dom");
 var _isElement = require("../../../utils/is-element");
 require("./Button.scss");
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function LunaticButton(_ref) {
@@ -43,4 +43,4 @@ function LunaticButton(_ref) {
     })
   });
 }
-var Button = exports.Button = (0, _customizedComponent.customizedComponent)('Button', LunaticButton);
+var Button = exports.Button = (0, _slottableComponent.slottableComponent)('Button', LunaticButton);

package/lib/components/shared/Checkbox/CheckboxOption.js

@@ -9,7 +9,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _Icons = require("../Icons");
 require("./CheckboxOption.scss");
 var _reactKeyboardEventHandler = _interopRequireDefault(require("react-keyboard-event-handler"));
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _Label = require("../Label/Label");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -70,4 +70,4 @@ function LunaticCheckboxOption(_ref) {
     })]
   });
 }
-var CheckboxOption = exports.CheckboxOption = (0, _customizedComponent.customizedComponent)('CheckboxOption', LunaticCheckboxOption);
+var CheckboxOption = exports.CheckboxOption = (0, _slottableComponent.slottableComponent)('CheckboxOption', LunaticCheckboxOption);

package/lib/components/shared/Combobox/Combobox.js

@@ -15,7 +15,7 @@ var _ComboboxClearButton = require("./Selection/ComboboxClearButton");
 var _ComboboxSelection = require("./Selection/ComboboxSelection");
 var _number = require("../../../utils/number");
 var _Label = require("../Label/Label");
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 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(); }
@@ -204,4 +204,4 @@ function getDefaultOptionValue() {
     value = option.value;
   return id || value;
 }
-var Combobox = exports.Combobox = (0, _customizedComponent.customizedComponent)('Combobox', LunaticComboBox);
+var Combobox = exports.Combobox = (0, _slottableComponent.slottableComponent)('Combobox', LunaticComboBox);

package/lib/components/shared/Combobox/ComboboxContainer.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ComboboxContainer = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _ComponentErrors = require("../ComponentErrors/ComponentErrors");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-var ComboboxContainer = exports.ComboboxContainer = (0, _customizedComponent.customizedComponent)('ComboBoxContainer', function (_ref) {
+var ComboboxContainer = exports.ComboboxContainer = (0, _slottableComponent.slottableComponent)('ComboboxContainer', function (_ref) {
   var children = _ref.children,
     className = _ref.className,
     classNamePrefix = _ref.classNamePrefix,

package/lib/components/shared/Combobox/ComboboxContentBox.js

@@ -6,10 +6,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.ComboboxContentBox = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-var ComboboxContentBox = exports.ComboboxContentBox = (0, _customizedComponent.customizedComponent)('ComboboxContentBox', function (_ref) {
+var ComboboxContentBox = exports.ComboboxContentBox = (0, _slottableComponent.slottableComponent)('ComboboxContentBox', function (_ref) {
   var children = _ref.children,
     classNamePrefix = _ref.classNamePrefix,
     focused = _ref.focused;

package/lib/components/shared/Combobox/Panel/ComboboxOption.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ComboboxOption = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../../HOC/customizedComponent");
+var _slottableComponent = require("../../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-var ComboboxOption = exports.ComboboxOption = (0, _customizedComponent.customizedComponent)('ComboboxOption', function (_ref) {
+var ComboboxOption = exports.ComboboxOption = (0, _slottableComponent.slottableComponent)('ComboboxOption', function (_ref) {
   var option = _ref.option,
     selected = _ref.selected;
   var id = option.id,

package/lib/components/shared/Combobox/Panel/ComboboxPanelContainer.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ComboboxPanelContainer = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../../HOC/customizedComponent");
+var _slottableComponent = require("../../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-var ComboboxPanelContainer = exports.ComboboxPanelContainer = (0, _customizedComponent.customizedComponent)('ComboboxPanelContainer', function (_ref) {
+var ComboboxPanelContainer = exports.ComboboxPanelContainer = (0, _slottableComponent.slottableComponent)('ComboboxPanelContainer', function (_ref) {
   var children = _ref.children,
     focused = _ref.focused,
     expanded = _ref.expanded,

package/lib/components/shared/Combobox/Selection/ComboboxClearButton.js

@@ -7,7 +7,7 @@ exports.ComboboxClearButton = void 0;
 var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _Icons = require("../../Icons");
-var _customizedComponent = require("../../HOC/customizedComponent");
+var _slottableComponent = require("../../HOC/slottableComponent");
 var _IconButton = require("../../Button/IconButton");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -46,4 +46,4 @@ function LunaticComboboxClearButton(_ref) {
     })
   });
 }
-var ComboboxClearButton = exports.ComboboxClearButton = (0, _customizedComponent.customizedComponent)('ComboboxClearButton', LunaticComboboxClearButton);
+var ComboboxClearButton = exports.ComboboxClearButton = (0, _slottableComponent.slottableComponent)('ComboboxClearButton', LunaticComboboxClearButton);

package/lib/components/shared/Combobox/Selection/ComboboxInput.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ComboboxInput = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../../HOC/customizedComponent");
+var _slottableComponent = require("../../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 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); }
@@ -54,4 +54,4 @@ function LunaticComboboxInput(_ref) {
     onKeyDown: onKeydown
   });
 }
-var ComboboxInput = exports.ComboboxInput = (0, _customizedComponent.customizedComponent)('ComboboxInput', LunaticComboboxInput);
+var ComboboxInput = exports.ComboboxInput = (0, _slottableComponent.slottableComponent)('ComboboxInput', LunaticComboboxInput);

package/lib/components/shared/Combobox/Selection/ComboboxLabelSelection.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ComboboxLabelSelection = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../../HOC/customizedComponent");
+var _slottableComponent = require("../../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function getContent(option, search, placeholder) {
@@ -43,4 +43,4 @@ var LunaticComboBoxLabelSelection = function LunaticComboBoxLabelSelection(_ref)
     })
   });
 };
-var ComboboxLabelSelection = exports.ComboboxLabelSelection = (0, _customizedComponent.customizedComponent)('ComboboxLabelSelection', LunaticComboBoxLabelSelection);
+var ComboboxLabelSelection = exports.ComboboxLabelSelection = (0, _slottableComponent.slottableComponent)('ComboboxLabelSelection', LunaticComboBoxLabelSelection);

package/lib/components/shared/Declarations/Declarations.js

@@ -4,12 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Declarations = exports.Declaration = void 0;
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 require("./Declarations.scss");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-var Declaration = exports.Declaration = (0, _customizedComponent.customizedComponent)('Declaration', function (_ref) {
+var Declaration = exports.Declaration = (0, _slottableComponent.slottableComponent)('Declaration', function (_ref) {
   var children = _ref.children,
     type = _ref.type;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -44,4 +44,4 @@ function LunaticDeclarations(_ref2) {
     })
   });
 }
-var Declarations = exports.Declarations = (0, _customizedComponent.customizedComponent)('Declarations', LunaticDeclarations);
+var Declarations = exports.Declarations = (0, _slottableComponent.slottableComponent)('Declarations', LunaticDeclarations);

package/lib/components/shared/Fieldset/Fieldset.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Fieldset = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _LabelDescription = require("../LabelDescription");
 require("./Fieldset.scss");
 var _isElement = require("../../../utils/is-element");
@@ -41,4 +41,4 @@ function labelToReactNode(label) {
   }
   return "";
 }
-var Fieldset = exports.Fieldset = (0, _customizedComponent.customizedComponent)('Fieldset', LunaticFieldset);
+var Fieldset = exports.Fieldset = (0, _slottableComponent.slottableComponent)('Fieldset', LunaticFieldset);

package/lib/components/shared/HOC/{customizedComponent.js → slottableComponent.js}

@@ -3,27 +3,49 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.customizedComponent = customizedComponent;
+exports.SlotsProvider = void 0;
+exports.slottableComponent = slottableComponent;
 var _react = require("react");
-var _lunaticContext = require("../../../use-lunatic/lunatic-context");
 var _jsxRuntime = require("react/jsx-runtime");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 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; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } /**
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /**
+ * Contains the type of every customizable component
+ */
+var empty = {};
+var SlotsContext = /*#__PURE__*/(0, _react.createContext)(empty);
+var SlotsProvider = exports.SlotsProvider = function SlotsProvider(_ref) {
+  var slots = _ref.slots,
+    children = _ref.children;
+  if (!slots) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: children
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SlotsContext.Provider, {
+    value: slots !== null && slots !== void 0 ? slots : empty,
+    children: children
+  });
+};
+
+/**
  * Create a replaceable version of a component
+ *
+ * The component can be replaced using the "slots" props on <LunaticComponents>
  */
-function customizedComponent(name, LunaticField) {
-  var Memoized = /*#__PURE__*/(0, _react.memo)(LunaticField);
-  Memoized.displayName = name;
-  return function OverlayField(props) {
-    var custom = (0, _lunaticContext.useLunaticCustom)();
-    if (_typeof(custom) === 'object' && name in custom) {
-      var CustomComponent = custom[name];
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomComponent, _objectSpread({}, props));
+function slottableComponent(name, OriginalComponent) {
+  var DecoratedComponent = function DecoratedComponent(props) {
+    var _useContext;
+    var custom = (_useContext = (0, _react.useContext)(SlotsContext)) !== null && _useContext !== void 0 ? _useContext : empty;
+    if (custom && name in custom) {
+      var SlotComponent = custom[name];
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(SlotComponent, _objectSpread({}, props));
     }
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Memoized, _objectSpread({}, props));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(OriginalComponent, _objectSpread({}, props));
   };
+  DecoratedComponent.displayName = name;
+  return DecoratedComponent;
 }

package/lib/components/shared/Label/Label.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Label = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _LabelDescription = require("../LabelDescription");
 require("./Label.scss");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -33,4 +33,4 @@ function LunaticLabel(_ref) {
     })]
   });
 }
-var Label = exports.Label = (0, _customizedComponent.customizedComponent)('Label', LunaticLabel);
+var Label = exports.Label = (0, _slottableComponent.slottableComponent)('Label', LunaticLabel);

package/lib/components/shared/MDLabel/RouterLink.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.RouterLink = void 0;
-var _customizedComponent = require("../HOC/customizedComponent");
+var _slottableComponent = require("../HOC/slottableComponent");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["to", "children"];
 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; }
@@ -15,7 +15,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 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 RouterLink = exports.RouterLink = (0, _customizedComponent.customizedComponent)('RouterLink', function (props) {
+var RouterLink = exports.RouterLink = (0, _slottableComponent.slottableComponent)('RouterLink', function (props) {
   var to = props.to,
     children = props.children,
     rest = _objectWithoutProperties(props, _excluded);