arengibook 2.4.653 → 2.4.655

package/dist/index.js

@@ -36198,7 +36198,10 @@ var DropdownSelectMetaAsync = function DropdownSelectMetaAsync(_ref) {
         borderRadius: '8px',
         boxShadow: '2px 2px 4px rgba(0, 0, 0, 0.15)',
         display: 'inline-block',
-        fontFamily: 'Arial'
+        marginBottom: '5px',
+        fontFamily: 'Arial',
+        cursor: 'pointer',
+        marginRight: '15px'
       }, valueStyle)
     }, selectedOption[optionLabel]);
   };
@@ -36406,7 +36409,8 @@ var Dropdown = function Dropdown(props) {
   }, [value]);
   var style = {
     border: invalid ? '1px solid red' : '1px solid #ccc',
-    width: '100%'
+    width: '100%',
+    minHeight: '45px'
   };
   var inverseColor = function inverseColor(hexColor) {
     var r = parseInt(hexColor.substr(1, 2), 16);
@@ -36483,7 +36487,10 @@ var Dropdown = function Dropdown(props) {
             borderRadius: '8px',
             boxShadow: '2px 2px 4px rgba(0, 0, 0, 0.15)',
             display: 'inline-block',
-            fontFamily: 'Arial'
+            marginBottom: '5px',
+            fontFamily: 'Arial',
+            cursor: 'pointer',
+            marginRight: '15px'
           }, valueStyle)
         }, option !== null && option !== void 0 && option[optionLabel] ? /*#__PURE__*/React__default.createElement("span", {
           style: {
@@ -39123,6 +39130,7 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
     ongletID = _ref$ongletID === void 0 ? null : _ref$ongletID,
     _ref$classInput = _ref.classInput,
     classInput = _ref$classInput === void 0 ? null : _ref$classInput;
+    _ref.displayNbOption;
   var _useState = useState(null),
     _useState2 = _slicedToArray$9(_useState, 2),
     selectedOptions = _useState2[0],
@@ -39140,6 +39148,10 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
   var currentPageRef = useRef(1);
   var isOptionsArray = Array.isArray(options);
   var clickedFromList = useRef(false);
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray$9(_useState7, 2);
+    _useState8[0];
+    var setHovered = _useState8[1];
   var fetchOptionsFromUrl = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
       var search,
@@ -39181,9 +39193,7 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
             return response.json();
           case 4:
             responseJSON = _context.v;
-            // Simule le filtrage et le mapping comme dans loadOptions
             dataAjax = responseJSON.data.filter(function (data) {
-              // Logique de filtrage si nécessaire (à adapter selon vos besoins)
               return true;
             });
             mappedOptions = dataAjax.map(function (opt) {
@@ -39273,7 +39283,6 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
                 options: []
               };
             case 5:
-              // setLoadedOptions(result?.options || []);
               setLoadedOptions(_flattenOptions(((_result = result) === null || _result === void 0 ? void 0 : _result.options) || []));
               if (objValue) {
                 exists = (_result2 = result) === null || _result2 === void 0 || (_result2 = _result2.options) === null || _result2 === void 0 ? void 0 : _result2.some(function (opt) {
@@ -39313,14 +39322,10 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
       observer.disconnect();
     };
   }, []);
-
-  // Gestion du changement de sélection
   var handleChange = function handleChange(e) {
     setSelectedOptions(e.value);
     if (onChange) onChange(e.value);
   };
-
-  // Inversion de couleur pour le texte des badges
   var inverseColor = function inverseColor(hexColor) {
     var r = parseInt(hexColor.substr(1, 2), 16);
     var g = parseInt(hexColor.substr(3, 2), 16);
@@ -39330,7 +39335,8 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
   };
   var style = {
     border: invalid ? '1px solid red' : '1px solid #ccc',
-    width: '100%'
+    width: '100%',
+    minHeight: '45px'
   };
   var optionTemplate = function optionTemplate(option) {
     if (!option) return null;
@@ -39360,45 +39366,6 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
       style: styleLabel
     }, option[optionLabel]));
   };
-
-  // const selectedItemTemplate = (option) => {
-  //
-  //         const selectedOption = objValue.find(opt => opt[optionValue] === option);
-  //         if (!selectedOption) return null;
-  //         // const isLastItem = index === selectedOptions.length - 1;
-  //         const handleRemove = (e) => {
-  //             e.stopPropagation();
-  //             const newSelectedOptions = selectedOptions.filter(opt => opt !== option);
-  //             setSelectedOptions(newSelectedOptions);
-  //             if (onChange) onChange(newSelectedOptions);
-  //         };
-  //
-  //         return (
-  //             <span
-  //                 onClick={handleRemove}
-  //                 style={{
-  //                     backgroundColor: selectedOption?.color ? selectedOption?.color : '#f8e6ec',
-  //                     color: selectedOption?.color ? inverseColor(selectedOption?.color) : '#333',
-  //                     padding: '6px 12px',
-  //                     fontSize: '14px',
-  //                     borderRadius: '8px',
-  //                     boxShadow: '2px 2px 4px rgba(0, 0, 0, 0.15)',
-  //                     display: 'inline-block',
-  //                     marginBottom: '5px',
-  //                     fontFamily: 'Arial',
-  //                     cursor: 'pointer',
-  //                     marginRight: '15px',
-  //                     ...valueStyle,
-  //                 }}
-  //             >
-  //                 {selectedOption[optionLabel]}
-  //                 <span style={{ marginLeft: '5px' }}>×</span>
-  //             </span>
-  //         );
-  //
-  //
-  // };
-
   var _flattenOptions = function flattenOptions(options) {
     if (!Array.isArray(options)) return [];
     return options.reduce(function (acc, item) {
@@ -39410,8 +39377,6 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
       return acc;
     }, []);
   };
-
-  // util pour unifier la comparaison (objet => id | primitif => lui-même)
   var getKey = function getKey(v) {
     return v && _typeof$b(v) === 'object' ? v[optionValue] : v;
   };
@@ -39530,11 +39495,18 @@ var MultiSelectMetaAsync = function MultiSelectMetaAsync(_ref) {
       }, _callee3);
     })), 500);
   };
+  selectedOptions ? selectedOptions.length : 0;
   return /*#__PURE__*/React__default.createElement("div", {
     ref: multiSelectRef,
     className: "flex flex-col gap-1",
     style: {
       width: '100%'
+    },
+    onMouseEnter: function onMouseEnter() {
+      return setHovered(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setHovered(false);
     }
   }, /*#__PURE__*/React__default.createElement(MultiSelect$1, {
     options: _flattenOptions(loadedOptions),
@@ -39655,7 +39627,8 @@ var MultiSelect = function MultiSelect(props) {
     setHovered = _useState4[1];
   var style = {
     border: invalid ? '1px solid red' : '1px solid #ccc',
-    width: '100%'
+    width: '100%',
+    minHeight: '45px'
   };
   useEffect(function () {
     var observer = new MutationObserver(function () {
@@ -39885,7 +39858,7 @@ var MultiSelect = function MultiSelect(props) {
     });
     return /*#__PURE__*/React__default.createElement("div", {
       key: index
-    }, option ? option.label : optionValue);
+    }, option ? option[optionLabel] : optionValue);
   })))), name && /*#__PURE__*/React__default.createElement("div", null, (Array.isArray(selectedOptions) ? selectedOptions : []).filter(function (opt) {
     return opt && (_typeof$b(opt) === 'object' || typeof opt === 'number' || typeof opt === 'string');
   }).map(function (opt, index) {
@@ -40091,46 +40064,6 @@ var MultiSelectPresets = {
     useCheckbox: false,
     showSelectAll: false
   },
-  // Configuration pour les options asynchrones
-  // SelectMetaAsync: {
-  //     isSelectMeta: true,
-  //     value: [9, 4],
-  //     objValue: [{ label: 'Option 9', value: 9, color: "#67688C" }, { label: 'Option 4', value: 4, color: "#39C9BF" }],
-  //     options: async (search = '', _, { page }) => {
-  //         await simulateNetworkDelay();
-  //         const allOptions = createFakeOptions(0, 100);
-  //         const filtered = allOptions.filter(opt =>
-  //             opt.label.toLowerCase().includes(search.toLowerCase())
-  //         );
-  //         const pageSize = 30;
-  //         const start = (page - 1) * pageSize;
-  //         return {
-  //             options: filtered.slice(start, start + pageSize),
-  //             hasMore: start + pageSize < filtered.length,
-  //             additional: { page: page + 1 },
-  //         };
-  //     },
-  //     optionLabel: 'label',
-  //     optionValue: 'value',
-  //
-  //     // value: [3,4],
-  //     // objValue: [{ name: 'Clementine Bauch', id: 3 }, { name: 'Patricia Lebsack', id: 4 }],
-  //     // optionsUrl: "https://jsonplaceholder.typicode.com/users",
-  //     // optionLabel: 'name',
-  //     // optionValue: 'id',
-  //
-  //     placeholder: 'Sélectionnez une ou plusieurs options',
-  //     valueStyle: { marginRight: '15px', marginBottom: '5px' },
-  //     selectMetaConfig: {
-  //         labelStyle: { fontWeight: 'bold' },
-  //         generalIcon: 'pi pi-tag',
-  //     },
-  //     filter: false,
-  //     showClear: false,
-  //     useCheckbox: false,
-  //     showSelectAll: false,
-  // },
-
   SelectMetaAsync: {
     isSelectMeta: true,
     value: [9, 4],
@@ -40210,6 +40143,7 @@ var MultiSelectPresets = {
       },
       generalIcon: 'pi pi-tag'
     },
+    displayNbOption: true,
     filter: false,
     showClear: false,
     useCheckbox: false,

package/package.json

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