@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 _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,
    className,
    children,
    hideTopScrollDivider = false,
    hideBottomScrollDivider = false,
    overflowY = 'auto',
    scrollProps = {}
  } = _ref;
  var {
    contentClassName,
    content = children
  } = (0, _BaseModalLayoutContext.useBaseModalLayoutContext)();
  var [scrollAreaY, setScrollAreaY] = (0, _react.useState)(_ScrollableContainer.AreaY.NONE);
  var {
    onScrollAreaChanged
  } = scrollProps;
  var hideContentDividers = hideTopScrollDivider && hideBottomScrollDivider;
  var handleScrollAreaChanged = (0, _react.useCallback)(_ref2 => {
    var {
      area,
      target
    } = _ref2;
    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