@wulperstudio/cms/node/components/TextForLinesOutput/TextForLinesOutput.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _material = require("@mui/material");
var _styled = require("./styled");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["text", "clines", "variantElipsis", "elipsisProps", "onClickElipsis", "containerProps"],
  _excluded2 = ["textElipsis"];
var TextForLinesOutput = function TextForLinesOutput(_ref) {
  var text = _ref.text,
    clines = _ref.clines,
    _ref$variantElipsis = _ref.variantElipsis,
    variantElipsis = _ref$variantElipsis === void 0 ? 'default' : _ref$variantElipsis,
    elipsisProps = _ref.elipsisProps,
    onClickElipsis = _ref.onClickElipsis,
    containerProps = _ref.containerProps,
    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  var theme = (0, _material.useTheme)();
  var _ref2 = elipsisProps || {},
    textElipsis = _ref2.textElipsis,
    rest = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
  var _React$useState = _react["default"].useState(false),
    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
    isElipsis = _React$useState2[0],
    setIsElipsis = _React$useState2[1];
  var handleIsElipsis = function handleIsElipsis() {
    return setIsElipsis(function (prev) {
      return !prev;
    });
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, Object.assign({}, containerProps, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.Clines, {
      isElipsis: isElipsis,
      clines: clines,
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, Object.assign({}, props, {
        children: [text, ' ']
      }))
    }), variantElipsis === 'showMore' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
      onClick: function onClick(e) {
        handleIsElipsis();
        onClickElipsis == null || onClickElipsis(e);
      },
      component: "span",
      sx: Object.assign({
        color: 'text.primary',
        fontSize: theme.typography.fontSize,
        textDecoration: 'underline',
        cursor: 'pointer'
      }, rest.sx),
      children: isElipsis ? (textElipsis == null ? void 0 : textElipsis.less) || 'show less' : (textElipsis == null ? void 0 : textElipsis.more) || 'show more'
    })]
  }));
};
var _default = exports["default"] = TextForLinesOutput;