PurePanel.js 3.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. "use strict";
  2. "use client";
  3. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  4. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  5. Object.defineProperty(exports, "__esModule", {
  6. value: true
  7. });
  8. exports.default = void 0;
  9. exports.withPureRenderTheme = withPureRenderTheme;
  10. var React = _interopRequireWildcard(require("react"));
  11. var _useMergedState = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
  12. var _configProvider = _interopRequireWildcard(require("../config-provider"));
  13. function withPureRenderTheme(Component) {
  14. return props => (/*#__PURE__*/React.createElement(_configProvider.default, {
  15. theme: {
  16. token: {
  17. motion: false,
  18. zIndexPopupBase: 0
  19. }
  20. }
  21. }, /*#__PURE__*/React.createElement(Component, Object.assign({}, props))));
  22. }
  23. /* istanbul ignore next */
  24. const genPurePanel = (Component, alignPropName, postProps, defaultPrefixCls, getDropdownCls) => {
  25. const PurePanel = props => {
  26. const {
  27. prefixCls: customizePrefixCls,
  28. style
  29. } = props;
  30. const holderRef = React.useRef(null);
  31. const [popupHeight, setPopupHeight] = React.useState(0);
  32. const [popupWidth, setPopupWidth] = React.useState(0);
  33. const [open, setOpen] = (0, _useMergedState.default)(false, {
  34. value: props.open
  35. });
  36. const {
  37. getPrefixCls
  38. } = React.useContext(_configProvider.ConfigContext);
  39. const prefixCls = getPrefixCls(defaultPrefixCls || 'select', customizePrefixCls);
  40. React.useEffect(() => {
  41. // We do not care about ssr
  42. setOpen(true);
  43. if (typeof ResizeObserver !== 'undefined') {
  44. const resizeObserver = new ResizeObserver(entries => {
  45. const element = entries[0].target;
  46. setPopupHeight(element.offsetHeight + 8);
  47. setPopupWidth(element.offsetWidth);
  48. });
  49. const interval = setInterval(() => {
  50. var _a;
  51. const dropdownCls = getDropdownCls ? `.${getDropdownCls(prefixCls)}` : `.${prefixCls}-dropdown`;
  52. const popup = (_a = holderRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(dropdownCls);
  53. if (popup) {
  54. clearInterval(interval);
  55. resizeObserver.observe(popup);
  56. }
  57. }, 10);
  58. return () => {
  59. clearInterval(interval);
  60. resizeObserver.disconnect();
  61. };
  62. }
  63. }, []);
  64. let mergedProps = Object.assign(Object.assign({}, props), {
  65. style: Object.assign(Object.assign({}, style), {
  66. margin: 0
  67. }),
  68. open,
  69. visible: open,
  70. getPopupContainer: () => holderRef.current
  71. });
  72. if (postProps) {
  73. mergedProps = postProps(mergedProps);
  74. }
  75. if (alignPropName) {
  76. Object.assign(mergedProps, {
  77. [alignPropName]: {
  78. overflow: {
  79. adjustX: false,
  80. adjustY: false
  81. }
  82. }
  83. });
  84. }
  85. const mergedStyle = {
  86. paddingBottom: popupHeight,
  87. position: 'relative',
  88. minWidth: popupWidth
  89. };
  90. return /*#__PURE__*/React.createElement("div", {
  91. ref: holderRef,
  92. style: mergedStyle
  93. }, /*#__PURE__*/React.createElement(Component, Object.assign({}, mergedProps)));
  94. };
  95. return withPureRenderTheme(PurePanel);
  96. };
  97. var _default = exports.default = genPurePanel;