terra-clinical-item-display/lib/terra-dev-site/doc/example/TruncatedText.js

The Item Display component creates an display for text and an optional graphic. The Comment subcomponent creates a display for text with a comment icon.

"use strict";

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _terraClinicalItemDisplay = _interopRequireDefault(require("terra-clinical-item-display"));
var _terraList = _interopRequireWildcard(require("terra-list"));
var _terraPopup = _interopRequireDefault(require("terra-popup"));
var _terraButton = _interopRequireDefault(require("terra-button"));
var _terraModalManager = _interopRequireDefault(require("terra-modal-manager"));
var _terraToggleButton = _interopRequireDefault(require("terra-toggle-button"));
var _terraDisclosureManager = require("terra-disclosure-manager");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var fullText = 'Mr. James is currently receiving outpatient treatment. He has been diagnosed with an Axis I diagnosis of Psychosis NOS, ruled out Schizoaffective Disorder and Post Traumatic Stress Disorder, and is being treated with Haldol 5mg and Cogentin 1mg. His treatment may have potential side effects such as dizziness and headaches. His symptoms have been manageable, if any side effects or concerns come up, consult with the doctor immediately.';
var TruncatedText = function TruncatedText() {
  var _useState = (0, _react.useState)(false),
    _useState2 = _slicedToArray(_useState, 2),
    popupOpen = _useState2[0],
    setPopupOpen = _useState2[1];
  var popupRef = (0, _react.useRef)(null);
  var setButtonNode = function setButtonNode(node) {
    popupRef.current = node;
  };
  var handleButtonClick = function handleButtonClick() {
    if (!popupOpen) {
      document.querySelector('#root').setAttribute('inert', 'true');
    }
    setPopupOpen(true);
  };
  var handleRequestClose = function handleRequestClose() {
    setPopupOpen(false);
    document.querySelector('#root').removeAttribute('inert');
    popupRef.current.focus();
  };
  var FullTextModalContent = function FullTextModalContent() {
    var disclosureManager = (0, _react.useContext)(_terraDisclosureManager.DisclosureManagerContext);
    var disclose = function disclose() {
      disclosureManager.disclose({
        preferredType: 'modal',
        size: 'tiny',
        content: {
          key: 'text-key',
          component: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_terraDisclosureManager.DisclosureManagerHeaderAdapter, null), /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
            text: fullText
          }))
        }
      });
    };
    return /*#__PURE__*/_react.default.createElement(_terraButton.default, {
      onClick: disclose,
      text: "Show full truncated text dialog",
      variant: "de-emphasis"
    });
  };
  var modalExample = /*#__PURE__*/_react.default.createElement(_terraList.Item, {
    isSelectable: true,
    hasChevron: true
  }, /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: "Modal Example",
    textStyle: "strong",
    isTruncated: true
  }), /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: fullText,
    textStyle: "secondary",
    isTruncated: true
  }), /*#__PURE__*/_react.default.createElement(_terraModalManager.default, null, /*#__PURE__*/_react.default.createElement(FullTextModalContent, null)));
  var popupExample = /*#__PURE__*/_react.default.createElement(_terraList.Item, {
    isSelectable: true,
    hasChevron: true
  }, /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: "Popup Example",
    textStyle: "strong",
    isTruncated: true
  }), /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: fullText,
    textStyle: "secondary",
    isTruncated: true
  }), /*#__PURE__*/_react.default.createElement(_terraButton.default, {
    onClick: handleButtonClick,
    refCallback: setButtonNode,
    text: "Show full truncated text popup",
    variant: "de-emphasis"
  }), /*#__PURE__*/_react.default.createElement(_terraPopup.default, {
    isOpen: popupOpen,
    targetRef: function targetRef() {
      return popupRef.current;
    },
    onRequestClose: handleRequestClose,
    isHeaderDisabled: false
  }, /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: fullText
  })));
  var buttonToggleExample = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_terraList.Item, {
    isSelectable: true,
    hasChevron: true
  }, /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: "Toggle button example",
    textStyle: "strong",
    isTruncated: true
  }), /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: fullText,
    textStyle: "secondary",
    isTruncated: true
  })), /*#__PURE__*/_react.default.createElement(_terraToggleButton.default, {
    closedButtonText: "Toggle full truncated text"
  }, /*#__PURE__*/_react.default.createElement(_terraClinicalItemDisplay.default, {
    text: fullText,
    textStyle: "secondary"
  })));
  return /*#__PURE__*/_react.default.createElement(_terraList.default, null, buttonToggleExample, modalExample, popupExample);
};
var _default = exports.default = TruncatedText;