1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677 |
- import _extends from "@babel/runtime/helpers/esm/extends";
- import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
- var _excluded = ["prefixCls", "invalidate", "item", "renderItem", "responsive", "responsiveDisabled", "registerSize", "itemKey", "className", "style", "children", "display", "order", "component"];
- import * as React from 'react';
- import classNames from 'classnames';
- import ResizeObserver from 'rc-resize-observer';
- // Use shared variable to save bundle size
- var UNDEFINED = undefined;
- function InternalItem(props, ref) {
- var prefixCls = props.prefixCls,
- invalidate = props.invalidate,
- item = props.item,
- renderItem = props.renderItem,
- responsive = props.responsive,
- responsiveDisabled = props.responsiveDisabled,
- registerSize = props.registerSize,
- itemKey = props.itemKey,
- className = props.className,
- style = props.style,
- children = props.children,
- display = props.display,
- order = props.order,
- _props$component = props.component,
- Component = _props$component === void 0 ? 'div' : _props$component,
- restProps = _objectWithoutProperties(props, _excluded);
- var mergedHidden = responsive && !display;
- // ================================ Effect ================================
- function internalRegisterSize(width) {
- registerSize(itemKey, width);
- }
- React.useEffect(function () {
- return function () {
- internalRegisterSize(null);
- };
- }, []);
- // ================================ Render ================================
- var childNode = renderItem && item !== UNDEFINED ? renderItem(item, {
- index: order
- }) : children;
- var overflowStyle;
- if (!invalidate) {
- overflowStyle = {
- opacity: mergedHidden ? 0 : 1,
- height: mergedHidden ? 0 : UNDEFINED,
- overflowY: mergedHidden ? 'hidden' : UNDEFINED,
- order: responsive ? order : UNDEFINED,
- pointerEvents: mergedHidden ? 'none' : UNDEFINED,
- position: mergedHidden ? 'absolute' : UNDEFINED
- };
- }
- var overflowProps = {};
- if (mergedHidden) {
- overflowProps['aria-hidden'] = true;
- }
- var itemNode = /*#__PURE__*/React.createElement(Component, _extends({
- className: classNames(!invalidate && prefixCls, className),
- style: _objectSpread(_objectSpread({}, overflowStyle), style)
- }, overflowProps, restProps, {
- ref: ref
- }), childNode);
- if (responsive) {
- itemNode = /*#__PURE__*/React.createElement(ResizeObserver, {
- onResize: function onResize(_ref) {
- var offsetWidth = _ref.offsetWidth;
- internalRegisterSize(offsetWidth);
- },
- disabled: responsiveDisabled
- }, itemNode);
- }
- return itemNode;
- }
- var Item = /*#__PURE__*/React.forwardRef(InternalItem);
- Item.displayName = 'Item';
- export default Item;
|