@wix/design-system/dist/cjs/ModalMobileLayout/ModalMobileLayout.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
var _IconButton = _interopRequireDefault(require("../IconButton"));
var _ModalMobileLayoutSt = require("./ModalMobileLayout.st.css.js");
var _Title = _interopRequireDefault(require("./components/Title/Title"));
var _Footer = _interopRequireDefault(require("./components/Footer/Footer"));
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/ModalMobileLayout/ModalMobileLayout.tsx";
var ModalMobileLayout = _ref => {
  var {
    dataHook,
    className,
    title,
    content,
    footer,
    onOverlayClick,
    onCloseButtonClick,
    fullscreen = false,
    stickyTitle = false,
    stickyFooter = false
  } = _ref;
  return /*#__PURE__*/_react.default.createElement("div", {
    id: "modalMobileLayout-root",
    "data-hook": dataHook,
    className: (0, _ModalMobileLayoutSt.st)(_ModalMobileLayoutSt.classes.root, {
      fullscreen,
      noTitle: !title,
      noFooter: !footer
    }, className),
    onClick: _ref2 => {
      var {
        target
      } = _ref2;
      target instanceof HTMLElement && target.id === 'modalMobileLayout-root' && onOverlayClick && onOverlayClick();
    },
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 24,
      columnNumber: 5
    }
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _ModalMobileLayoutSt.classes.container,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 43,
      columnNumber: 7
    }
  }, onCloseButtonClick && /*#__PURE__*/_react.default.createElement("div", {
    className: _ModalMobileLayoutSt.classes.close,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 45,
      columnNumber: 11
    }
  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
    dataHook: "modalMobileLayout-close-button",
    skin: "light",
    onClick: onCloseButtonClick,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 46,
      columnNumber: 13
    }
  }, /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.X, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 51,
      columnNumber: 15
    }
  }))), title && stickyTitle && /*#__PURE__*/_react.default.createElement(_Title.default, {
    isSticky: true,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 55,
      columnNumber: 34
    }
  }, title), /*#__PURE__*/_react.default.createElement("div", {
    className: _ModalMobileLayoutSt.classes.content,
    "data-hook": "modalMobileLayout-content",
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 56,
      columnNumber: 9
    }
  }, /*#__PURE__*/_react.default.createElement("div", {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 57,
      columnNumber: 11
    }
  }, title && !stickyTitle && /*#__PURE__*/_react.default.createElement(_Title.default, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 58,
      columnNumber: 39
    }
  }, title), content, footer && !stickyFooter && /*#__PURE__*/_react.default.createElement(_Footer.default, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 60,
      columnNumber: 41
    }
  }, footer))), footer && stickyFooter && /*#__PURE__*/_react.default.createElement(_Footer.default, {
    isSticky: true,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 63,
      columnNumber: 36
    }
  }, footer)));
};
ModalMobileLayout.displayName = 'ModalMobileLayout';
ModalMobileLayout.propTypes = {
  dataHook: _propTypes.default.string,
  className: _propTypes.default.string,
  title: _propTypes.default.node,
  stickyTitle: _propTypes.default.bool,
  content: _propTypes.default.node,
  footer: _propTypes.default.node,
  stickyFooter: _propTypes.default.bool,
  onOverlayClick: _propTypes.default.func,
  onCloseButtonClick: _propTypes.default.func,
  fullscreen: _propTypes.default.bool
};
var _default = exports.default = ModalMobileLayout;
//# sourceMappingURL=ModalMobileLayout.js.map