@zohodesk/dot/lib/v1/layout/SubtabLayout/SubtabLayout.js

In this Library, we Provide Some Basic Components to Build Your Application

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.SubtabContent = SubtabContent;
exports.SubtabFooter = SubtabFooter;
exports.SubtabHeader = SubtabHeader;
exports["default"] = SubtabLayout;

var _react = _interopRequireDefault(require("react"));

var _propTypes = require("./props/propTypes");

var _defaultProps = require("./props/defaultProps");

var _Layout = require("@zohodesk/components/es/v1/Layout");

var _Card = require("@zohodesk/components/es/v1/Card");

var _PlusIcon = _interopRequireDefault(require("../../PlusIcon/PlusIcon"));

var _SubtabLayoutModule = _interopRequireDefault(require("../../../layout/SubtabLayout/SubtabLayout.module.css"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function SubtabHeader(props) {
  var onAdd = props.onAdd,
      getLeftPlaceHolder = props.getLeftPlaceHolder,
      title = props.title,
      label = props.label,
      getRightPlaceHolder = props.getRightPlaceHolder,
      type = props.type,
      leftClassName = props.leftClassName,
      rightClassName = props.rightClassName,
      className = props.className,
      needBorder = props.needBorder,
      needShadow = props.needShadow,
      needPlusIconLine = props.needPlusIconLine,
      children = props.children,
      dataId = props.dataId,
      isPeekView = props.isPeekView;
  return /*#__PURE__*/_react["default"].createElement(_Card.CardHeader, {
    customClass: "".concat(_SubtabLayoutModule["default"].tabHead, " ").concat(needShadow ? _SubtabLayoutModule["default"].shadowStyle : '', " ").concat(needBorder ? "".concat(_SubtabLayoutModule["default"][type], "_borderStyle") : '')
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
    alignBox: "row",
    className: " ".concat(className, " ").concat(isPeekView ? "".concat(_SubtabLayoutModule["default"][type], "_peek") : _SubtabLayoutModule["default"][type]),
    align: "vertical"
  }, onAdd || children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
    className: "".concat(_SubtabLayoutModule["default"].left, " ").concat(needPlusIconLine ? _SubtabLayoutModule["default"].plusIconLine : '')
  }, onAdd ? /*#__PURE__*/_react["default"].createElement(_PlusIcon["default"], {
    dataId: dataId,
    onClick: onAdd
  }) : children) : null, title ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
    className: "".concat(_SubtabLayoutModule["default"].title, " ").concat(onAdd ? _SubtabLayoutModule["default"].cursor : ''),
    onClick: onAdd ? onAdd : null
  }, title) : null, getLeftPlaceHolder && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
    flexible: true,
    shrink: true,
    adjust: getRightPlaceHolder ? true : false,
    className: leftClassName
  }, label ? /*#__PURE__*/_react["default"].createElement("div", {
    className: _SubtabLayoutModule["default"].label
  }, label) : null, getLeftPlaceHolder), getRightPlaceHolder && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
    flexible: true,
    shrink: true,
    adjust: getLeftPlaceHolder ? true : false,
    className: rightClassName
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
    alignBox: "row",
    align: "vertical",
    className: _SubtabLayoutModule["default"].aside
  }, getRightPlaceHolder))));
}

SubtabHeader.propTypes = _propTypes.SubtabHeader_propTypes;
SubtabHeader.defaultProps = _defaultProps.SubtabHeader_defaultProps;

function SubtabFooter(props) {
  var isPeekView = props.isPeekView,
      getRightFooterPlaceHolder = props.getRightFooterPlaceHolder,
      dataId = props.dataId,
      children = props.children,
      className = props.className,
      leftClassName = props.leftClassName,
      rightClassName = props.rightClassName,
      size = props.size,
      needPadding = props.needPadding,
      type = props.type;
  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
    alignBox: "row",
    align: "vertical",
    className: " ".concat(_SubtabLayoutModule["default"].footer, "  ").concat(needPadding ? isPeekView ? "".concat(_SubtabLayoutModule["default"][type], "_peekFooter") : "".concat(_SubtabLayoutModule["default"][type], "_detailFooter") : '', " ").concat(_SubtabLayoutModule["default"][size], " ").concat(className),
    dataId: dataId
  }, children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
    flexible: true,
    shrink: true,
    className: leftClassName
  }, children) : null, getRightFooterPlaceHolder ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
    flexible: true,
    shrink: true,
    className: rightClassName
  }, getRightFooterPlaceHolder) : null);
}

SubtabFooter.propTypes = _propTypes.SubtabFooter_propTypes;
SubtabFooter.defaultProps = _defaultProps.SubtabFooter_defaultProps;

function SubtabContent(props) {
  var children = props.children,
      scroll = props.scroll,
      className = props.className,
      eleRef = props.eleRef,
      dataId = props.dataId,
      onScroll = props.onScroll;
  return /*#__PURE__*/_react["default"].createElement(_Card.CardContent, {
    scroll: scroll,
    isScrollAttribute: true,
    onScroll: onScroll,
    customClass: className ? className : '',
    eleRef: eleRef,
    dataId: dataId
  }, children);
}

SubtabContent.propTypes = _propTypes.SubtabContent_propTypes;
SubtabContent.defaultProps = _defaultProps.SubtabContent_defaultProps;

function SubtabLayout(props) {
  var children = props.children,
      dataId = props.dataId;
  return /*#__PURE__*/_react["default"].createElement(_Card.Card, _extends({
    isScrollAttribute: true,
    dataId: dataId
  }, props, {
    childTypes: {
      cardHeader: SubtabHeader,
      cardContent: SubtabContent
    }
  }), children);
}

SubtabLayout.defaultProps = _defaultProps.SubtabLayout_defaultProps;
SubtabLayout.propTypes = _propTypes.SubtabLayout_propTypes;