arengibook 2.4.589 → 2.4.591

package/dist/index.js

@@ -5748,6 +5748,31 @@ function _arrayWithHoles$8(r) {
 function _arrayWithoutHoles$6(r) {
   if (Array.isArray(r)) return _arrayLikeToArray$a(r);
 }
+function asyncGeneratorStep(n, t, e, r, o, a, c) {
+  try {
+    var i = n[a](c),
+      u = i.value;
+  } catch (n) {
+    return void e(n);
+  }
+  i.done ? t(u) : Promise.resolve(u).then(r, o);
+}
+function _asyncToGenerator(n) {
+  return function () {
+    var t = this,
+      e = arguments;
+    return new Promise(function (r, o) {
+      var a = n.apply(t, e);
+      function _next(n) {
+        asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
+      }
+      function _throw(n) {
+        asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
+      }
+      _next(void 0);
+    });
+  };
+}
 function _defineProperty$a(e, r, t) {
   return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
     value: t,
@@ -5839,6 +5864,116 @@ function _objectWithoutPropertiesLoose$2(r, e) {
   }
   return t;
 }
+function _regenerator() {
+  /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
+  var e,
+    t,
+    r = "function" == typeof Symbol ? Symbol : {},
+    n = r.iterator || "@@iterator",
+    o = r.toStringTag || "@@toStringTag";
+  function i(r, n, o, i) {
+    var c = n && n.prototype instanceof Generator ? n : Generator,
+      u = Object.create(c.prototype);
+    return _regeneratorDefine(u, "_invoke", function (r, n, o) {
+      var i,
+        c,
+        u,
+        f = 0,
+        p = o || [],
+        y = false,
+        G = {
+          p: 0,
+          n: 0,
+          v: e,
+          a: d,
+          f: d.bind(e, 4),
+          d: function (t, r) {
+            return i = t, c = 0, u = e, G.n = r, a;
+          }
+        };
+      function d(r, n) {
+        for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
+          var o,
+            i = p[t],
+            d = G.p,
+            l = i[2];
+          r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
+        }
+        if (o || r > 1) return a;
+        throw y = true, n;
+      }
+      return function (o, p, l) {
+        if (f > 1) throw TypeError("Generator is already running");
+        for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
+          i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
+          try {
+            if (f = 2, i) {
+              if (c || (o = "next"), t = i[o]) {
+                if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
+                if (!t.done) return t;
+                u = t.value, c < 2 && (c = 0);
+              } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
+              i = e;
+            } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
+          } catch (t) {
+            i = e, c = 1, u = t;
+          } finally {
+            f = 1;
+          }
+        }
+        return {
+          value: t,
+          done: y
+        };
+      };
+    }(r, o, i), true), u;
+  }
+  var a = {};
+  function Generator() {}
+  function GeneratorFunction() {}
+  function GeneratorFunctionPrototype() {}
+  t = Object.getPrototypeOf;
+  var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
+      return this;
+    }), t),
+    u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
+  function f(e) {
+    return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
+  }
+  return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
+    return this;
+  }), _regeneratorDefine(u, "toString", function () {
+    return "[object Generator]";
+  }), (_regenerator = function () {
+    return {
+      w: i,
+      m: f
+    };
+  })();
+}
+function _regeneratorDefine(e, r, n, t) {
+  var i = Object.defineProperty;
+  try {
+    i({}, "", {});
+  } catch (e) {
+    i = 0;
+  }
+  _regeneratorDefine = function (e, r, n, t) {
+    if (r) i ? i(e, r, {
+      value: n,
+      enumerable: !t,
+      configurable: !t,
+      writable: !t
+    }) : e[r] = n;else {
+      function o(r, n) {
+        _regeneratorDefine(e, r, function (e) {
+          return this._invoke(r, n, e);
+        });
+      }
+      o("next", 0), o("throw", 1), o("return", 2);
+    }
+  }, _regeneratorDefine(e, r, n, t);
+}
 function _slicedToArray$8(r, e) {
   return _arrayWithHoles$8(r) || _iterableToArrayLimit$8(r, e) || _unsupportedIterableToArray$a(r, e) || _nonIterableRest$8();
 }
@@ -35813,6 +35948,8 @@ var PopupPresets = {
 var Dropdown = function Dropdown(_ref) {
   var _ref$options = _ref.options,
     options = _ref$options === void 0 ? [] : _ref$options,
+    _ref$optionLoad = _ref.optionLoad,
+    optionLoad = _ref$optionLoad === void 0 ? null : _ref$optionLoad,
     _ref$isGroupedOption = _ref.isGroupedOption,
     isGroupedOption = _ref$isGroupedOption === void 0 ? false : _ref$isGroupedOption,
     value = _ref.value,
@@ -35863,52 +36000,22 @@ var Dropdown = function Dropdown(_ref) {
     _useState2 = _slicedToArray$8(_useState, 2),
     optionSelected = _useState2[0],
     setOptionSelected = _useState2[1];
-  var items = useRef(Array.from({
-    length: 100000
-  }));
+  var items = useRef([]);
   var _useState3 = useState(false),
     _useState4 = _slicedToArray$8(_useState3, 2),
     loading = _useState4[0],
     setLoading = _useState4[1];
-  var loadLazyTimeout = useRef();
+  var loadedOptionsRef = useRef([]);
+  var currentPageRef = useRef(1);
+  var isLazy = typeof optionLoad === 'function';
   useEffect(function () {
     setOptionSelected(value !== null && value !== void 0 ? value : null);
   }, [value]);
   useEffect(function () {
-    var handleScroll = function handleScroll(e) {
-      var target = e.target;
-
-      // Si on scroll dans la liste elle-même (aucun effet de suppression de liste)
-      if (target.closest && target.closest('.p-dropdown-panel')) {
-        return;
-      }
-      // Sinon, le zone de liste est fermée
-      var dropdownPanels = document.querySelectorAll('.p-dropdown-panel');
-      dropdownPanels.forEach(function (panel) {
-        if (panel && panel.style.display !== 'none') {
-          document.body.click(); // Déclenche un "click outside"
-        }
-      });
-    };
-    window.addEventListener('scroll', handleScroll, true);
-    return function () {
-      window.removeEventListener('scroll', handleScroll, true);
-    };
-  }, []);
-  var resetDropdownFilter = function resetDropdownFilter() {
-    setTimeout(function () {
-      var dropdownPanels = document.querySelectorAll('.p-dropdown-panel');
-      dropdownPanels.forEach(function (panel) {
-        var input = panel.querySelector('.p-dropdown-filter');
-        if (input) {
-          input.value = '';
-          input.dispatchEvent(new Event('input', {
-            bubbles: true
-          }));
-        }
-      });
-    }, 50);
-  };
+    if (!isLazy) {
+      items.current = options;
+    }
+  }, [options, isLazy]);
   var style = {
     border: invalid ? '1px solid red' : '1px solid #ccc',
     width: '100%'
@@ -35918,7 +36025,7 @@ var Dropdown = function Dropdown(_ref) {
     var g = parseInt(hexColor.substr(3, 2), 16);
     var b = parseInt(hexColor.substr(5, 2), 16);
     var luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
-    return luminance > 0.5 ? '#000000' : '#FFFFFF';
+    return luminance > 0.18 ? '#000000' : '#FFFFFF';
   };
   var optionTemplate = function optionTemplate(option) {
     if (!isSelectMeta) {
@@ -35926,7 +36033,7 @@ var Dropdown = function Dropdown(_ref) {
         style: _objectSpread2({
           fontSize: '14px'
         }, optionStyle)
-      }, option.label);
+      }, option === null || option === void 0 ? void 0 : option[optionLabel]);
     } else {
       var _ref2 = selectMetaConfig || {},
         labelStyle = _ref2.labelStyle,
@@ -35951,7 +36058,7 @@ var Dropdown = function Dropdown(_ref) {
         className: generalIcon
       }), /*#__PURE__*/React__default.createElement("span", {
         style: styleLabel
-      }, option === null || option === void 0 ? void 0 : option.label)));
+      }, option === null || option === void 0 ? void 0 : option[optionLabel])));
     }
   };
   var valueTemplate = function valueTemplate(option) {
@@ -35960,16 +36067,16 @@ var Dropdown = function Dropdown(_ref) {
       return /*#__PURE__*/React__default.createElement("div", {
         style: _objectSpread2({
           backgroundColor: option === null || option === void 0 ? void 0 : option.color,
-          color: 'white',
+          color: iconColor,
           padding: '0.5rem',
           borderRadius: '1rem',
           display: 'inline-block'
         }, valueStyle)
-      }, option !== null && option !== void 0 && option.label ? /*#__PURE__*/React__default.createElement("span", {
+      }, option !== null && option !== void 0 && option[optionLabel] ? /*#__PURE__*/React__default.createElement("span", {
         style: {
           color: iconColor
         }
-      }, option === null || option === void 0 ? void 0 : option.label) : /*#__PURE__*/React__default.createElement("span", {
+      }, option === null || option === void 0 ? void 0 : option[optionLabel]) : /*#__PURE__*/React__default.createElement("span", {
         style: {
           color: '#000000'
         }
@@ -35980,28 +36087,54 @@ var Dropdown = function Dropdown(_ref) {
           fontFamily: 'Arial',
           fontSize: '14px'
         }, valueStyle)
-      }, (option === null || option === void 0 ? void 0 : option.label) || placeholder);
-    }
-  };
-  var onLazyLoad = function onLazyLoad(event) {
-    setLoading(true);
-    if (loadLazyTimeout.current) {
-      clearTimeout(loadLazyTimeout.current);
-    }
-    loadLazyTimeout.current = setTimeout(function () {
-      var first = event.first,
-        last = event.last;
-      var _items = _toConsumableArray$6(items.current);
-      for (var i = first; i < last; i++) {
-        _items[i] = {
-          label: "Item #".concat(i),
-          value: i
-        };
-      }
-      items.current = _items;
-      setLoading(false);
-    }, Math.random() * 1000 + 250);
-  };
+      }, (option === null || option === void 0 ? void 0 : option[optionLabel]) || placeholder);
+    }
+  };
+  var onLazyLoad = /*#__PURE__*/function () {
+    var _ref3 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(event) {
+      var _event$filter;
+      var search, _res$options, _res$additional$page, _res$additional, res, newOptions, _t;
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
+          case 0:
+            if (!(!isLazy || !optionLoad)) {
+              _context.n = 1;
+              break;
+            }
+            return _context.a(2);
+          case 1:
+            setLoading(true);
+            search = (_event$filter = event === null || event === void 0 ? void 0 : event.filter) !== null && _event$filter !== void 0 ? _event$filter : '';
+            _context.p = 2;
+            _context.n = 3;
+            return optionLoad(search, loadedOptionsRef.current, {
+              page: currentPageRef.current
+            });
+          case 3:
+            res = _context.v;
+            newOptions = (_res$options = res === null || res === void 0 ? void 0 : res.options) !== null && _res$options !== void 0 ? _res$options : [];
+            loadedOptionsRef.current = [].concat(_toConsumableArray$6(loadedOptionsRef.current), _toConsumableArray$6(newOptions));
+            items.current = loadedOptionsRef.current;
+            currentPageRef.current = (_res$additional$page = res === null || res === void 0 || (_res$additional = res.additional) === null || _res$additional === void 0 ? void 0 : _res$additional.page) !== null && _res$additional$page !== void 0 ? _res$additional$page : currentPageRef.current + 1;
+            _context.n = 5;
+            break;
+          case 4:
+            _context.p = 4;
+            _t = _context.v;
+            console.error('Erreur optionLoad:', _t);
+          case 5:
+            _context.p = 5;
+            setLoading(false);
+            return _context.f(5);
+          case 6:
+            return _context.a(2);
+        }
+      }, _callee, null, [[2, 4, 5, 6]]);
+    }));
+    return function onLazyLoad(_x) {
+      return _ref3.apply(this, arguments);
+    };
+  }();
   var handleChange = function handleChange(e) {
     var newValue = e.value;
     setOptionSelected(newValue);
@@ -36010,22 +36143,19 @@ var Dropdown = function Dropdown(_ref) {
     }
   };
   var groupedItemTemplate = function groupedItemTemplate(option) {
-    var _ref3 = groupedItemTemplateConfig || {},
-      showImage = _ref3.showImage,
-      imageKey = _ref3.imageKey,
-      imageStyle = _ref3.imageStyle,
-      showIcon = _ref3.showIcon,
-      iconKey = _ref3.iconKey,
-      labelStyle = _ref3.labelStyle,
-      generalIcon = _ref3.generalIcon,
-      generalImage = _ref3.generalImage;
+    var _ref4 = groupedItemTemplateConfig || {},
+      showImage = _ref4.showImage,
+      imageKey = _ref4.imageKey,
+      imageStyle = _ref4.imageStyle,
+      showIcon = _ref4.showIcon,
+      iconKey = _ref4.iconKey,
+      labelStyle = _ref4.labelStyle,
+      generalIcon = _ref4.generalIcon,
+      generalImage = _ref4.generalImage;
     var icon = option.value && option.value[iconKey];
-    var styleLabel = {};
-    if (generalIcon || generalIcon || showImage && option[imageKey] || showIcon && icon) {
-      styleLabel = {
-        'marginLeft': '10px'
-      };
-    }
+    var styleLabel = generalIcon || showImage && option[imageKey] || showIcon && icon ? {
+      marginLeft: '10px'
+    } : {};
     if (option.group) {
       return /*#__PURE__*/React__default.createElement("div", {
         className: "flex align-items-center"
@@ -36035,11 +36165,11 @@ var Dropdown = function Dropdown(_ref) {
           fontWeight: 'bold'
         }, labelStyle)
       }, generalIcon && /*#__PURE__*/React__default.createElement("i", {
+        className: generalIcon,
         style: _objectSpread2({
           fontSize: '15px',
           fontWeight: 'bold'
-        }, labelStyle),
-        className: generalIcon
+        }, labelStyle)
       }), generalImage && /*#__PURE__*/React__default.createElement("img", {
         alt: "General",
         src: generalImage,
@@ -36057,11 +36187,11 @@ var Dropdown = function Dropdown(_ref) {
         },
         className: "mr-2"
       }), showIcon && icon && /*#__PURE__*/React__default.createElement("i", {
+        className: "mr-2 ".concat(icon),
         style: _objectSpread2({
           fontSize: '15px',
           fontWeight: 'bold'
-        }, labelStyle),
-        className: 'mr-2 ' + icon
+        }, labelStyle)
       }), /*#__PURE__*/React__default.createElement("span", {
         style: styleLabel
       }, option.label)));
@@ -36071,7 +36201,7 @@ var Dropdown = function Dropdown(_ref) {
     className: "flex flex-col gap-1"
   }, /*#__PURE__*/React__default.createElement(Dropdown$1, _extends$A({
     value: optionSelected,
-    options: options,
+    options: isLazy ? items.current : options,
     onChange: handleChange,
     placeholder: placeholder,
     disabled: disabled,
@@ -36081,13 +36211,12 @@ var Dropdown = function Dropdown(_ref) {
     style: style,
     itemTemplate: optionTemplate,
     valueTemplate: valueTemplate,
-    onHide: resetDropdownFilter,
     showClear: showClear,
     optionGroupTemplate: isGroupedOption ? groupedItemTemplate : null
   }, isGroupedOption && {
     optionGroupLabel: 'label',
     optionGroupChildren: 'items'
-  }, isSelectMeta && {
+  }, (isSelectMeta || isLazy) && {
     virtualScrollerOptions: {
       lazy: true,
       onLazyLoad: onLazyLoad,
@@ -36188,6 +36317,33 @@ var optionsWithColors = [{
   value: 'cyan',
   color: '#00FFFF'
 }];
+var createFakeOptions = function createFakeOptions(start, length) {
+  var options = [];
+  for (var i = start; i < length; i++) {
+    options.push({
+      value: i,
+      label: "Option ".concat(i)
+      // Ajoutez d'autres propriétés si nécessaire
+    });
+  }
+  return options;
+};
+var generateOptions = function generateOptions(length) {
+  return Array.from({
+    length: length
+  }, function (_, i) {
+    return {
+      id: i,
+      nom: "Option ".concat(i),
+      color: '#ccc'
+    };
+  });
+};
+var simulateNetworkDelay = function simulateNetworkDelay() {
+  return new Promise(function (res) {
+    return setTimeout(res, 400);
+  });
+};
 var DropdownPresets = {
   Default: {
     placeholder: 'Sélectionnez une option',
@@ -36217,6 +36373,115 @@ var DropdownPresets = {
       fontFamily: 'Arial'
     }
   },
+  AsyncLoad: {
+    placeholder: 'Chargement distant simulé',
+    options: [],
+    optionLoad: function () {
+      var _optionLoad = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(search, loadedOptions, _ref) {
+        var page, length, start, data;
+        return _regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              page = _ref.page;
+              length = 20;
+              start = (page - 1) * length; // Simule un délai réseau
+              _context.n = 1;
+              return new Promise(function (res) {
+                return setTimeout(res, 500);
+              });
+            case 1:
+              data = createFakeOptions(start, length);
+              return _context.a(2, {
+                options: data.map(function (opt) {
+                  return _objectSpread2(_objectSpread2({}, opt), {}, {
+                    label: opt.label,
+                    value: opt.value,
+                    color: 'blue'
+                  });
+                }),
+                hasMore: page * length < 100,
+                // Supposons que nous avons 100 options au total
+                additional: {
+                  page: page + 1
+                }
+              });
+          }
+        }, _callee);
+      }));
+      function optionLoad(_x, _x2, _x3) {
+        return _optionLoad.apply(this, arguments);
+      }
+      return optionLoad;
+    }(),
+    selectMetaConfig: {
+      generalIcon: 'pi pi-circle-fill'
+    },
+    isSelectMeta: true,
+    valueStyle: {
+      fontSize: '14px',
+      fontFamily: 'Arial'
+    },
+    optionStyle: {
+      fontSize: '14px',
+      fontFamily: 'Arial'
+    }
+  },
+  AsyncSearch: {
+    placeholder: 'Recherchez une option...',
+    filter: true,
+    options: [],
+    optionLoad: function () {
+      var _optionLoad2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(search, loadedOptions, _ref2) {
+        var page, length, allOptions, filteredOptions, start, pageSlice;
+        return _regenerator().w(function (_context2) {
+          while (1) switch (_context2.n) {
+            case 0:
+              page = _ref2.page;
+              length = 10;
+              _context2.n = 1;
+              return simulateNetworkDelay();
+            case 1:
+              // Générer toutes les options possibles
+              allOptions = generateOptions(100); // Filtrer les options en fonction de la recherche
+              filteredOptions = allOptions.filter(function (opt) {
+                return opt.nom.toLowerCase().includes(search.toLowerCase());
+              }); // Pagination des résultats filtrés
+              start = (page - 1) * length;
+              pageSlice = filteredOptions.slice(start, start + length);
+              return _context2.a(2, {
+                options: pageSlice.map(function (opt) {
+                  return _objectSpread2(_objectSpread2({}, opt), {}, {
+                    label: opt.nom,
+                    value: opt.id,
+                    color: 'red'
+                  });
+                }),
+                hasMore: start + length < filteredOptions.length,
+                additional: {
+                  page: page + 1
+                }
+              });
+          }
+        }, _callee2);
+      }));
+      function optionLoad(_x4, _x5, _x6) {
+        return _optionLoad2.apply(this, arguments);
+      }
+      return optionLoad;
+    }(),
+    isSelectMeta: true,
+    selectMetaConfig: {
+      generalIcon: 'pi pi-search'
+    },
+    valueStyle: {
+      fontSize: '14px',
+      fontFamily: 'Arial'
+    },
+    optionStyle: {
+      fontSize: '14px',
+      fontFamily: 'Arial'
+    }
+  },
   Group: {
     placeholder: 'Veuillez choisir une option',
     options: optionsGroup,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "arengibook",
   "private": false,
-  "version": "2.4.589",
+  "version": "2.4.591",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "exports": {