funda-ui 4.7.195 → 4.7.202

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/Accordion/index.js +335 -109
  2. package/DragDropList/index.d.ts +1 -0
  3. package/DragDropList/index.js +4 -5
  4. package/LiveSearch/index.js +234 -184
  5. package/MultipleCheckboxes/index.js +234 -184
  6. package/MultipleSelect/index.js +238 -189
  7. package/NativeSelect/index.js +234 -184
  8. package/Radio/index.js +234 -184
  9. package/Select/index.js +234 -184
  10. package/Utils/anim.js +101 -25
  11. package/Utils/formdata.d.ts +13 -0
  12. package/Utils/formdata.js +131 -0
  13. package/Utils/initDefaultOptions.d.ts +1 -12
  14. package/Utils/initDefaultOptions.js +154 -48
  15. package/Utils/validate.d.ts +49 -0
  16. package/Utils/validate.js +166 -0
  17. package/lib/cjs/Accordion/index.js +335 -109
  18. package/lib/cjs/DragDropList/index.d.ts +1 -0
  19. package/lib/cjs/DragDropList/index.js +4 -5
  20. package/lib/cjs/LiveSearch/index.js +234 -184
  21. package/lib/cjs/MultipleCheckboxes/index.js +234 -184
  22. package/lib/cjs/MultipleSelect/index.js +238 -189
  23. package/lib/cjs/NativeSelect/index.js +234 -184
  24. package/lib/cjs/Radio/index.js +234 -184
  25. package/lib/cjs/Select/index.js +234 -184
  26. package/lib/cjs/Utils/anim.js +101 -25
  27. package/lib/cjs/Utils/formdata.d.ts +13 -0
  28. package/lib/cjs/Utils/formdata.js +131 -0
  29. package/lib/cjs/Utils/initDefaultOptions.d.ts +1 -12
  30. package/lib/cjs/Utils/initDefaultOptions.js +154 -48
  31. package/lib/cjs/Utils/validate.d.ts +49 -0
  32. package/lib/cjs/Utils/validate.js +166 -0
  33. package/lib/esm/Accordion/Accordion.tsx +135 -94
  34. package/lib/esm/Accordion/AccordionItem.tsx +118 -34
  35. package/lib/esm/DragDropList/index.tsx +47 -37
  36. package/lib/esm/LiveSearch/index.tsx +1 -1
  37. package/lib/esm/MultipleCheckboxes/index.tsx +1 -1
  38. package/lib/esm/MultipleSelect/index.tsx +1 -1
  39. package/lib/esm/NativeSelect/index.tsx +1 -1
  40. package/lib/esm/Radio/index.tsx +1 -1
  41. package/lib/esm/Select/index.tsx +1 -1
  42. package/lib/esm/Utils/libs/formdata.ts +93 -0
  43. package/lib/esm/Utils/libs/initDefaultOptions.ts +1 -62
  44. package/lib/esm/Utils/libs/validate.ts +120 -0
  45. package/package.json +1 -1
@@ -201,7 +201,8 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
201
201
  }
202
202
  /* harmony export */
203
203
  });
204
- /* unused harmony exports isJSON, isValidNumeric */
204
+ /* harmony import */
205
+ var _validate__WEBPACK_IMPORTED_MODULE_0__ = __nested_webpack_require_8432__(258);
205
206
  function _typeof(obj) {
206
207
  "@babel/helpers - typeof";
207
208
 
@@ -211,6 +212,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
211
212
  return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
212
213
  }, _typeof(obj);
213
214
  }
215
+
214
216
  /**
215
217
  * Set a default JSON format configuration
216
218
  *
@@ -221,7 +223,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
221
223
  function _setDefaultOptions(props, options) {
222
224
  if (_typeof(options) === ( true ? "undefined" : 0) || options === null || options === false) options = {};
223
225
  //Set a default configuration
224
- if (isJSON(props)) {
226
+ if ((0, _validate__WEBPACK_IMPORTED_MODULE_0__.isJSON)(props)) {
225
227
  var defaultConfigValues = Object.values(props);
226
228
  Object.keys(props).forEach(function (prop, index) {
227
229
  // Well-formed string type
@@ -230,8 +232,8 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
230
232
  var _v = options[prop2];
231
233
  if (_v == 'true') _v = true;
232
234
  if (_v == 'false') _v = false;
233
- if (isValidNumeric(_v)) _v = parseFloat(_v);
234
- if (isJSON(_v)) _v = Object.prototype.toString.call(_v) === '[object Object]' ? _v : JSON.parse(_v);
235
+ if ((0, _validate__WEBPACK_IMPORTED_MODULE_0__.isValidNumeric)(_v)) _v = parseFloat(_v);
236
+ if ((0, _validate__WEBPACK_IMPORTED_MODULE_0__.isJSON)(_v)) _v = Object.prototype.toString.call(_v) === '[object Object]' ? _v : JSON.parse(_v);
235
237
  options[prop2] = _v;
236
238
  }
237
239
  });
@@ -243,46 +245,133 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
243
245
  return options;
244
246
  }
245
247
 
248
+ /***/
249
+ },
250
+
251
+ /***/258: /***/function _(__unused_webpack_module, __webpack_exports__, __nested_webpack_require_11060__) {
252
+ /* harmony export */__nested_webpack_require_11060__.d(__webpack_exports__, {
253
+ /* harmony export */"isJSON": function isJSON() {
254
+ return (/* binding */_isJSON
255
+ );
256
+ },
257
+ /* harmony export */"isValidNumeric": function isValidNumeric() {
258
+ return (/* binding */_isValidNumeric
259
+ );
260
+ }
261
+ /* harmony export */
262
+ });
263
+ /* unused harmony exports isEmpty, isNumber, isInt, isEmail, isTel, isMobile */
264
+ function _typeof(obj) {
265
+ "@babel/helpers - typeof";
266
+
267
+ return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
268
+ return typeof obj;
269
+ } : function (obj) {
270
+ return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
271
+ }, _typeof(obj);
272
+ }
246
273
  /**
247
- * Check if a string is a valid number
248
- * @param {*} str
249
- * @returns
250
- */
251
- function isValidNumeric(str) {
252
- if (typeof str != "string") return false; // we only process strings!
274
+ * Check if a string is a valid number
275
+ * @param str - The string to check
276
+ * @returns boolean indicating if the string is a valid number
277
+ */
278
+ function _isValidNumeric(str) {
279
+ if (typeof str !== "string") return false; // we only process strings!
253
280
  if (!isNaN(Number(str)) &&
254
- // use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)
281
+ // use type coercion to parse the _entirety_ of the string
255
282
  !isNaN(parseFloat(str)) // ensure strings of whitespace fail
256
283
  ) {
257
284
  return true;
258
- } else {
259
- return false;
260
285
  }
286
+ return false;
261
287
  }
262
288
 
263
289
  /**
264
290
  * Determine whether it is in JSON format
265
- * @param {*} str
266
- * @returns
291
+ * @param str - The value to check
292
+ * @returns boolean indicating if the value is valid JSON
267
293
  */
268
- function isJSON(str) {
294
+ function _isJSON(str) {
269
295
  if (typeof str === 'string' && str.length > 0) {
270
- if (str.replace(/\"\"/g, '').replace(/\,/g, '') == '[{}]') {
296
+ if (str.replace(/\"\"/g, '').replace(/\,/g, '') === '[{}]') {
271
297
  return false;
272
- } else {
273
- if (/^[\],:{}\s]*$/.test(str.replace(/\\["\\\/bfnrtu]/g, '@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
274
- return true;
275
- } else {
276
- return false;
277
- }
278
298
  }
279
- } else {
280
- if (_typeof(str) === 'object' && Object.prototype.toString.call(str) === '[object Object]' && !str.length) {
299
+ if (/^[\],:{}\s]*$/.test(str.replace(/\\["\\\/bfnrtu]/g, '@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
281
300
  return true;
282
- } else {
283
- return false;
284
301
  }
302
+ return false;
303
+ }
304
+ if (_typeof(str) === 'object' && Object.prototype.toString.call(str) === '[object Object]' && !str.length) {
305
+ return true;
306
+ }
307
+ return false;
308
+ }
309
+
310
+ /**
311
+ * Check if input is empty
312
+ * @param input - The input to check (string or array of strings)
313
+ * @returns boolean indicating if the input is empty
314
+ */
315
+ function isEmpty(input) {
316
+ if (Array.isArray(input)) {
317
+ return input.some(function (str) {
318
+ return !str.replace(/\s/g, '').length === true;
319
+ });
285
320
  }
321
+ return !input.replace(/\s/g, '').length === true;
322
+ }
323
+
324
+ /**
325
+ * Check if input is a valid number
326
+ * @param input - The input to check
327
+ * @returns boolean indicating if the input is a valid number
328
+ */
329
+ function isNumber(input) {
330
+ var reg = /^[\d|\.|,]+$/;
331
+ return reg.test(input);
332
+ }
333
+
334
+ /**
335
+ * Check if input is a valid integer
336
+ * @param input - The input to check
337
+ * @returns boolean indicating if the input is a valid integer
338
+ */
339
+ function isInt(input) {
340
+ if (input === "") {
341
+ return false;
342
+ }
343
+ var reg = /\D+/;
344
+ return !reg.test(input);
345
+ }
346
+
347
+ /**
348
+ * Check if input is a valid email address
349
+ * @param input - The input to check
350
+ * @returns boolean indicating if the input is a valid email
351
+ */
352
+ function isEmail(input) {
353
+ var reg = /^\s*([A-Za-z0-9_-]+(\.\w+)*@(\w+\.)+\w{2,3})\s*$/;
354
+ return reg.test(input);
355
+ }
356
+
357
+ /**
358
+ * Check if input is a valid telephone number
359
+ * @param input - The input to check
360
+ * @returns boolean indicating if the input is a valid telephone number
361
+ */
362
+ function isTel(input) {
363
+ var reg = /^[0-9- ]{7,20}$/;
364
+ return reg.test(input);
365
+ }
366
+
367
+ /**
368
+ * Check if input is a valid mobile number
369
+ * @param input - The input to check
370
+ * @returns boolean indicating if the input is a valid mobile number
371
+ */
372
+ function isMobile(input) {
373
+ var reg = /^1[0-9]{10}$/;
374
+ return reg.test(input);
286
375
  }
287
376
 
288
377
  /***/
@@ -297,7 +386,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
297
386
  /******/
298
387
  /******/ // The require function
299
388
  /******/
300
- function __nested_webpack_require_12605__(moduleId) {
389
+ function __nested_webpack_require_16046__(moduleId) {
301
390
  /******/ // Check if module is in cache
302
391
  /******/var cachedModule = __webpack_module_cache__[moduleId];
303
392
  /******/
@@ -316,7 +405,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
316
405
  /******/
317
406
  /******/ // Execute the module function
318
407
  /******/
319
- __webpack_modules__[moduleId](module, module.exports, __nested_webpack_require_12605__);
408
+ __webpack_modules__[moduleId](module, module.exports, __nested_webpack_require_16046__);
320
409
  /******/
321
410
  /******/ // Return the exports of the module
322
411
  /******/
@@ -329,9 +418,9 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
329
418
  /******/
330
419
  (function () {
331
420
  /******/ // define getter functions for harmony exports
332
- /******/__nested_webpack_require_12605__.d = function (exports, definition) {
421
+ /******/__nested_webpack_require_16046__.d = function (exports, definition) {
333
422
  /******/for (var key in definition) {
334
- /******/if (__nested_webpack_require_12605__.o(definition, key) && !__nested_webpack_require_12605__.o(exports, key)) {
423
+ /******/if (__nested_webpack_require_16046__.o(definition, key) && !__nested_webpack_require_16046__.o(exports, key)) {
335
424
  /******/Object.defineProperty(exports, key, {
336
425
  enumerable: true,
337
426
  get: definition[key]
@@ -348,7 +437,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
348
437
  /******/ /* webpack/runtime/hasOwnProperty shorthand */
349
438
  /******/
350
439
  (function () {
351
- /******/__nested_webpack_require_12605__.o = function (obj, prop) {
440
+ /******/__nested_webpack_require_16046__.o = function (obj, prop) {
352
441
  return Object.prototype.hasOwnProperty.call(obj, prop);
353
442
  };
354
443
  /******/
@@ -358,7 +447,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
358
447
  /******/
359
448
  (function () {
360
449
  /******/ // define __esModule on exports
361
- /******/__nested_webpack_require_12605__.r = function (exports) {
450
+ /******/__nested_webpack_require_16046__.r = function (exports) {
362
451
  /******/if (typeof Symbol !== 'undefined' && Symbol.toStringTag) {
363
452
  /******/Object.defineProperty(exports, Symbol.toStringTag, {
364
453
  value: 'Module'
@@ -378,18 +467,18 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
378
467
  var __webpack_exports__ = {};
379
468
  // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
380
469
  (function () {
381
- __nested_webpack_require_12605__.r(__webpack_exports__);
470
+ __nested_webpack_require_16046__.r(__webpack_exports__);
382
471
  /* harmony export */
383
- __nested_webpack_require_12605__.d(__webpack_exports__, {
472
+ __nested_webpack_require_16046__.d(__webpack_exports__, {
384
473
  /* harmony export */"default": function _default() {
385
474
  return __WEBPACK_DEFAULT_EXPORT__;
386
475
  }
387
476
  /* harmony export */
388
477
  });
389
478
  /* harmony import */
390
- var _easing__WEBPACK_IMPORTED_MODULE_1__ = __nested_webpack_require_12605__(357);
479
+ var _easing__WEBPACK_IMPORTED_MODULE_1__ = __nested_webpack_require_16046__(357);
391
480
  /* harmony import */
392
- var _initDefaultOptions__WEBPACK_IMPORTED_MODULE_0__ = __nested_webpack_require_12605__(65);
481
+ var _initDefaultOptions__WEBPACK_IMPORTED_MODULE_0__ = __nested_webpack_require_16046__(65);
393
482
  function _typeof(obj) {
394
483
  "@babel/helpers - typeof";
395
484
 
@@ -806,8 +895,14 @@ var external_root_React_commonjs2_react_commonjs_react_amd_react_default = /*#__
806
895
  // EXTERNAL MODULE: ../Utils/dist/cjs/cls.js
807
896
  var cls = __webpack_require__(188);
808
897
  ;// CONCATENATED MODULE: ./src/AccordionItem.tsx
809
- var _excluded = ["heightObserver", "index", "itemClassName", "itemContentWrapperClassName", "itemContentClassName", "itemTriggerClassName", "itemHeaderClassName", "itemTriggerIcon", "itemStyle", "defaultActive", "title", "onToggleEv", "onTransitionEnd", "triggerType", "children"];
898
+ var _excluded = ["heightObserver", "index", "animSpeed", "easeType", "arrowOnly", "itemClassName", "itemContentWrapperClassName", "itemContentClassName", "itemTriggerClassName", "itemHeaderClassName", "itemTriggerIcon", "itemStyle", "defaultActive", "title", "onToggleEv", "onTransitionEnd", "onItemCollapse", "isExpanded", "children"];
810
899
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
900
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
901
+ 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."); }
902
+ 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); }
903
+ 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; }
904
+ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
905
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
811
906
  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; }
812
907
  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; }
813
908
 
@@ -815,6 +910,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
815
910
  var AccordionItem = function AccordionItem(props) {
816
911
  var heightObserver = props.heightObserver,
817
912
  index = props.index,
913
+ animSpeed = props.animSpeed,
914
+ easeType = props.easeType,
915
+ arrowOnly = props.arrowOnly,
818
916
  itemClassName = props.itemClassName,
819
917
  itemContentWrapperClassName = props.itemContentWrapperClassName,
820
918
  itemContentClassName = props.itemContentClassName,
@@ -826,13 +924,58 @@ var AccordionItem = function AccordionItem(props) {
826
924
  title = props.title,
827
925
  onToggleEv = props.onToggleEv,
828
926
  onTransitionEnd = props.onTransitionEnd,
829
- triggerType = props.triggerType,
927
+ onItemCollapse = props.onItemCollapse,
928
+ controlledExpanded = props.isExpanded,
830
929
  children = props.children,
831
930
  attributes = _objectWithoutProperties(props, _excluded);
832
- var activedClassName = typeof defaultActive !== 'undefined' && defaultActive !== false ? ' active' : '';
931
+ var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false),
932
+ _useState2 = _slicedToArray(_useState, 2),
933
+ internalExpanded = _useState2[0],
934
+ setInternalExpanded = _useState2[1];
935
+ var isFirstRender = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(true);
936
+ var initialHeightSet = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(false);
937
+
938
+ // Use controlled or uncontrolled expanded state
939
+ var isExpanded = controlledExpanded !== undefined ? controlledExpanded : internalExpanded;
833
940
  var observer = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
834
941
  var contentWrapperRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
835
942
  var contentRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
943
+ var triggerRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
944
+ var iconRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
945
+ var handleToggle = function handleToggle(e) {
946
+ e.preventDefault();
947
+ e.stopPropagation();
948
+ if (controlledExpanded === undefined) {
949
+ setInternalExpanded(function (prev) {
950
+ return !prev;
951
+ });
952
+ }
953
+ onToggleEv === null || onToggleEv === void 0 ? void 0 : onToggleEv(e);
954
+ };
955
+ (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
956
+ if (triggerRef.current && typeof onItemCollapse === 'function') {
957
+ if (isFirstRender.current) {
958
+ isFirstRender.current = false;
959
+ return;
960
+ }
961
+ onItemCollapse(triggerRef.current, iconRef.current, isExpanded);
962
+ }
963
+ }, [isExpanded, onItemCollapse]);
964
+ (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
965
+ if (contentWrapperRef.current && !initialHeightSet.current) {
966
+ initialHeightSet.current = true;
967
+ var shouldBeExpanded = typeof defaultActive !== 'undefined' && defaultActive !== false;
968
+ if (controlledExpanded === undefined) {
969
+ setInternalExpanded(shouldBeExpanded);
970
+ }
971
+
972
+ // Set initial height when defaultActive is true
973
+ if (shouldBeExpanded && contentRef.current) {
974
+ var contentHeight = contentRef.current.offsetHeight;
975
+ contentWrapperRef.current.style.height = "".concat(contentHeight, "px");
976
+ }
977
+ }
978
+ }, [defaultActive, controlledExpanded]);
836
979
  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
837
980
  if (parseFloat(heightObserver) !== index) return;
838
981
 
@@ -856,26 +999,39 @@ var AccordionItem = function AccordionItem(props) {
856
999
  }, [heightObserver]);
857
1000
  return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((external_root_React_commonjs2_react_commonjs_react_amd_react_default()).Fragment, null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", _extends({}, attributes, {
858
1001
  "data-index": index,
859
- className: (0,cls.combinedCls)('custom-accordion-item', (0,cls.clsWrite)(itemClassName, 'accordion-item'), activedClassName),
860
- onClick: triggerType === 'click' ? onToggleEv : function () {},
861
- onMouseOver: triggerType === 'click' ? function () {} : onToggleEv,
862
- onTransitionEnd: typeof onTransitionEnd === 'function' ? onTransitionEnd : function () {},
863
- "aria-expanded": defaultActive ? 'true' : 'false',
1002
+ className: (0,cls.combinedCls)('custom-accordion-item', (0,cls.clsWrite)(itemClassName, 'accordion-item'), isExpanded ? ' active' : ''),
1003
+ onClick: arrowOnly ? undefined : handleToggle,
1004
+ onTransitionEnd: typeof onTransitionEnd === 'function' ? onTransitionEnd : undefined,
1005
+ "aria-expanded": isExpanded ? 'true' : 'false',
864
1006
  style: typeof itemStyle !== 'undefined' ? itemStyle : {}
865
1007
  }), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
866
1008
  className: (0,cls.combinedCls)('custom-accordion-header', (0,cls.clsWrite)(itemHeaderClassName, 'accordion-header position-relative')),
867
1009
  role: "presentation"
868
- }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("button", {
1010
+ }, arrowOnly ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
1011
+ ref: triggerRef,
1012
+ tabIndex: -1,
1013
+ className: (0,cls.combinedCls)('custom-accordion-trigger', (0,cls.clsWrite)(itemTriggerClassName, 'accordion-button'), isExpanded ? 'active' : 'collapsed')
1014
+ }, title) : /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("button", {
1015
+ ref: triggerRef,
869
1016
  tabIndex: -1,
870
- className: (0,cls.combinedCls)('custom-accordion-trigger', (0,cls.clsWrite)(itemTriggerClassName, 'accordion-button'), activedClassName === '' ? 'collapsed' : 'active'),
1017
+ className: (0,cls.combinedCls)('custom-accordion-trigger', (0,cls.clsWrite)(itemTriggerClassName, 'accordion-button'), isExpanded ? 'active' : 'collapsed'),
871
1018
  type: "button"
872
- }, title), itemTriggerIcon), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
1019
+ }, title), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("span", {
1020
+ ref: iconRef,
1021
+ onClick: !arrowOnly ? undefined : handleToggle,
1022
+ className: "custom-accordion-trigger__icon",
1023
+ style: !arrowOnly ? {
1024
+ pointerEvents: 'none'
1025
+ } : {
1026
+ cursor: 'pointer'
1027
+ }
1028
+ }, itemTriggerIcon)), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
873
1029
  ref: contentWrapperRef,
874
1030
  className: (0,cls.combinedCls)('custom-accordion-content__wrapper w-100', (0,cls.clsWrite)(itemContentWrapperClassName, 'accordion-collapse')),
875
1031
  role: "tabpanel",
876
1032
  style: {
877
- height: defaultActive ? 'auto' : '0px',
878
- overflow: 'hidden' // overflow affects the width, so add `w-100` to `custom-accordion-content__wrapper`
1033
+ height: '0',
1034
+ overflow: 'hidden' // "overflow" affects the width, so add `w-100` to `custom-accordion-content__wrapper`
879
1035
  }
880
1036
  }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
881
1037
  className: (0,cls.combinedCls)('custom-accordion-content', (0,cls.clsWrite)(itemContentClassName, 'accordion-body')),
@@ -894,12 +1050,16 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
894
1050
  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; }
895
1051
  function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
896
1052
  function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
897
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
898
- 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."); }
899
- 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); }
900
- 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; }
901
- function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
902
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
1053
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || Accordion_unsupportedIterableToArray(arr) || _nonIterableSpread(); }
1054
+ 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."); }
1055
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
1056
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return Accordion_arrayLikeToArray(arr); }
1057
+ function Accordion_slicedToArray(arr, i) { return Accordion_arrayWithHoles(arr) || Accordion_iterableToArrayLimit(arr, i) || Accordion_unsupportedIterableToArray(arr, i) || Accordion_nonIterableRest(); }
1058
+ function Accordion_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."); }
1059
+ function Accordion_unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return Accordion_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 Accordion_arrayLikeToArray(o, minLen); }
1060
+ function Accordion_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; }
1061
+ function Accordion_iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
1062
+ function Accordion_arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
903
1063
 
904
1064
 
905
1065
 
@@ -915,116 +1075,182 @@ var EasingList = /*#__PURE__*/function (EasingList) {
915
1075
  }({});
916
1076
  var Accordion = function Accordion(props) {
917
1077
  var wrapperClassName = props.wrapperClassName,
918
- triggerType = props.triggerType,
919
- displayTheFirstItem = props.displayTheFirstItem,
920
- displayAllItems = props.displayAllItems,
1078
+ defaultActiveIndex = props.defaultActiveIndex,
1079
+ _props$defaultActiveA = props.defaultActiveAll,
1080
+ defaultActiveAll = _props$defaultActiveA === void 0 ? false : _props$defaultActiveA,
921
1081
  duration = props.duration,
922
1082
  easing = props.easing,
923
- alternateCollapse = props.alternateCollapse,
1083
+ _props$alternateColla = props.alternateCollapse,
1084
+ alternateCollapse = _props$alternateColla === void 0 ? true : _props$alternateColla,
1085
+ _props$arrowOnly = props.arrowOnly,
1086
+ arrowOnly = _props$arrowOnly === void 0 ? false : _props$arrowOnly,
924
1087
  onChange = props.onChange,
925
1088
  children = props.children;
1089
+ var animSpeed = duration || 200;
926
1090
  var easeType = typeof alternateCollapse === 'undefined' ? EasingList['linear'] : EasingList[easing];
927
- var ALTER = typeof alternateCollapse === 'undefined' ? true : alternateCollapse;
928
1091
  var rootRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
929
1092
  var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false),
930
- _useState2 = _slicedToArray(_useState, 2),
1093
+ _useState2 = Accordion_slicedToArray(_useState, 2),
931
1094
  animOK = _useState2[0],
932
1095
  setAnimOK = _useState2[1];
933
1096
  var _useState3 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(-1),
934
- _useState4 = _slicedToArray(_useState3, 2),
1097
+ _useState4 = Accordion_slicedToArray(_useState3, 2),
935
1098
  heightObserver = _useState4[0],
936
1099
  setHeightObserver = _useState4[1];
1100
+ var _useState5 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(new Set()),
1101
+ _useState6 = Accordion_slicedToArray(_useState5, 2),
1102
+ expandedItems = _useState6[0],
1103
+ setExpandedItems = _useState6[1]; // Keep track of all expanded items
1104
+ var animationInProgress = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(false);
937
1105
  function handleClickItem(e) {
1106
+ if (animationInProgress.current) return;
938
1107
  if (e.target.closest('.custom-accordion-header') === null) return;
939
1108
  if (animOK) return;
940
-
941
- // DO NOT place it before the above code, otherwise it will cause the checkbox and radio controls to fail.
942
- e.preventDefault();
943
-
944
- //Prevents further propagation of the current event in the capturing and bubbling phases(if use `e.target`).
945
- e.stopPropagation();
946
-
947
- //
948
- var reactDomEl = e.currentTarget;
949
- var curIndex = reactDomEl.dataset.index;
1109
+ animationInProgress.current = true;
1110
+ var reactDomEl = arrowOnly ? e.currentTarget.closest('.custom-accordion-item') : e.currentTarget;
1111
+ var curIndex = parseInt(reactDomEl.dataset.index);
950
1112
  var reactDomWrapperEl = rootRef.current;
951
- var animSpeed = duration || 200;
952
1113
  var $li = reactDomWrapperEl.querySelectorAll('.custom-accordion-item');
953
1114
  var $allContent = reactDomWrapperEl.querySelectorAll('.custom-accordion-content__wrapper');
954
1115
  var $curContent = reactDomEl.querySelector('.custom-accordion-content__wrapper');
1116
+ var $trigger = reactDomEl.querySelector('.custom-accordion-trigger');
955
1117
  if (reactDomEl.getAttribute('aria-expanded') === 'false' || reactDomEl.getAttribute('aria-expanded') === null) {
956
- var _reactDomEl$querySele, _reactDomEl$querySele2;
1118
+ var _curIndex;
957
1119
  setAnimOK(true);
958
1120
  setTimeout(function () {
959
1121
  setAnimOK(false);
960
1122
  }, animSpeed);
961
- if (ALTER) {
962
- //Hide other all sibling <dt> of the selected element
1123
+ if (alternateCollapse) {
1124
+ // Hide other all sibling content
963
1125
  Array.prototype.forEach.call($allContent, function (node) {
964
1126
  if (node.clientHeight > 0) {
965
1127
  anim_default()(node, {
966
1128
  startHeight: node.scrollHeight,
967
1129
  endHeight: 0,
968
1130
  speed: animSpeed
969
- }, easeType);
1131
+ }, easeType, function () {
1132
+ animationInProgress.current = false;
1133
+ });
970
1134
  }
971
1135
  });
972
1136
 
973
- //to open
1137
+ // Update all items to collapsed state
974
1138
  Array.prototype.forEach.call($li, function (node) {
975
- var _node$querySelector, _node$querySelector2;
976
- node.classList.remove('active');
977
- (_node$querySelector = node.querySelector('.custom-accordion-trigger')) === null || _node$querySelector === void 0 ? void 0 : _node$querySelector.classList.remove('active');
978
- (_node$querySelector2 = node.querySelector('.custom-accordion-trigger')) === null || _node$querySelector2 === void 0 ? void 0 : _node$querySelector2.classList.add('collapsed');
979
- node.setAttribute('aria-expanded', false);
1139
+ node.setAttribute('aria-expanded', 'false');
980
1140
  });
1141
+
1142
+ // Update expanded items state
1143
+ setExpandedItems(new Set([curIndex]));
1144
+ } else {
1145
+ // Add current item to expanded items
1146
+ setExpandedItems(function (prev) {
1147
+ return new Set([].concat(_toConsumableArray(prev), [curIndex]));
1148
+ });
1149
+ }
1150
+ reactDomEl.setAttribute('aria-expanded', 'true');
1151
+
1152
+ // Call onTriggerChange if it exists in the child props
1153
+ var childProps = (_curIndex = children[curIndex]) === null || _curIndex === void 0 ? void 0 : _curIndex.props;
1154
+ if (typeof (childProps === null || childProps === void 0 ? void 0 : childProps.onTriggerChange) === 'function' && $trigger) {
1155
+ childProps.onTriggerChange($trigger, true);
981
1156
  }
982
- reactDomEl.classList.add('active');
983
- (_reactDomEl$querySele = reactDomEl.querySelector('.custom-accordion-trigger')) === null || _reactDomEl$querySele === void 0 ? void 0 : _reactDomEl$querySele.classList.add('active');
984
- (_reactDomEl$querySele2 = reactDomEl.querySelector('.custom-accordion-trigger')) === null || _reactDomEl$querySele2 === void 0 ? void 0 : _reactDomEl$querySele2.classList.remove('collapsed');
985
- reactDomEl.setAttribute('aria-expanded', true);
986
- // When the height of the element is 0, the value of `offsetHeight` and `clientHeight` will be 0
987
1157
  anim_default()($curContent, {
988
1158
  startHeight: 0,
989
1159
  endHeight: $curContent.scrollHeight,
990
1160
  speed: animSpeed
991
1161
  }, easeType, function () {
992
- // content height observer
993
1162
  setHeightObserver(curIndex);
1163
+ animationInProgress.current = false;
994
1164
  });
995
1165
  } else {
996
- if (e.type == 'click') {
997
- var _reactDomEl$querySele3, _reactDomEl$querySele4;
998
- //to close
999
- reactDomEl.classList.remove('active');
1000
- (_reactDomEl$querySele3 = reactDomEl.querySelector('.custom-accordion-trigger')) === null || _reactDomEl$querySele3 === void 0 ? void 0 : _reactDomEl$querySele3.classList.remove('active');
1001
- (_reactDomEl$querySele4 = reactDomEl.querySelector('.custom-accordion-trigger')) === null || _reactDomEl$querySele4 === void 0 ? void 0 : _reactDomEl$querySele4.classList.add('collapsed');
1002
- reactDomEl.setAttribute('aria-expanded', false);
1003
- anim_default()($curContent, {
1004
- startHeight: $curContent.scrollHeight,
1005
- endHeight: 0,
1006
- speed: animSpeed
1007
- }, easeType);
1166
+ var _curIndex2;
1167
+ reactDomEl.setAttribute('aria-expanded', 'false');
1168
+
1169
+ // Call onTriggerChange if it exists in the child props
1170
+ var _childProps = (_curIndex2 = children[curIndex]) === null || _curIndex2 === void 0 ? void 0 : _curIndex2.props;
1171
+ if (typeof (_childProps === null || _childProps === void 0 ? void 0 : _childProps.onTriggerChange) === 'function' && $trigger) {
1172
+ _childProps.onTriggerChange($trigger, false);
1008
1173
  }
1174
+
1175
+ // Remove current item from expanded items
1176
+ setExpandedItems(function (prev) {
1177
+ var newSet = new Set(prev);
1178
+ newSet["delete"](curIndex);
1179
+ return newSet;
1180
+ });
1181
+ anim_default()($curContent, {
1182
+ startHeight: $curContent.scrollHeight,
1183
+ endHeight: 0,
1184
+ speed: animSpeed
1185
+ }, easeType, function () {
1186
+ animationInProgress.current = false;
1187
+ });
1009
1188
  }
1010
- if (typeof onChange === 'function') {
1011
- onChange(reactDomEl, Number(curIndex));
1012
- }
1189
+ onChange === null || onChange === void 0 ? void 0 : onChange(reactDomEl, curIndex);
1013
1190
  }
1191
+
1192
+ // Initialize expanded items based on defaultActiveIndex or defaultActiveAll
1193
+ (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
1194
+ if (defaultActiveAll && children && rootRef.current) {
1195
+ var allIndices = Array.from({
1196
+ length: children.length
1197
+ }, function (_, i) {
1198
+ return i;
1199
+ });
1200
+ setExpandedItems(new Set(allIndices));
1201
+
1202
+ // Actually expand all items without animation
1203
+ var $allItems = rootRef.current.querySelectorAll('.custom-accordion-item');
1204
+ Array.prototype.forEach.call($allItems, function (node, index) {
1205
+ var _index;
1206
+ node.setAttribute('aria-expanded', 'true');
1207
+ var $curContent = node.querySelector('.custom-accordion-content__wrapper');
1208
+ var $trigger = node.querySelector('.custom-accordion-trigger');
1209
+
1210
+ // Call onTriggerChange if it exists in the child props
1211
+ var childProps = (_index = children[index]) === null || _index === void 0 ? void 0 : _index.props;
1212
+ if (typeof (childProps === null || childProps === void 0 ? void 0 : childProps.onTriggerChange) === 'function' && $trigger) {
1213
+ childProps.onTriggerChange($trigger, true);
1214
+ }
1215
+
1216
+ // Directly set height without animation
1217
+ if ($curContent) {
1218
+ $curContent.style.height = "".concat($curContent.scrollHeight, "px");
1219
+ }
1220
+ });
1221
+ } else if (defaultActiveIndex !== undefined) {
1222
+ var initialExpanded = new Set();
1223
+ if (Array.isArray(defaultActiveIndex)) {
1224
+ defaultActiveIndex.forEach(function (index) {
1225
+ return initialExpanded.add(index);
1226
+ });
1227
+ } else if (typeof defaultActiveIndex === 'number') {
1228
+ initialExpanded.add(defaultActiveIndex);
1229
+ }
1230
+ setExpandedItems(initialExpanded);
1231
+ }
1232
+ }, [defaultActiveIndex, defaultActiveAll, children]);
1014
1233
  return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((external_root_React_commonjs2_react_commonjs_react_amd_react_default()).Fragment, null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
1015
1234
  className: (0,cls.combinedCls)('custom-accordion-item', (0,cls.clsWrite)(wrapperClassName, 'accordion')),
1016
1235
  role: "tablist",
1017
1236
  ref: rootRef
1018
1237
  }, children != null ? children.map(function (item, i) {
1019
1238
  var childProps = _objectSpread({}, item.props);
1020
- var _defaultActive = i === 0 && displayTheFirstItem ? true : false;
1239
+ var _defaultActive = false;
1240
+ if (Array.isArray(defaultActiveIndex)) {
1241
+ _defaultActive = defaultActiveIndex.includes(i);
1242
+ } else if (typeof defaultActiveIndex === 'number') {
1243
+ _defaultActive = defaultActiveIndex === i;
1244
+ }
1021
1245
  return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(src_AccordionItem, Accordion_extends({
1022
1246
  key: "item" + i,
1023
1247
  index: i,
1248
+ animSpeed: animSpeed,
1249
+ arrowOnly: arrowOnly,
1024
1250
  heightObserver: heightObserver,
1025
- defaultActive: typeof displayAllItems === 'undefined' ? _defaultActive : displayAllItems,
1026
- triggerType: triggerType || 'click',
1027
- onToggleEv: handleClickItem
1251
+ defaultActive: _defaultActive,
1252
+ onToggleEv: handleClickItem,
1253
+ isExpanded: expandedItems.has(i) // Both controlled and uncontrolled modes are implemented
1028
1254
  }, childProps));
1029
1255
  }) : null));
1030
1256
  };