@elliemae/ds-truncated-tooltip-text 2.2.0-alpha.3 → 3.0.0-next.0

package/cjs/DSTruncateTextWithTooltip.js

@@ -1,86 +1,75 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var DSTruncateTextWithTooltip_exports = {};
-__export(DSTruncateTextWithTooltip_exports, {
-  DSTruncateTextWithTooltip: () => DSTruncateTextWithTooltip,
-  DSTruncateTextWithTooltipDatatestId: () => DSTruncateTextWithTooltipDatatestId
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_tooltip = __toESM(require("@elliemae/ds-tooltip"));
-var import_styled_components = __toESM(require("styled-components"));
-const Text = import_styled_components.default.span`
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-  display: inline-block;
-  max-width: 100%;
-  :focus {
-    border: none;
-    outline: none;
-    background: ${(props) => props.theme.colors.brand["200"]};
-  }
-`;
-const DSTruncateTextWithTooltipDatatestId = "DS-TruncateTextWithTooltip";
-const DSTruncateTextWithTooltip = ({ text, tooltipProps = {} }) => {
-  const [textWrapperEl, setTextWrapperEl] = (0, import_react.useState)();
-  const [isShowingEllipsis, setIsShowingEllipsis] = (0, import_react.useState)(false);
-  const resizeObserver = (0, import_react.useMemo)(() => new ResizeObserver((entries) => {
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var dsTooltip = require('@elliemae/ds-tooltip');
+var styled = require('styled-components');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const Text = /*#__PURE__*/styled__default["default"].span.withConfig({
+  componentId: "sc-1w57q5j-0"
+})(["text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:100%;:focus{border:none;outline:none;background:", ";}"], props => props.theme.colors.brand['200']);
+const DSTruncateTextWithTooltipDatatestId = 'DS-TruncateTextWithTooltip';
+const DSTruncateTextWithTooltip = _ref => {
+  let {
+    text,
+    tooltipProps = {}
+  } = _ref;
+  const [textWrapperEl, setTextWrapperEl] = React.useState(); // const textWrapperEl = useRef<HTMLSpanElement>();
+
+  const [isShowingEllipsis, setIsShowingEllipsis] = React.useState(false); // const isShowingEllipsis = textWrapperEl?.scrollWidth > textWrapperEl?.clientWidth;
+
+  const resizeObserver = React.useMemo(() => new ResizeObserver(entries => {
     if (entries.length) {
       const [textWrapperEntry] = entries;
       const el = textWrapperEntry.target;
-      setIsShowingEllipsis(el?.scrollWidth > el?.clientWidth);
+      setIsShowingEllipsis((el === null || el === void 0 ? void 0 : el.scrollWidth) > (el === null || el === void 0 ? void 0 : el.clientWidth));
     }
   }), []);
-  (0, import_react.useEffect)(() => {
+  React.useEffect(() => {
     if (textWrapperEl) {
-      setIsShowingEllipsis(textWrapperEl?.scrollWidth > textWrapperEl?.clientWidth);
+      setIsShowingEllipsis((textWrapperEl === null || textWrapperEl === void 0 ? void 0 : textWrapperEl.scrollWidth) > (textWrapperEl === null || textWrapperEl === void 0 ? void 0 : textWrapperEl.clientWidth));
       resizeObserver.observe(textWrapperEl);
     }
+
     return () => {
       if (textWrapperEl) {
         resizeObserver.unobserve(textWrapperEl);
       }
     };
   }, [resizeObserver, textWrapperEl]);
-  if (isShowingEllipsis)
-    return /* @__PURE__ */ import_react.default.createElement(import_ds_tooltip.DSTooltipV3, {
-      text,
-      ...tooltipProps
-    }, /* @__PURE__ */ import_react.default.createElement(Text, {
+  if (isShowingEllipsis) return /*#__PURE__*/jsxRuntime.jsx(dsTooltip.DSTooltipV3, _objectSpread(_objectSpread({
+    text: text
+  }, tooltipProps), {}, {
+    children: /*#__PURE__*/jsxRuntime.jsx(Text, {
       ref: setTextWrapperEl,
       tabIndex: 0,
-      "data-testid": DSTruncateTextWithTooltipDatatestId
-    }, text));
-  return /* @__PURE__ */ import_react.default.createElement(Text, {
+      "data-testid": DSTruncateTextWithTooltipDatatestId,
+      children: text
+    })
+  }));
+  return /*#__PURE__*/jsxRuntime.jsx(Text, {
     ref: setTextWrapperEl,
-    "data-testid": DSTruncateTextWithTooltipDatatestId
-  }, text);
+    "data-testid": DSTruncateTextWithTooltipDatatestId,
+    children: text
+  });
 };
-module.exports = __toCommonJS(DSTruncateTextWithTooltip_exports);
-//# sourceMappingURL=DSTruncateTextWithTooltip.js.map
+
+exports.DSTruncateTextWithTooltip = DSTruncateTextWithTooltip;
+exports.DSTruncateTextWithTooltipDatatestId = DSTruncateTextWithTooltipDatatestId;

package/cjs/DSTruncatedTooltipText.js

@@ -1,66 +1,69 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var DSTruncatedTooltipText_exports = {};
-__export(DSTruncatedTooltipText_exports, {
-  DSTruncatedTooltipText: () => DSTruncatedTooltipText,
-  TruncatedTooltipTextWithSchema: () => TruncatedTooltipTextWithSchema,
-  default: () => DSTruncatedTooltipText_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_react_desc = __toESM(require("react-desc"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_ds_popper = __toESM(require("@elliemae/ds-popper"));
-var import_TooltipTextProvider = __toESM(require("./TooltipTextProvider"));
-const isEllipsisActive = ({ offsetWidth, scrollWidth }) => offsetWidth < scrollWidth;
-const Text = import_styled_components.default.span`
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-  display: inline-block;
-  max-width: 100%;
-`;
-const DSTruncatedTooltipText = ({
-  containerProps = {},
-  value = "",
-  zIndex = 110,
-  ...otherTextProps
-}) => {
-  const tooltipContext = (0, import_react.useContext)(import_TooltipTextProvider.TruncatedTooltipContext);
-  (0, import_react.useEffect)(() => {
-    if (zIndex && tooltipContext)
-      tooltipContext.setZIndex(zIndex);
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var React = require('react');
+var reactDesc = require('react-desc');
+var styled = require('styled-components');
+var dsPopper = require('@elliemae/ds-popper');
+var TooltipTextProvider = require('./TooltipTextProvider.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+const _excluded = ["containerProps", "value", "zIndex"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+const isEllipsisActive = _ref => {
+  let {
+    offsetWidth,
+    scrollWidth
+  } = _ref;
+  return offsetWidth < scrollWidth;
+}; // reduce the possibility of error showing the tooltip (text-overflow: ellipsis) https://jira.elliemae.io/browse/PUI-1755
+
+
+const Text = /*#__PURE__*/styled__default["default"].span.withConfig({
+  componentId: "sc-1olo1o7-0"
+})(["text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:100%;"]);
+
+const DSTruncatedTooltipText = _ref2 => {
+  let {
+    containerProps = {},
+    value = '',
+    zIndex = 110
+  } = _ref2,
+      otherTextProps = _objectWithoutProperties__default["default"](_ref2, _excluded);
+
+  const tooltipContext = React.useContext(TooltipTextProvider.TruncatedTooltipContext);
+  React.useEffect(() => {
+    if (zIndex && tooltipContext) tooltipContext.setZIndex(zIndex);
   }, [zIndex]);
-  if (!tooltipContext)
-    return value;
-  const { showTooltip, hideTooltip } = tooltipContext;
-  const handleMouseEnter = (e) => {
-    const { target } = e;
+  if (!tooltipContext) return value;
+  const {
+    showTooltip,
+    hideTooltip
+  } = tooltipContext;
+
+  const handleMouseEnter = e => {
+    const {
+      target
+    } = e;
+
     if (target && isEllipsisActive(target, target.getBoundingClientRect())) {
       showTooltip({
         value,
@@ -68,52 +71,42 @@ const DSTruncatedTooltipText = ({
       }, e);
     }
   };
-  const handleMouseLeave = (e) => {
-    hideTooltip({ reference: e.target });
+
+  const handleMouseLeave = e => {
+    hideTooltip({
+      reference: e.target
+    });
   };
-  const handlers = showTooltip ? { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave } : {};
-  return /* @__PURE__ */ import_react.default.createElement(Text, {
-    ...containerProps,
-    ...otherTextProps,
-    ...handlers
-  }, value);
+
+  const handlers = showTooltip ? {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  } : {};
+  return /*#__PURE__*/jsxRuntime.jsx(Text, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, containerProps), otherTextProps), handlers), {}, {
+    children: value
+  }));
 };
+
 DSTruncatedTooltipText.defaultProps = {
-  value: "",
+  value: '',
   zIndex: 110
 };
 const truncatedTooltipTextProps = {
-  containerProps: import_react_desc.PropTypes.object.description("Set of Properties attached to the main container"),
-  value: import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number]).description("Text that when truncated will trigger the tooltip interaction"),
-  tooltipPlacement: import_react_desc.PropTypes.oneOf([
-    import_ds_popper.PopperPositions.AUTO_START,
-    import_ds_popper.PopperPositions.AUTO_END,
-    import_ds_popper.PopperPositions.AUTO,
-    import_ds_popper.PopperPositions.TOP_START,
-    import_ds_popper.PopperPositions.TOP,
-    import_ds_popper.PopperPositions.TOP_END,
-    import_ds_popper.PopperPositions.RIGHT_START,
-    import_ds_popper.PopperPositions.RIGHT,
-    import_ds_popper.PopperPositions.RIGHT_END,
-    import_ds_popper.PopperPositions.BOTTOM_START,
-    import_ds_popper.PopperPositions.BOTTOM,
-    import_ds_popper.PopperPositions.BOTTOM_END,
-    import_ds_popper.PopperPositions.LEFT_START,
-    import_ds_popper.PopperPositions.LEFT,
-    import_ds_popper.PopperPositions.LEFT_END
-  ]).description("Position of the tooltip"),
-  tooltipDelay: import_react_desc.PropTypes.number.description("Delay to show the tooltip"),
-  zIndex: import_react_desc.PropTypes.number.description("override default zIndex").defaultValue(110)
+  containerProps: reactDesc.PropTypes.object.description('Set of Properties attached to the main container'),
+  value: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.number]).description('Text that when truncated will trigger the tooltip interaction'),
+  tooltipPlacement: reactDesc.PropTypes.oneOf([dsPopper.PopperPositions.AUTO_START, dsPopper.PopperPositions.AUTO_END, dsPopper.PopperPositions.AUTO, dsPopper.PopperPositions.TOP_START, dsPopper.PopperPositions.TOP, dsPopper.PopperPositions.TOP_END, dsPopper.PopperPositions.RIGHT_START, dsPopper.PopperPositions.RIGHT, dsPopper.PopperPositions.RIGHT_END, dsPopper.PopperPositions.BOTTOM_START, dsPopper.PopperPositions.BOTTOM, dsPopper.PopperPositions.BOTTOM_END, dsPopper.PopperPositions.LEFT_START, dsPopper.PopperPositions.LEFT, dsPopper.PopperPositions.LEFT_END]).description('Position of the tooltip'),
+  tooltipDelay: reactDesc.PropTypes.number.description('Delay to show the tooltip'),
+  zIndex: reactDesc.PropTypes.number.description('override default zIndex').defaultValue(110)
 };
 DSTruncatedTooltipText.defaultProps = {
   containerProps: {},
-  value: "",
-  tooltipPlacement: void 0,
-  tooltipDelay: void 0
+  value: '',
+  tooltipPlacement: undefined,
+  tooltipDelay: undefined
 };
-DSTruncatedTooltipText.propTypes = truncatedTooltipTextProps;
-const TruncatedTooltipTextWithSchema = (0, import_react_desc.describe)(DSTruncatedTooltipText);
+const TruncatedTooltipTextWithSchema = reactDesc.describe(DSTruncatedTooltipText);
 TruncatedTooltipTextWithSchema.propTypes = truncatedTooltipTextProps;
-var DSTruncatedTooltipText_default = DSTruncatedTooltipText;
-module.exports = __toCommonJS(DSTruncatedTooltipText_exports);
-//# sourceMappingURL=DSTruncatedTooltipText.js.map
+
+exports.DSTruncatedTooltipText = DSTruncatedTooltipText;
+exports.TruncatedTooltipTextWithSchema = TruncatedTooltipTextWithSchema;
+exports["default"] = DSTruncatedTooltipText;

package/cjs/SimpleTruncatedTooltipText.js

@@ -1,137 +1,148 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx2 = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var dsUtilities = require('@elliemae/ds-utilities');
+var styled = require('styled-components');
+var DSPopover = require('@elliemae/ds-popover');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx2__default = /*#__PURE__*/_interopDefaultLegacy(_jsx2);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+var DSPopover__default = /*#__PURE__*/_interopDefaultLegacy(DSPopover);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const dsTestId = 'DS-SimpleTruncateText';
+
+const isEllipsisActive = _ref => {
+  let {
+    offsetWidth,
+    scrollWidth
+  } = _ref;
+  return offsetWidth < scrollWidth;
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+
+const initialTooltipState = function () {
+  let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return {
+    reference: null,
+    visible: false,
+    value,
+    options
   };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var SimpleTruncatedTooltipText_exports = {};
-__export(SimpleTruncatedTooltipText_exports, {
-  SimpleTruncatedTooltipText: () => SimpleTruncatedTooltipText,
-  default: () => SimpleTruncatedTooltipText_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_utilities = __toESM(require("@elliemae/ds-utilities"));
-var import_prop_types = __toESM(require("prop-types"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_ds_popover = __toESM(require("@elliemae/ds-popover"));
-const dsTestId = "DS-SimpleTruncateText";
-const isEllipsisActive = ({ offsetWidth, scrollWidth }) => offsetWidth < scrollWidth;
-const initialTooltipState = (value = "", options = {}) => ({
-  reference: null,
-  visible: false,
-  value,
-  options
-});
-const Text = import_styled_components.default.span`
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-  display: inline-block;
-  max-width: 100%;
-`;
-const SimpleTruncatedTooltipText = (props) => {
-  const { containerProps, tooltipDelay, placement, value, zIndex, tooltipOptions, textOptions } = props;
-  const [tooltipState, setTooltipState] = (0, import_react.useState)(initialTooltipState(value, tooltipOptions));
-  const show = (0, import_react.useCallback)((newState) => {
-    setTooltipState({ ...tooltipState, ...newState, visible: true });
+}; // reduce the possibility of error showing the tooltip(text-overflow: ellipsis) https://jira.elliemae.io/browse/PUI-1755
+
+
+const Text = /*#__PURE__*/styled__default["default"].span.withConfig({
+  componentId: "sc-2f4vtq-0"
+})(["text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:100%;"]);
+
+const SimpleTruncatedTooltipText = props => {
+  const {
+    containerProps,
+    tooltipDelay,
+    placement,
+    value,
+    zIndex,
+    tooltipOptions,
+    textOptions
+  } = props; // not using "usePopoverProviderState" because usePopoverState has memory leak issues
+
+  const [tooltipState, setTooltipState] = React.useState(initialTooltipState(value, tooltipOptions));
+  const show = React.useCallback(newState => {
+    setTooltipState(_objectSpread(_objectSpread(_objectSpread({}, tooltipState), newState), {}, {
+      visible: true
+    }));
   }, [tooltipState]);
-  const hideTooltip = (0, import_react.useCallback)((newState) => {
-    setTooltipState({ ...tooltipState, ...newState, visible: false });
+  const hideTooltip = React.useCallback(newState => {
+    setTooltipState(_objectSpread(_objectSpread(_objectSpread({}, tooltipState), newState), {}, {
+      visible: false
+    }));
   }, [tooltipState]);
-  const [showTooltip, cancelShowTooltip] = (0, import_ds_utilities.useCancellableDelayedCallback)(show, tooltipDelay);
-  const handleMouseEnter = (0, import_react.useCallback)((e) => {
-    const { target } = e;
-    const SimpleTruncatedTextEl = target.closest(`[data-testid="${dsTestId}"]`);
+  const [showTooltip, cancelShowTooltip] = dsUtilities.useCancellableDelayedCallback(show, tooltipDelay);
+  const handleMouseEnter = React.useCallback(e => {
+    const {
+      target
+    } = e; // we search for the closest parent with data-testid matching this component
+    //  this is required because the target may not be this component itself
+    //  when the user gives JSX as a value.
+    //  JSX as a value is required for features like text highlight during research
+    //    wich would still allow the truncation behaviour (see tree view for example)
+    // when the target has the test-id itself target===SimpleTruncatedTextEl
+
+    const SimpleTruncatedTextEl = target.closest("[data-testid=\"".concat(dsTestId, "\"]"));
+
     if (SimpleTruncatedTextEl && isEllipsisActive(SimpleTruncatedTextEl)) {
-      showTooltip({ value, reference: SimpleTruncatedTextEl });
+      showTooltip({
+        value,
+        reference: SimpleTruncatedTextEl
+      });
     }
   }, [showTooltip, value]);
-  const handleMouseLeave = (0, import_react.useCallback)(() => {
+  const handleMouseLeave = React.useCallback(() => {
     cancelShowTooltip();
-    hideTooltip({ reference: null });
+    hideTooltip({
+      reference: null
+    });
   }, [hideTooltip, cancelShowTooltip]);
-  const handlers = (0, import_react.useMemo)(() => {
-    if (!showTooltip)
-      return {};
+  const handlers = React.useMemo(() => {
+    if (!showTooltip) return {};
     return {
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave
     };
   }, [showTooltip, handleMouseEnter, handleMouseLeave]);
-  const PurePopover = (0, import_react.useMemo)(() => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, tooltipState.visible ? /* @__PURE__ */ import_react.default.createElement(import_ds_popover.DSPopover, {
-    boundaries: "window",
-    style: { pointerEvents: "none", zIndex },
-    placement,
-    content: tooltipState.value,
-    referenceEl: tooltipState.reference,
-    visible: tooltipState.visible,
-    showArrow: true
-  }) : null), [tooltipState, placement, zIndex]);
-  const PureText = (0, import_react.useMemo)(() => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(Text, {
-    ...containerProps && { ...containerProps },
-    ...textOptions && { ...textOptions },
-    ...handlers && { ...handlers },
-    "data-testid": dsTestId
-  }, value)), [containerProps, textOptions, handlers, value]);
-  const PureSimpleTruncatedTooltipText = (0, import_react.useMemo)(() => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, PureText, PurePopover), [PureText, PurePopover]);
+  const PurePopover = React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: tooltipState.visible ? /*#__PURE__*/_jsx2__default["default"](DSPopover__default["default"], {
+      boundaries: "window",
+      style: {
+        pointerEvents: 'none',
+        zIndex
+      },
+      placement: placement,
+      content: tooltipState.value,
+      referenceEl: tooltipState.reference,
+      visible: tooltipState.visible,
+      showArrow: true
+    }) : null
+  }), [tooltipState, placement, zIndex]);
+  const PureText = React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: /*#__PURE__*/jsxRuntime.jsx(Text, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, containerProps && _objectSpread({}, containerProps)), textOptions && _objectSpread({}, textOptions)), handlers && _objectSpread({}, handlers)), {}, {
+      "data-testid": dsTestId // this is used by mouse enter too. required to support value as JSX
+      ,
+      children: value
+    }))
+  }), [containerProps, textOptions, handlers, value]);
+  const PureSimpleTruncatedTooltipText = React.useMemo(() => /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [PureText, PurePopover]
+  }), [PureText, PurePopover]);
   return PureSimpleTruncatedTooltipText;
 };
-SimpleTruncatedTooltipText.propTypes = {
-  containerProps: import_prop_types.default.object,
-  tooltipOptions: import_prop_types.default.object,
-  textOptions: import_prop_types.default.object,
-  value: import_prop_types.default.oneOfType([import_prop_types.default.string, import_prop_types.default.number, import_prop_types.default.node]),
-  placement: import_prop_types.default.oneOf([
-    import_ds_popover.PopperPositions.AUTO_START,
-    import_ds_popover.PopperPositions.AUTO_END,
-    import_ds_popover.PopperPositions.AUTO,
-    import_ds_popover.PopperPositions.TOP_START,
-    import_ds_popover.PopperPositions.TOP,
-    import_ds_popover.PopperPositions.TOP_END,
-    import_ds_popover.PopperPositions.RIGHT_START,
-    import_ds_popover.PopperPositions.RIGHT,
-    import_ds_popover.PopperPositions.RIGHT_END,
-    import_ds_popover.PopperPositions.BOTTOM_START,
-    import_ds_popover.PopperPositions.BOTTOM,
-    import_ds_popover.PopperPositions.BOTTOM_END,
-    import_ds_popover.PopperPositions.LEFT_START,
-    import_ds_popover.PopperPositions.LEFT,
-    import_ds_popover.PopperPositions.LEFT_END
-  ]),
-  tooltipDelay: import_prop_types.default.number,
-  zIndex: import_prop_types.default.number
-};
+
 SimpleTruncatedTooltipText.defaultProps = {
   containerProps: {},
   tooltipOptions: {},
   textOptions: {},
-  value: "",
-  placement: import_ds_popover.PopperPositions.TOP,
+  value: '',
+  placement: DSPopover.PopperPositions.TOP,
   tooltipDelay: 200,
   zIndex: 110
 };
-var SimpleTruncatedTooltipText_default = SimpleTruncatedTooltipText;
-module.exports = __toCommonJS(SimpleTruncatedTooltipText_exports);
-//# sourceMappingURL=SimpleTruncatedTooltipText.js.map
+
+exports.SimpleTruncatedTooltipText = SimpleTruncatedTooltipText;
+exports["default"] = SimpleTruncatedTooltipText;