@talend/react-components/lib/Layout/TwoColumns/TwoColumns.component.js

Set of react components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _TabBar = _interopRequireDefault(require("../../TabBar"));
var _WithDrawer = _interopRequireDefault(require("../../WithDrawer"));
var _Inject = _interopRequireDefault(require("../../Inject"));
var _TwoColumnsModule = _interopRequireDefault(require("./TwoColumns.module.scss"));
var _lodash = require("lodash");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/**
 * @param {object} props react props
 * @example
 <TwoColumns name="Hello world"></TwoColumns>
 */function TwoColumns({
  one,
  drawers,
  children,
  tabs,
  getComponent,
  ...props
}) {
  const containerCSS = (0, _classnames.default)('tc-layout-two-columns', _TwoColumnsModule.default.container);
  const sidemenuCSS = (0, _classnames.default)('tc-layout-two-columns-left', _TwoColumnsModule.default.sidemenu);
  const mainCSS = (0, _classnames.default)('tc-layout-two-columns-main', _TwoColumnsModule.default.main);
  const style = {
    overflow: 'auto',
    height: '100%',
    display: 'flex',
    flexDirection: 'column'
  };
  const safeOne = _Inject.default.getReactElement(getComponent, one);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: containerCSS,
    ...(0, _lodash.omit)(props, 'getComponents'),
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: sidemenuCSS,
      id: "tc-layout-side-menu",
      tabIndex: "-1",
      children: safeOne
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: mainCSS,
      role: "main",
      id: "tc-layout-main",
      tabIndex: "-1",
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_WithDrawer.default, {
        drawers: drawers,
        children: [tabs && /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabBar.default, {
          ...tabs
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          style: style,
          children: children
        })]
      })
    })]
  });
}
TwoColumns.displayName = 'TwoColumns';
TwoColumns.propTypes = {
  one: _Inject.default.getReactElement.propTypes,
  children: _propTypes.default.node,
  drawers: _propTypes.default.arrayOf(_propTypes.default.node),
  tabs: _propTypes.default.shape(_TabBar.default.propTypes),
  getComponent: _propTypes.default.func
};
var _default = exports.default = TwoColumns;
//# sourceMappingURL=TwoColumns.component.js.map