@talend/react-components/lib/SubHeaderBar/SubHeaderBar.component.js

Set of react components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactI18next = require("react-i18next");
var _classnames = _interopRequireDefault(require("classnames"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _designSystem = require("@talend/design-system");
var _ActionBar = _interopRequireDefault(require("../ActionBar"));
var _Actions = require("../Actions");
var _constants = _interopRequireDefault(require("../constants"));
var _Inject = _interopRequireDefault(require("../Inject"));
var _Skeleton = _interopRequireDefault(require("../Skeleton"));
var _translate = _interopRequireDefault(require("../translate"));
var _TitleSubHeader = _interopRequireDefault(require("./TitleSubHeader"));
var _SubHeaderBarModule = _interopRequireDefault(require("./SubHeaderBar.module.scss"));
var _lodash = require("lodash");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function SubHeaderBarActions({
  children,
  tag,
  left,
  right,
  center,
  hasRight
}) {
  const className = (0, _classnames.default)({
    'tc-subheader-left': left,
    'tc-subheader-center': center,
    'tc-subheader-right': right,
    'tc-subheader-right-no-margin-right': hasRight,
    [_SubHeaderBarModule.default['tc-subheader-navbar-left']]: left,
    [_SubHeaderBarModule.default['tc-subheader-navbar-center']]: center,
    [_SubHeaderBarModule.default['tc-subheader-navbar-center-no-margin-right']]: hasRight,
    [_SubHeaderBarModule.default['tc-subheader-navbar-right']]: right
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: className,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ActionBar.default.Content, {
      tag: tag,
      left: left,
      center: center,
      right: right,
      children: children
    })
  });
}
SubHeaderBarActions.propTypes = {
  children: _propTypes.default.node,
  tag: _propTypes.default.string,
  right: _propTypes.default.bool,
  center: _propTypes.default.bool,
  left: _propTypes.default.bool,
  hasRight: _propTypes.default.bool
};
function CustomInject({
  getComponent,
  left,
  right,
  center,
  nowrap,
  ...props
}) {
  if (nowrap) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Inject.default, {
      getComponent: getComponent,
      ...props
    });
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SubHeaderBarActions, {
    left: left,
    right: right,
    center: center,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Inject.default, {
      getComponent: getComponent,
      ...props
    })
  });
}
CustomInject.propTypes = {
  nowrap: _propTypes.default.bool,
  right: _propTypes.default.bool,
  center: _propTypes.default.bool,
  left: _propTypes.default.bool,
  getComponent: _propTypes.default.func
};
function SubHeaderBar({
  onGoBack,
  components,
  getComponent,
  goBackDataFeature,
  className,
  left,
  center,
  right,
  rightActionsLoading,
  children,
  ...rest
}) {
  const {
    t
  } = (0, _reactI18next.useTranslation)(_constants.default);
  const injected = _Inject.default.all(getComponent, components, CustomInject);
  const Renderer = _Inject.default.getAll(getComponent, {
    Action: _Actions.Action,
    ActionBar: _ActionBar.default
  });
  const hasRight = Array.isArray(right) || (0, _lodash.has)(components, 'before-right') || (0, _lodash.has)(components, 'after-right');
  let rightActions;
  if (rightActionsLoading) {
    rightActions = /*#__PURE__*/(0, _jsxRuntime.jsx)(SubHeaderBarActions, {
      className: (0, _classnames.default)(_SubHeaderBarModule.default['tc-subheader-navbar-right'], 'tc-subheader-navbar-right'),
      right: true,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
        type: _Skeleton.default.TYPES.text,
        size: _Skeleton.default.SIZES.large
      })
    });
  } else {
    rightActions = Array.isArray(right) && right.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(SubHeaderBarActions, {
      className: (0, _classnames.default)(_SubHeaderBarModule.default['tc-subheader-navbar-right'], 'tc-subheader-navbar-right'),
      right: true,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Renderer.Action, {
        ...item
      }, index)
    }, index));
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("header", {
    className: (0, _classnames.default)(_SubHeaderBarModule.default['tc-subheader'], 'tc-subheader', className),
    children: [injected('before-actionbar'), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Renderer.ActionBar, {
      className: (0, _classnames.default)(_SubHeaderBarModule.default['tc-subheader-navbar'], 'tc-subheader-navbar'),
      children: [injected('left'), /*#__PURE__*/(0, _jsxRuntime.jsxs)(SubHeaderBarActions, {
        left: true,
        children: [injected('before-back'), onGoBack && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: (0, _classnames.default)(_SubHeaderBarModule.default['tc-subheader-back-button'], 'tc-subheader-back-button'),
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_designSystem.ButtonIcon, {
            icon: "arrow-left",
            size: "M",
            tooltipPlacement: "right",
            onClick: onGoBack,
            id: "backArrow",
            "data-testid": "tc-subheader-backArrow",
            "data-feature": goBackDataFeature,
            children: t('BACK_ARROW_TOOLTIP', {
              defaultValue: 'Go back'
            })
          })
        }), injected('before-title'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TitleSubHeader.default, {
          t: t,
          getComponent: getComponent,
          ...rest
        }), injected('after-title')]
      }), children, Array.isArray(left) && /*#__PURE__*/(0, _jsxRuntime.jsx)(SubHeaderBarActions, {
        left: true,
        children: left.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Renderer.Action, {
          ...item
        }, index))
      }), injected('center'), Array.isArray(center) && center.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(SubHeaderBarActions, {
        center: true,
        hasRight: hasRight,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Renderer.Action, {
          ...item
        }, index)
      }, index)), injected('right'), rightActions, injected('after-right')]
    }), injected('after-actionbar')]
  });
}
SubHeaderBar.displayName = 'SubHeaderBar';
SubHeaderBar.propTypes = {
  onGoBack: _propTypes.default.func.isRequired,
  className: _propTypes.default.string,
  t: _propTypes.default.func,
  left: _propTypes.default.array,
  right: _propTypes.default.array,
  center: _propTypes.default.array,
  inProgress: _propTypes.default.bool,
  rightActionsLoading: _propTypes.default.bool,
  ..._Inject.default.PropTypes
};
SubHeaderBar.defaultProps = {
  t: (0, _translate.default)()
};
SubHeaderBar.Content = SubHeaderBarActions;
SubHeaderBar.Inject = CustomInject;
var _default = exports.default = SubHeaderBar;
//# sourceMappingURL=SubHeaderBar.component.js.map