useResizable.js 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. "use strict";
  2. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = useResizable;
  7. var React = _interopRequireWildcard(require("react"));
  8. function getShowCollapsibleIcon(prev, next) {
  9. if (prev.collapsible && next.collapsible) {
  10. if (prev.showCollapsibleIcon === true || next.showCollapsibleIcon === true) {
  11. return true;
  12. }
  13. if (prev.showCollapsibleIcon === 'auto' || next.showCollapsibleIcon === 'auto') {
  14. return 'auto';
  15. }
  16. return false;
  17. }
  18. if (prev.collapsible) {
  19. return prev.showCollapsibleIcon;
  20. }
  21. if (next.collapsible) {
  22. return next.showCollapsibleIcon;
  23. }
  24. return false;
  25. }
  26. function useResizable(items, pxSizes, isRTL) {
  27. return React.useMemo(() => {
  28. const resizeInfos = [];
  29. for (let i = 0; i < items.length - 1; i += 1) {
  30. const prevItem = items[i];
  31. const nextItem = items[i + 1];
  32. const prevSize = pxSizes[i];
  33. const nextSize = pxSizes[i + 1];
  34. const {
  35. resizable: prevResizable = true,
  36. min: prevMin,
  37. collapsible: prevCollapsible
  38. } = prevItem;
  39. const {
  40. resizable: nextResizable = true,
  41. min: nextMin,
  42. collapsible: nextCollapsible
  43. } = nextItem;
  44. const mergedResizable =
  45. // Both need to be resizable
  46. prevResizable && nextResizable && (
  47. // Prev is not collapsed and limit min size
  48. prevSize !== 0 || !prevMin) && (
  49. // Next is not collapsed and limit min size
  50. nextSize !== 0 || !nextMin);
  51. const prevEndCollapsible = !!prevCollapsible.end && prevSize > 0;
  52. const nextStartExpandable = !!nextCollapsible.start && nextSize === 0 && prevSize > 0;
  53. const startCollapsible = prevEndCollapsible || nextStartExpandable;
  54. const nextStartCollapsible = !!nextCollapsible.start && nextSize > 0;
  55. const prevEndExpandable = !!prevCollapsible.end && prevSize === 0 && nextSize > 0;
  56. const endCollapsible = nextStartCollapsible || prevEndExpandable;
  57. const showStartCollapsibleIcon = getShowCollapsibleIcon({
  58. collapsible: prevEndCollapsible,
  59. showCollapsibleIcon: prevCollapsible.showCollapsibleIcon
  60. }, {
  61. collapsible: nextStartExpandable,
  62. showCollapsibleIcon: nextCollapsible.showCollapsibleIcon
  63. });
  64. const showEndCollapsibleIcon = getShowCollapsibleIcon({
  65. collapsible: nextStartCollapsible,
  66. showCollapsibleIcon: nextCollapsible.showCollapsibleIcon
  67. }, {
  68. collapsible: prevEndExpandable,
  69. showCollapsibleIcon: prevCollapsible.showCollapsibleIcon
  70. });
  71. resizeInfos[i] = {
  72. resizable: mergedResizable,
  73. startCollapsible: !!(isRTL ? endCollapsible : startCollapsible),
  74. endCollapsible: !!(isRTL ? startCollapsible : endCollapsible),
  75. showStartCollapsibleIcon: isRTL ? showEndCollapsibleIcon : showStartCollapsibleIcon,
  76. showEndCollapsibleIcon: isRTL ? showStartCollapsibleIcon : showEndCollapsibleIcon
  77. };
  78. }
  79. return resizeInfos;
  80. }, [pxSizes, items]);
  81. }