@zohodesk/dot/es/layout/SubtabLayout/SubtabLayout.js

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

import React from 'react';
import { SubtabHeader_propTypes, SubtabFooter_propTypes, SubtabContent_propTypes, SubtabLayout_propTypes } from "./props/propTypes";
import { SubtabHeader_defaultProps, SubtabFooter_defaultProps, SubtabContent_defaultProps, SubtabLayout_defaultProps } from "./props/defaultProps";
import { Container, Box } from '@zohodesk/components/es/Layout';
import { Card, CardHeader, CardContent } from '@zohodesk/components/es/Card';
import PlusIcon from "../../PlusIcon/PlusIcon";
import style from "./SubtabLayout.module.css";
export class SubtabHeader extends React.Component {
  render() {
    let {
      onAdd,
      getLeftPlaceHolder,
      title,
      label,
      getRightPlaceHolder,
      type,
      leftClassName,
      rightClassName,
      className,
      needBorder,
      needShadow,
      needPlusIconLine,
      children,
      dataId,
      isPeekView
    } = this.props;
    return /*#__PURE__*/React.createElement(CardHeader, {
      customClass: `${style.tabHead} ${needShadow ? style.shadowStyle : ''} ${needBorder ? `${style[type]}_borderStyle` : ''}`
    }, /*#__PURE__*/React.createElement(Container, {
      alignBox: "row",
      className: ` ${className} ${isPeekView ? `${style[type]}_peek` : style[type]}`,
      align: "vertical"
    }, onAdd || children ? /*#__PURE__*/React.createElement(Box, {
      className: `${style.left} ${needPlusIconLine ? style.plusIconLine : ''}`
    }, onAdd ? /*#__PURE__*/React.createElement(PlusIcon, {
      dataId: dataId,
      onClick: onAdd
    }) : children) : null, title ? /*#__PURE__*/React.createElement(Box, {
      className: `${style.title} ${onAdd ? style.cursor : ''}`,
      onClick: onAdd ? onAdd : null
    }, title) : null, getLeftPlaceHolder && /*#__PURE__*/React.createElement(Box, {
      flexible: true,
      shrink: true,
      adjust: getRightPlaceHolder ? true : false,
      className: leftClassName
    }, label ? /*#__PURE__*/React.createElement("div", {
      className: style.label
    }, label) : null, getLeftPlaceHolder), getRightPlaceHolder && /*#__PURE__*/React.createElement(Box, {
      flexible: true,
      shrink: true,
      adjust: getLeftPlaceHolder ? true : false,
      className: rightClassName
    }, /*#__PURE__*/React.createElement(Container, {
      alignBox: "row",
      align: "vertical",
      className: style.aside
    }, getRightPlaceHolder))));
  }

}
SubtabHeader.propTypes = SubtabHeader_propTypes;
SubtabHeader.defaultProps = SubtabHeader_defaultProps;
export class SubtabFooter extends React.Component {
  render() {
    let {
      isPeekView,
      getRightFooterPlaceHolder,
      dataId,
      children,
      className,
      leftClassName,
      rightClassName,
      size,
      needPadding,
      type
    } = this.props;
    return /*#__PURE__*/React.createElement(Container, {
      alignBox: "row",
      align: "vertical",
      className: ` ${style.footer}  ${needPadding ? isPeekView ? `${style[type]}_peekFooter` : `${style[type]}_detailFooter` : ''} ${style[size]} ${className}`,
      dataId: dataId
    }, children ? /*#__PURE__*/React.createElement(Box, {
      flexible: true,
      shrink: true,
      className: leftClassName
    }, children) : null, getRightFooterPlaceHolder ? /*#__PURE__*/React.createElement(Box, {
      flexible: true,
      shrink: true,
      className: rightClassName
    }, getRightFooterPlaceHolder) : null);
  }

}
SubtabFooter.propTypes = SubtabFooter_propTypes;
SubtabFooter.defaultProps = SubtabFooter_defaultProps;
export class SubtabContent extends React.Component {
  render() {
    let {
      children,
      scroll,
      className,
      eleRef,
      dataId,
      onScroll
    } = this.props;
    return /*#__PURE__*/React.createElement(CardContent, {
      scroll: scroll,
      isScrollAttribute: true,
      onScroll: onScroll,
      customClass: className ? className : '',
      eleRef: eleRef,
      dataId: dataId
    }, children);
  }

}
SubtabContent.propTypes = SubtabContent_propTypes;
SubtabContent.defaultProps = SubtabContent_defaultProps;
export default class SubtabLayout extends React.Component {
  render() {
    let {
      children,
      dataId
    } = this.props;
    return /*#__PURE__*/React.createElement(Card, {
      isScrollAttribute: true,
      dataId: dataId,
      ...this.props,
      childTypes: {
        cardHeader: SubtabHeader,
        cardContent: SubtabContent
      }
    }, children);
  }

}
SubtabLayout.defaultProps = SubtabLayout_defaultProps;
SubtabLayout.propTypes = SubtabLayout_propTypes; // if (__DOCS__) {
//   SubtabLayout.docs = {
//     componentGroup: 'Template'
//   };
// }