@elliemae/ds-truncated-tooltip-text 2.2.0-next.3 → 2.3.0-alpha.1

package/cjs/DSTruncateTextWithTooltip.js

@@ -1,75 +1,86 @@
-'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 => {
+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 = 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) => {
     if (entries.length) {
       const [textWrapperEntry] = entries;
       const el = textWrapperEntry.target;
-      setIsShowingEllipsis((el === null || el === void 0 ? void 0 : el.scrollWidth) > (el === null || el === void 0 ? void 0 : el.clientWidth));
+      setIsShowingEllipsis(el?.scrollWidth > el?.clientWidth);
     }
   }), []);
-  React.useEffect(() => {
+  (0, import_react.useEffect)(() => {
     if (textWrapperEl) {
-      setIsShowingEllipsis((textWrapperEl === null || textWrapperEl === void 0 ? void 0 : textWrapperEl.scrollWidth) > (textWrapperEl === null || textWrapperEl === void 0 ? void 0 : textWrapperEl.clientWidth));
+      setIsShowingEllipsis(textWrapperEl?.scrollWidth > textWrapperEl?.clientWidth);
       resizeObserver.observe(textWrapperEl);
     }
-
     return () => {
       if (textWrapperEl) {
         resizeObserver.unobserve(textWrapperEl);
       }
     };
   }, [resizeObserver, textWrapperEl]);
-  if (isShowingEllipsis) return /*#__PURE__*/jsxRuntime.jsx(dsTooltip.DSTooltipV3, _objectSpread(_objectSpread({
-    text: text
-  }, tooltipProps), {}, {
-    children: /*#__PURE__*/jsxRuntime.jsx(Text, {
+  if (isShowingEllipsis)
+    return /* @__PURE__ */ import_react.default.createElement(import_ds_tooltip.DSTooltipV3, {
+      text,
+      ...tooltipProps
+    }, /* @__PURE__ */ import_react.default.createElement(Text, {
       ref: setTextWrapperEl,
       tabIndex: 0,
-      "data-testid": DSTruncateTextWithTooltipDatatestId,
-      children: text
-    })
-  }));
-  return /*#__PURE__*/jsxRuntime.jsx(Text, {
+      "data-testid": DSTruncateTextWithTooltipDatatestId
+    }, text));
+  return /* @__PURE__ */ import_react.default.createElement(Text, {
     ref: setTextWrapperEl,
-    "data-testid": DSTruncateTextWithTooltipDatatestId,
-    children: text
-  });
+    "data-testid": DSTruncateTextWithTooltipDatatestId
+  }, text);
 };
-
-exports.DSTruncateTextWithTooltip = DSTruncateTextWithTooltip;
-exports.DSTruncateTextWithTooltipDatatestId = DSTruncateTextWithTooltipDatatestId;
+module.exports = __toCommonJS(DSTruncateTextWithTooltip_exports);
+//# sourceMappingURL=DSTruncateTextWithTooltip.js.map

package/cjs/DSTruncateTextWithTooltip.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/DSTruncateTextWithTooltip.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useState, useMemo, useEffect, useRef } from 'react';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip';\nimport styled from 'styled-components';\n\n// reduce the possibility of error showing the tooltip(text-overflow: ellipsis) https://jira.elliemae.io/browse/PUI-1755\nconst Text = styled.span`\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n  display: inline-block;\n  max-width: 100%;\n  :focus {\n    border: none;\n    outline: none;\n    background: ${(props) => props.theme.colors.brand['200']};\n  }\n`;\ninterface PropsT {\n  text: string;\n  tooltipProps?: Record<string, unknown>;\n}\nexport const DSTruncateTextWithTooltipDatatestId = 'DS-TruncateTextWithTooltip';\nexport const DSTruncateTextWithTooltip = ({ text, tooltipProps = {} }: PropsT): JSX.Element => {\n  const [textWrapperEl, setTextWrapperEl] = useState<HTMLSpanElement>();\n  // const textWrapperEl = useRef<HTMLSpanElement>();\n  const [isShowingEllipsis, setIsShowingEllipsis] = useState(false);\n  // const isShowingEllipsis = textWrapperEl?.scrollWidth > textWrapperEl?.clientWidth;\n\n  const resizeObserver = useMemo(\n    () =>\n      new ResizeObserver((entries) => {\n        if (entries.length) {\n          const [textWrapperEntry] = entries;\n          const el = textWrapperEntry.target;\n          setIsShowingEllipsis(el?.scrollWidth > el?.clientWidth);\n        }\n      }),\n    [],\n  );\n  useEffect(() => {\n    if (textWrapperEl) {\n      setIsShowingEllipsis(textWrapperEl?.scrollWidth > textWrapperEl?.clientWidth);\n      resizeObserver.observe(textWrapperEl);\n    }\n    return () => {\n      if (textWrapperEl) {\n        resizeObserver.unobserve(textWrapperEl);\n      }\n    };\n  }, [resizeObserver, textWrapperEl]);\n\n  if (isShowingEllipsis)\n    return (\n      <DSTooltipV3 text={text} {...tooltipProps}>\n        <Text ref={setTextWrapperEl} tabIndex={0} data-testid={DSTruncateTextWithTooltipDatatestId}>\n          {text}\n        </Text>\n      </DSTooltipV3>\n    );\n\n  return (\n    <Text ref={setTextWrapperEl} data-testid={DSTruncateTextWithTooltipDatatestId}>\n      {text}\n    </Text>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA4D;AAC5D,wBAA4B;AAC5B,+BAAmB;AAGnB,MAAM,OAAO,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBASF,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAO/C,MAAM,sCAAsC;AAC5C,MAAM,4BAA4B,CAAC,EAAE,MAAM,eAAe,SAA8B;AAC7F,QAAM,CAAC,eAAe,oBAAoB;AAE1C,QAAM,CAAC,mBAAmB,wBAAwB,2BAAS;AAG3D,QAAM,iBAAiB,0BACrB,MACE,IAAI,eAAe,CAAC,YAAY;AAC9B,QAAI,QAAQ,QAAQ;AAClB,YAAM,CAAC,oBAAoB;AAC3B,YAAM,KAAK,iBAAiB;AAC5B,2BAAqB,IAAI,cAAc,IAAI;AAAA;AAAA,MAGjD;AAEF,8BAAU,MAAM;AACd,QAAI,eAAe;AACjB,2BAAqB,eAAe,cAAc,eAAe;AACjE,qBAAe,QAAQ;AAAA;AAEzB,WAAO,MAAM;AACX,UAAI,eAAe;AACjB,uBAAe,UAAU;AAAA;AAAA;AAAA,KAG5B,CAAC,gBAAgB;AAEpB,MAAI;AACF,WACE,mDAAC,+BAAD;AAAA,MAAa;AAAA,SAAgB;AAAA,OAC3B,mDAAC,MAAD;AAAA,MAAM,KAAK;AAAA,MAAkB,UAAU;AAAA,MAAG,eAAa;AAAA,OACpD;AAKT,SACE,mDAAC,MAAD;AAAA,IAAM,KAAK;AAAA,IAAkB,eAAa;AAAA,KACvC;AAAA;",
+  "names": []
+}

package/cjs/DSTruncatedTooltipText.js

@@ -1,69 +1,66 @@
-'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);
+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 = require("react-desc");
+var import_styled_components = __toESM(require("styled-components"));
+var import_ds_popper = require("@elliemae/ds-popper");
+var import_TooltipTextProvider = 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);
   }, [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,
@@ -71,42 +68,52 @@ const DSTruncatedTooltipText = _ref2 => {
       }, e);
     }
   };
-
-  const handleMouseLeave = e => {
-    hideTooltip({
-      reference: e.target
-    });
+  const handleMouseLeave = (e) => {
+    hideTooltip({ reference: e.target });
   };
-
-  const handlers = showTooltip ? {
-    onMouseEnter: handleMouseEnter,
-    onMouseLeave: handleMouseLeave
-  } : {};
-  return /*#__PURE__*/jsxRuntime.jsx(Text, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, containerProps), otherTextProps), handlers), {}, {
-    children: value
-  }));
+  const handlers = showTooltip ? { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave } : {};
+  return /* @__PURE__ */ import_react.default.createElement(Text, {
+    ...containerProps,
+    ...otherTextProps,
+    ...handlers
+  }, value);
 };
-
 DSTruncatedTooltipText.defaultProps = {
-  value: '',
+  value: "",
   zIndex: 110
 };
 const truncatedTooltipTextProps = {
-  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)
+  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)
 };
 DSTruncatedTooltipText.defaultProps = {
   containerProps: {},
-  value: '',
-  tooltipPlacement: undefined,
-  tooltipDelay: undefined
+  value: "",
+  tooltipPlacement: void 0,
+  tooltipDelay: void 0
 };
-const TruncatedTooltipTextWithSchema = reactDesc.describe(DSTruncatedTooltipText);
+DSTruncatedTooltipText.propTypes = truncatedTooltipTextProps;
+const TruncatedTooltipTextWithSchema = (0, import_react_desc.describe)(DSTruncatedTooltipText);
 TruncatedTooltipTextWithSchema.propTypes = truncatedTooltipTextProps;
-
-exports.DSTruncatedTooltipText = DSTruncatedTooltipText;
-exports.TruncatedTooltipTextWithSchema = TruncatedTooltipTextWithSchema;
-exports["default"] = DSTruncatedTooltipText;
+var DSTruncatedTooltipText_default = DSTruncatedTooltipText;
+module.exports = __toCommonJS(DSTruncatedTooltipText_exports);
+//# sourceMappingURL=DSTruncatedTooltipText.js.map

package/cjs/DSTruncatedTooltipText.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/DSTruncatedTooltipText.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useContext, useEffect } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport styled from 'styled-components';\nimport { PopperPositions as positions } from '@elliemae/ds-popper';\nimport { TruncatedTooltipContext } from './TooltipTextProvider';\n\nconst isEllipsisActive = ({ offsetWidth, scrollWidth }) =>\n  offsetWidth < scrollWidth;\n\n// reduce the possibility of error showing the tooltip (text-overflow: ellipsis) https://jira.elliemae.io/browse/PUI-1755\nconst Text = styled.span`\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n  display: inline-block;\n  max-width: 100%;\n`;\n\nconst DSTruncatedTooltipText = ({\n  containerProps = {},\n  value = '',\n  zIndex = 110, // https://jira.elliemae.io/browse/PUI-1755\n  ...otherTextProps\n}) => {\n  const tooltipContext = useContext(TruncatedTooltipContext);\n  useEffect(() => {\n    if (zIndex && tooltipContext) tooltipContext.setZIndex(zIndex);\n  }, [zIndex]);\n\n  if (!tooltipContext) return value;\n\n  const { showTooltip, hideTooltip } = tooltipContext;\n\n  const handleMouseEnter = (e) => {\n    const { target } = e;\n    if (target && isEllipsisActive(target, target.getBoundingClientRect())) {\n      showTooltip(\n        {\n          value,\n          reference: target,\n        },\n        e,\n      );\n    }\n  };\n\n  const handleMouseLeave = (e) => {\n    hideTooltip({ reference: e.target });\n  };\n\n  const handlers = showTooltip\n    ? { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }\n    : {};\n  return (\n    <Text {...containerProps} {...otherTextProps} {...handlers}>\n      {value}\n    </Text>\n  );\n};\n\nDSTruncatedTooltipText.defaultProps = {\n  value: '',\n  zIndex: 110,\n};\n\nconst truncatedTooltipTextProps = {\n  containerProps: PropTypes.object.description(\n    'Set of Properties attached to the main container',\n  ),\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n    'Text that when truncated will trigger the tooltip interaction',\n  ),\n  tooltipPlacement: PropTypes.oneOf([\n    positions.AUTO_START,\n    positions.AUTO_END,\n    positions.AUTO,\n    positions.TOP_START,\n    positions.TOP,\n    positions.TOP_END,\n    positions.RIGHT_START,\n    positions.RIGHT,\n    positions.RIGHT_END,\n    positions.BOTTOM_START,\n    positions.BOTTOM,\n    positions.BOTTOM_END,\n    positions.LEFT_START,\n    positions.LEFT,\n    positions.LEFT_END,\n  ]).description('Position of the tooltip'),\n  tooltipDelay: PropTypes.number.description('Delay to show the tooltip'),\n  zIndex: PropTypes.number\n    .description('override default zIndex')\n    .defaultValue(110),\n};\n\nDSTruncatedTooltipText.defaultProps = {\n  containerProps: {},\n  value: '',\n  tooltipPlacement: undefined,\n  tooltipDelay: undefined,\n};\n\nDSTruncatedTooltipText.propTypes = truncatedTooltipTextProps;\n\nconst TruncatedTooltipTextWithSchema = describe(DSTruncatedTooltipText);\nTruncatedTooltipTextWithSchema.propTypes = truncatedTooltipTextProps;\n\nexport { DSTruncatedTooltipText, TruncatedTooltipTextWithSchema };\nexport default DSTruncatedTooltipText;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,wBAAoC;AACpC,+BAAmB;AACnB,uBAA6C;AAC7C,iCAAwC;AAExC,MAAM,mBAAmB,CAAC,EAAE,aAAa,kBACvC,cAAc;AAGhB,MAAM,OAAO,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQpB,MAAM,yBAAyB,CAAC;AAAA,EAC9B,iBAAiB;AAAA,EACjB,QAAQ;AAAA,EACR,SAAS;AAAA,KACN;AAAA,MACC;AACJ,QAAM,iBAAiB,6BAAW;AAClC,8BAAU,MAAM;AACd,QAAI,UAAU;AAAgB,qBAAe,UAAU;AAAA,KACtD,CAAC;AAEJ,MAAI,CAAC;AAAgB,WAAO;AAE5B,QAAM,EAAE,aAAa,gBAAgB;AAErC,QAAM,mBAAmB,CAAC,MAAM;AAC9B,UAAM,EAAE,WAAW;AACnB,QAAI,UAAU,iBAAiB,QAAQ,OAAO,0BAA0B;AACtE,kBACE;AAAA,QACE;AAAA,QACA,WAAW;AAAA,SAEb;AAAA;AAAA;AAKN,QAAM,mBAAmB,CAAC,MAAM;AAC9B,gBAAY,EAAE,WAAW,EAAE;AAAA;AAG7B,QAAM,WAAW,cACb,EAAE,cAAc,kBAAkB,cAAc,qBAChD;AACJ,SACE,mDAAC,MAAD;AAAA,OAAU;AAAA,OAAoB;AAAA,OAAoB;AAAA,KAC/C;AAAA;AAKP,uBAAuB,eAAe;AAAA,EACpC,OAAO;AAAA,EACP,QAAQ;AAAA;AAGV,MAAM,4BAA4B;AAAA,EAChC,gBAAgB,4BAAU,OAAO,YAC/B;AAAA,EAEF,OAAO,4BAAU,UAAU,CAAC,4BAAU,QAAQ,4BAAU,SAAS,YAC/D;AAAA,EAEF,kBAAkB,4BAAU,MAAM;AAAA,IAChC,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,IACV,iCAAU;AAAA,KACT,YAAY;AAAA,EACf,cAAc,4BAAU,OAAO,YAAY;AAAA,EAC3C,QAAQ,4BAAU,OACf,YAAY,2BACZ,aAAa;AAAA;AAGlB,uBAAuB,eAAe;AAAA,EACpC,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP,kBAAkB;AAAA,EAClB,cAAc;AAAA;AAGhB,uBAAuB,YAAY;AAEnC,MAAM,iCAAiC,gCAAS;AAChD,+BAA+B,YAAY;AAG3C,IAAO,iCAAQ;",
+  "names": []
+}