@wix/design-system/dist/cjs/BaseModalLayout/LayoutBlocks/Content/Content.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.Content = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _ContentSt = require("./Content.st.css.js");
var _react = _interopRequireWildcard(require("react"));
var _Divider = _interopRequireDefault(require("../../../Divider"));
var _ScrollableContainer = _interopRequireWildcard(require("../../../common/ScrollableContainer"));
var _constants = require("../../constants");
var _BaseModalLayoutContext = require("../../BaseModalLayoutContext");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/BaseModalLayout/LayoutBlocks/Content/Content.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var Content = _ref => {
  var dataHook = _ref.dataHook,
    className = _ref.className,
    children = _ref.children,
    _ref$hideTopScrollDiv = _ref.hideTopScrollDivider,
    hideTopScrollDivider = _ref$hideTopScrollDiv === void 0 ? false : _ref$hideTopScrollDiv,
    _ref$hideBottomScroll = _ref.hideBottomScrollDivider,
    hideBottomScrollDivider = _ref$hideBottomScroll === void 0 ? false : _ref$hideBottomScroll,
    _ref$overflowY = _ref.overflowY,
    overflowY = _ref$overflowY === void 0 ? 'auto' : _ref$overflowY,
    _ref$scrollProps = _ref.scrollProps,
    scrollProps = _ref$scrollProps === void 0 ? {} : _ref$scrollProps;
  var _useBaseModalLayoutCo = (0, _BaseModalLayoutContext.useBaseModalLayoutContext)(),
    contentClassName = _useBaseModalLayoutCo.contentClassName,
    _useBaseModalLayoutCo2 = _useBaseModalLayoutCo.content,
    content = _useBaseModalLayoutCo2 === void 0 ? children : _useBaseModalLayoutCo2;
  var _useState = (0, _react.useState)(_ScrollableContainer.AreaY.NONE),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    scrollAreaY = _useState2[0],
    setScrollAreaY = _useState2[1];
  var onScrollAreaChanged = scrollProps.onScrollAreaChanged;
  var hideContentDividers = hideTopScrollDivider && hideBottomScrollDivider;
  var handleScrollAreaChanged = (0, _react.useCallback)(_ref2 => {
    var area = _ref2.area,
      target = _ref2.target;
    if (scrollAreaY !== area.y) {
      if (!hideContentDividers) {
        setScrollAreaY(area.y);
      }
      if (onScrollAreaChanged) {
        onScrollAreaChanged({
          area,
          target
        });
      }
    }
  }, [hideContentDividers, onScrollAreaChanged, scrollAreaY]);
  var isTopDividerHidden = (0, _react.useCallback)(() => hideTopScrollDivider || scrollAreaY === _ScrollableContainer.AreaY.TOP || scrollAreaY === _ScrollableContainer.AreaY.NONE, [hideTopScrollDivider, scrollAreaY]);
  var isBottomDividerHidden = (0, _react.useCallback)(() => hideBottomScrollDivider || scrollAreaY === _ScrollableContainer.AreaY.BOTTOM || scrollAreaY === _ScrollableContainer.AreaY.NONE, [hideBottomScrollDivider, scrollAreaY]);
  var registerToScrollAreaChanges = !hideContentDividers || !!onScrollAreaChanged;
  return content && /*#__PURE__*/_react.default.createElement("div", {
    "data-hook": dataHook,
    "data-hidedividers": hideContentDividers,
    style: {
      overflowY
    },
    className: (0, _ContentSt.st)(_ContentSt.classes.root, {
      hideTopDivider: isTopDividerHidden(),
      hideBottomDivider: isBottomDividerHidden()
    }, contentClassName, className),
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 61,
      columnNumber: 7
    }
  }, !hideTopScrollDivider && /*#__PURE__*/_react.default.createElement(_Divider.default, {
    className: _ContentSt.classes.topDivider,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 75,
      columnNumber: 35
    }
  }), /*#__PURE__*/_react.default.createElement(_ScrollableContainer.default, {
    style: {
      overflowY
    },
    dataHook: _constants.dataHooks.contentWrapper,
    className: _ContentSt.classes.innerContent,
    onScrollAreaChanged: registerToScrollAreaChanges && handleScrollAreaChanged || undefined,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 76,
      columnNumber: 9
    }
  }, content), !hideBottomScrollDivider && /*#__PURE__*/_react.default.createElement(_Divider.default, {
    className: _ContentSt.classes.bottomDivider,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 88,
      columnNumber: 11
    }
  })) || null;
};
exports.Content = Content;
Content.displayName = 'BaseModalLayout.Content';
//# sourceMappingURL=Content.js.map