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

Set of react components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.EditableTextComponent = EditableTextComponent;
exports.default = void 0;
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _reactI18next = require("react-i18next");
var _Skeleton = _interopRequireDefault(require("../Skeleton"));
var _InlineForm = _interopRequireDefault(require("./InlineForm.component"));
var _PlainTextTitle = require("./PlainTextTitle.component");
var _EditableTextModule = _interopRequireDefault(require("./EditableText.module.scss"));
var _translate = _interopRequireDefault(require("../translate"));
var _constants = _interopRequireDefault(require("../constants"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function EditableTextComponent({
  editMode,
  loading,
  inProgress,
  ...rest
}) {
  if (loading) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
      type: _Skeleton.default.TYPES.text,
      size: _Skeleton.default.SIZES.large
    });
  }
  const Component = editMode ? _InlineForm.default : _PlainTextTitle.PlainTextTitle;
  const allyProps = {};
  if (inProgress) {
    allyProps['aria-label'] = rest.t('EDITABLE_TEXT_IN_PROGRESS', {
      defaultValue: 'Edit in progress'
    });
    allyProps['aria-busy'] = true;
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: (0, _classnames.default)(_EditableTextModule.default['tc-editable-text'], 'tc-editable-text', {
      [_EditableTextModule.default['tc-editable-text-blink']]: inProgress,
      'tc-editable-text-blink': inProgress
    }),
    ...allyProps,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
      inProgress: inProgress,
      ...rest
    })
  });
}
EditableTextComponent.displayName = 'EditableText';
EditableTextComponent.propTypes = {
  componentClass: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
  disabled: _propTypes.default.bool,
  editMode: _propTypes.default.bool,
  inProgress: _propTypes.default.bool,
  loading: _propTypes.default.bool,
  onEdit: _propTypes.default.func.isRequired,
  text: _propTypes.default.string.isRequired,
  t: _propTypes.default.func
};
EditableTextComponent.defaultProps = {
  editMode: false,
  inProgress: false,
  loading: false,
  t: (0, _translate.default)()
};
var _default = exports.default = (0, _reactI18next.withTranslation)(_constants.default)(EditableTextComponent);
//# sourceMappingURL=EditableText.component.js.map