@helpscout/hsds-react/components/EditableField/EditableField.Truncated.js

React component library for Help Scout's Design System

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _getValidProps = _interopRequireDefault(require("@helpscout/react-utils/dist/getValidProps"));

var _EditableField = require("./EditableField.css");

var _Truncate = _interopRequireDefault(require("../Truncate"));

var _EditableField2 = require("./EditableField.utils");

var _jsxRuntime = require("react/jsx-runtime");

var EditableFieldTruncated = function EditableFieldTruncated(_ref) {
  var string = _ref.string,
      splitter = _ref.splitter,
      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["string", "splitter"]);

  if (splitter) {
    var _string$split = string.split(splitter),
        first = _string$split[0],
        second = _string$split[1];

    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_EditableField.TruncatedUI, (0, _extends2.default)({}, (0, _getValidProps.default)(rest), {
      className: _EditableField2.TRUNCATED_CLASSNAMES.component + " " + _EditableField2.TRUNCATED_CLASSNAMES.withSplitter,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
        className: "" + _EditableField2.TRUNCATED_CLASSNAMES.firstChunk,
        children: first
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
        className: "" + _EditableField2.TRUNCATED_CLASSNAMES.secondChunk,
        children: [splitter, second]
      })]
    }));
  }

  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Truncate.default, (0, _extends2.default)({}, (0, _getValidProps.default)(rest), {
    className: "" + _EditableField2.TRUNCATED_CLASSNAMES.component,
    children: string
  }));
};

EditableFieldTruncated.defaultProps = {
  'data-cy': 'EditableFieldTruncated'
};
EditableFieldTruncated.propTypes = {
  className: _propTypes.default.string,
  string: _propTypes.default.string,
  splitter: _propTypes.default.string,

  /** Data attr for Cypress tests. */
  'data-cy': _propTypes.default.string
};
var _default = EditableFieldTruncated;
exports.default = _default;