@semcore/ellipsis 1.1.10 → 1.2.1

package/CHANGELOG.md

@@ -2,13 +2,19 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
-## [1.1.10] - 2023-02-09
+## [1.2.1] - 2023-02-16
 
-### Changed
+### Fixed
+
+- Ellipsis wasn't working when tooltip was disabled.
 
-- Version patch update due to children dependencies update (`@semcore/utils` [3.46.0 ~> 3.46.1], `@semcore/tooltip` [5.3.8 ~> 5.3.9]).
+## [1.2.0] - 2023-02-15
 
-## [1.1.9] - 2023-01-24
+### Added
+
+- Supported passing tooltip props.
+
+## [1.1.10] - 2023-02-09
 
 ### Fixed
 

package/lib/cjs/Ellipsis.js

@@ -39,10 +39,16 @@ var _reactToText = _interopRequireDefault(require("@semcore/utils/lib/reactToTex
 
 var _getOriginChildren = _interopRequireDefault(require("@semcore/utils/lib/getOriginChildren"));
 
+var _pick = _interopRequireDefault(require("@semcore/utils/lib/pick"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+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) { (0, _defineProperty2["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; }
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -52,19 +58,21 @@ var style = (
 /*__reshadow_css_start__*/
 _core.sstyled.insert(
 /*__inner_css_start__*/
-".___SContainer_9xuu4_gg_,.___SContainerMiddle_9xuu4_gg_{display:flex;overflow:hidden}.___SBeginning_9xuu4_gg_,.___SEllipsis_9xuu4_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_9xuu4_gg_.__maxLine_9xuu4_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_9xuu4);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_9xuu4_gg_{white-space:nowrap}"
+".___SContainerMiddle_5vwdw_gg_,.___SContainer_5vwdw_gg_,.___SNoTooltipContainer_5vwdw_gg_{display:flex;overflow:hidden}.___SBeginning_5vwdw_gg_,.___SEllipsis_5vwdw_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_5vwdw_gg_.__maxLine_5vwdw_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_5vwdw);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_5vwdw_gg_{white-space:nowrap}"
 /*__inner_css_end__*/
-, "9xuu4_gg_")
+, "5vwdw_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SContainer": "___SContainer_9xuu4_gg_",
-  "__SContainerMiddle": "___SContainerMiddle_9xuu4_gg_",
-  "__SBeginning": "___SBeginning_9xuu4_gg_",
-  "__SEllipsis": "___SEllipsis_9xuu4_gg_",
-  "_maxLine": "__maxLine_9xuu4_gg_",
-  "--maxLine": "--maxLine_9xuu4",
-  "__STail": "___STail_9xuu4_gg_"
+  "__SContainer": "___SContainer_5vwdw_gg_",
+  "__SNoTooltipContainer": "___SNoTooltipContainer_5vwdw_gg_",
+  "__SContainerMiddle": "___SContainerMiddle_5vwdw_gg_",
+  "__SBeginning": "___SBeginning_5vwdw_gg_",
+  "__SEllipsis": "___SEllipsis_5vwdw_gg_",
+  "_maxLine": "__maxLine_5vwdw_gg_",
+  "--maxLine": "--maxLine_5vwdw",
+  "__STail": "___STail_5vwdw_gg_"
 });
+var defaultTooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
 
 var createMeasurerElement = function createMeasurerElement(element) {
   var styleElement = window.getComputedStyle(element, null);
@@ -148,6 +156,7 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
 
       var SEllipsis = this.Root;
       var SContainer = _tooltip["default"];
+      var SNoTooltipContainer = _flexBox.Box;
       var _this$asProps = this.asProps,
           styles = _this$asProps.styles,
           Children = _this$asProps.Children,
@@ -155,9 +164,11 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
           tooltip = _this$asProps.tooltip,
           trim = _this$asProps.trim,
           containerRect = _this$asProps.containerRect,
-          containerRef = _this$asProps.containerRef;
+          containerRef = _this$asProps.containerRef,
+          includeTooltipProps = _this$asProps.includeTooltipProps;
       var visible = this.state.visible;
       var text = (0, _reactToText["default"])((0, _getOriginChildren["default"])(Children));
+      var tooltipProps = (0, _pick["default"])(this.asProps, includeTooltipProps);
 
       if (trim === 'middle') {
         var _ref;
@@ -167,29 +178,31 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
           "styles": styles,
           "tooltip": tooltip,
           "containerRect": containerRect,
-          "containerRef": containerRef
+          "containerRef": containerRef,
+          "tooltipProps": tooltipProps
         }));
       }
 
       if (tooltip) {
         var _ref2;
 
-        return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainer, _ref2.cn("SContainer", {
-          "interaction": 'hover',
+        return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainer, _ref2.cn("SContainer", _objectSpread({
+          "interaction": "hover",
           "title": text,
           "visible": visible,
           "onVisibleChange": this.handlerVisibleChange
-        }), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref2.cn("SEllipsis", {
+        }, tooltipProps)), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref2.cn("SEllipsis", {
           "render": _flexBox.Box,
           "ref": this.textRef,
           "maxLine": maxLine
         }), /*#__PURE__*/_react["default"].createElement(Children, _ref2.cn("Children", {}))));
       }
 
-      return _ref3 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref3.cn("SEllipsis", {
+      return _ref3 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SNoTooltipContainer, _ref3.cn("SNoTooltipContainer", {}), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref3.cn("SEllipsis", {
         "render": _flexBox.Box,
+        "ref": this.textRef,
         "maxLine": maxLine
-      }), /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {})));
+      }), /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {}))));
     }
   }]);
   return RootEllipsis;
@@ -199,7 +212,8 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
 (0, _defineProperty2["default"])(RootEllipsis, "style", style);
 (0, _defineProperty2["default"])(RootEllipsis, "defaultProps", {
   trim: 'end',
-  tooltip: true
+  tooltip: true,
+  includeTooltipProps: defaultTooltipProps
 });
 
 var EllipsisMiddle = function EllipsisMiddle(props) {
@@ -207,7 +221,8 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
       text = props.text,
       tooltip = props.tooltip,
       containerRect = props.containerRect,
-      containerRef = props.containerRef;
+      containerRef = props.containerRef,
+      tooltipProps = props.tooltipProps;
   var resizeElement = (0, _react.useRef)(null);
 
   var _useState = (0, _react.useState)({
@@ -244,12 +259,12 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
   if (tooltip) {
     var _ref4;
 
-    return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", {
+    return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", _objectSpread({
       "interaction": text.length > displayedSymbols ? 'hover' : 'none',
       "title": text,
       "ref": containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement,
       "tag": _tooltip["default"]
-    }), /*#__PURE__*/_react["default"].createElement(SBeginning, _ref4.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/_react["default"].createElement(STail, _ref4.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
+    }, tooltipProps)), /*#__PURE__*/_react["default"].createElement(SBeginning, _ref4.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/_react["default"].createElement(STail, _ref4.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
   } else {
     var _ref5;
 

package/lib/cjs/Ellipsis.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ellipsis.js","names":["createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","style","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","whiteSpace","removeChild","RootEllipsis","visible","React","createRef","setState","showTooltip","asProps","maxLine","textRef","current","SEllipsis","Root","SContainer","Tooltip","styles","Children","tooltip","trim","containerRect","containerRef","state","text","reactToText","getOriginChildren","sstyled","handlerVisibleChange","Box","Component","EllipsisMiddle","props","resizeElement","useRef","useState","symbolWidth","dimension","setDimension","blockWidth","useResizeObserver","useLayoutEffect","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","displayedSymbols","useMemo","Math","round","length","substring","Ellipsis","createComponent"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState, useLayoutEffect } from 'react';\nimport createComponent, { Component, sstyled } from '@semcore/core';\nimport Tooltip from '@semcore/tooltip';\nimport { Box } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\n\nimport style from './style/ellipsis.shadow.css';\nimport reactToText from '@semcore/utils/lib/reactToText';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\n\ntype AsProps = {\n  maxLine?: number;\n  trim?: 'end' | 'middle';\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n};\n\ntype AsPropsMiddle = {\n  text: string;\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n};\n\nconst createMeasurerElement = (element: HTMLElement) => {\n  const styleElement = window.getComputedStyle(element, null);\n  const temporaryElement = document.createElement('temporary-block');\n  temporaryElement.style.display = 'inline-block';\n  temporaryElement.style.padding = '0';\n  temporaryElement.style.position = 'absolute';\n  temporaryElement.style.right = '150%';\n  temporaryElement.style.bottom = '150%';\n  temporaryElement.style.visibility = 'hidden';\n  temporaryElement.style.fontFamily = styleElement.getPropertyValue('font-family');\n  temporaryElement.style.fontSize = styleElement.getPropertyValue('font-size');\n  temporaryElement.style.fontWeight = styleElement.getPropertyValue('font-weight');\n\n  temporaryElement.innerHTML = element.innerHTML;\n  return temporaryElement;\n};\n\nfunction isTextOverflowing(element: HTMLElement | null, multiline: boolean): boolean {\n  if (!element) return false;\n\n  const { height: currentHeight, width: currentWidth } = element.getBoundingClientRect();\n  const measuringElement = createMeasurerElement(element);\n  let currentSize, initialSize;\n  document.body.appendChild(measuringElement);\n  if (multiline) {\n    currentSize = currentHeight;\n    measuringElement.style.width = `${currentWidth}px`;\n    initialSize = measuringElement.getBoundingClientRect().height;\n  } else {\n    currentSize = currentWidth;\n    measuringElement.style.whiteSpace = 'nowrap';\n    initialSize = measuringElement.getBoundingClientRect().width;\n  }\n  document.body.removeChild(measuringElement);\n  return currentSize < initialSize;\n}\n\n\nclass RootEllipsis extends Component<AsProps> {\n  static displayName = 'Ellipsis';\n  static style = style;\n  static defaultProps: AsProps = {\n    trim: 'end',\n    tooltip: true,\n  };\n\n  state = {\n    visible: false,\n  };\n\n  textRef = React.createRef<HTMLElement>();\n\n  showTooltip() {\n    const { maxLine = 1 } = this.asProps;\n    return isTextOverflowing(this.textRef.current, maxLine > 1)\n  };\n\n  handlerVisibleChange = (visible: boolean) => {\n    this.setState({ visible: visible && this.showTooltip() });\n  };\n\n  render() {\n    const SEllipsis = this.Root;\n    const SContainer = Tooltip;\n    const { styles, Children, maxLine, tooltip, trim, containerRect, containerRef } = this.asProps;\n    const { visible } = this.state;\n    const text = reactToText(getOriginChildren(Children));\n\n    if (trim === 'middle') {\n      return sstyled(styles)(\n        <EllipsisMiddle\n          text={text}\n          styles={styles}\n          tooltip={tooltip}\n          containerRect={containerRect}\n          containerRef={containerRef}\n        />,\n      );\n    }\n    if (tooltip) {\n      return sstyled(styles)(\n        <SContainer interaction='hover' title={text} visible={visible} onVisibleChange={this.handlerVisibleChange}>\n          <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n            <Children />\n          </SEllipsis>\n        </SContainer>,\n      );\n    }\n    return sstyled(styles)(\n      <SEllipsis render={Box} maxLine={maxLine}>\n        <Children />\n      </SEllipsis>,\n    );\n  }\n}\n\nconst EllipsisMiddle: React.FC<AsPropsMiddle> = (props) => {\n  const { styles, text, tooltip, containerRect, containerRef } = props;\n  const resizeElement = useRef<HTMLElement | null>(null);\n  const [dimension, setDimension] = useState<{ fontSize: string; symbolWidth: number }>({\n    fontSize: '14',\n    symbolWidth: 0,\n  });\n  const blockWidth = useResizeObserver(resizeElement, containerRect).width;\n\n  useLayoutEffect(() => {\n    const dateSpan = document.createElement('temporary-block');\n    dateSpan.setAttribute('style', `fontSize: ${dimension.fontSize}px`);\n    dateSpan.innerHTML = 'a';\n    document.body.appendChild(dateSpan);\n    const rect = dateSpan.getBoundingClientRect();\n\n    setDimension({\n      fontSize: window\n        // @ts-ignore\n        .getComputedStyle(containerRef?.current ?? resizeElement.current, null)\n        .getPropertyValue('font-size'),\n      symbolWidth: rect.width,\n    });\n    document.body.removeChild(dateSpan);\n  }, []);\n\n  const STail = 'span';\n  const SBeginning = 'span';\n  const SContainerMiddle = Box;\n  const displayedSymbols = useMemo(\n    () => Math.round(blockWidth / dimension.symbolWidth),\n    [blockWidth, dimension.symbolWidth],\n  );\n\n  if (tooltip) {\n    return sstyled(styles)(\n      <SContainerMiddle\n        interaction={text.length > displayedSymbols ? 'hover' : 'none'}\n        title={text}\n        ref={containerRef ?? resizeElement}\n        tag={Tooltip}\n      >\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  } else {\n    return sstyled(styles)(\n      <SContainerMiddle ref={containerRef ?? resizeElement}>\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  }\n};\n\nconst Ellipsis = createComponent(RootEllipsis);\n\nexport default Ellipsis;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;AACA;;AAGA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAwB,CAACC,OAAD,EAA0B;EACtD,IAAMC,YAAY,GAAGC,MAAM,CAACC,gBAAP,CAAwBH,OAAxB,EAAiC,IAAjC,CAArB;EACA,IAAMI,gBAAgB,GAAGC,QAAQ,CAACC,aAAT,CAAuB,iBAAvB,CAAzB;EACAF,gBAAgB,CAACG,KAAjB,CAAuBC,OAAvB,GAAiC,cAAjC;EACAJ,gBAAgB,CAACG,KAAjB,CAAuBE,OAAvB,GAAiC,GAAjC;EACAL,gBAAgB,CAACG,KAAjB,CAAuBG,QAAvB,GAAkC,UAAlC;EACAN,gBAAgB,CAACG,KAAjB,CAAuBI,KAAvB,GAA+B,MAA/B;EACAP,gBAAgB,CAACG,KAAjB,CAAuBK,MAAvB,GAAgC,MAAhC;EACAR,gBAAgB,CAACG,KAAjB,CAAuBM,UAAvB,GAAoC,QAApC;EACAT,gBAAgB,CAACG,KAAjB,CAAuBO,UAAvB,GAAoCb,YAAY,CAACc,gBAAb,CAA8B,aAA9B,CAApC;EACAX,gBAAgB,CAACG,KAAjB,CAAuBS,QAAvB,GAAkCf,YAAY,CAACc,gBAAb,CAA8B,WAA9B,CAAlC;EACAX,gBAAgB,CAACG,KAAjB,CAAuBU,UAAvB,GAAoChB,YAAY,CAACc,gBAAb,CAA8B,aAA9B,CAApC;EAEAX,gBAAgB,CAACc,SAAjB,GAA6BlB,OAAO,CAACkB,SAArC;EACA,OAAOd,gBAAP;AACD,CAfD;;AAiBA,SAASe,iBAAT,CAA2BnB,OAA3B,EAAwDoB,SAAxD,EAAqF;EACnF,IAAI,CAACpB,OAAL,EAAc,OAAO,KAAP;;EAEd,4BAAuDA,OAAO,CAACqB,qBAAR,EAAvD;EAAA,IAAgBC,aAAhB,yBAAQC,MAAR;EAAA,IAAsCC,YAAtC,yBAA+BC,KAA/B;;EACA,IAAMC,gBAAgB,GAAG3B,qBAAqB,CAACC,OAAD,CAA9C;EACA,IAAI2B,WAAJ,EAAiBC,WAAjB;EACAvB,QAAQ,CAACwB,IAAT,CAAcC,WAAd,CAA0BJ,gBAA1B;;EACA,IAAIN,SAAJ,EAAe;IACbO,WAAW,GAAGL,aAAd;IACAI,gBAAgB,CAACnB,KAAjB,CAAuBkB,KAAvB,aAAkCD,YAAlC;IACAI,WAAW,GAAGF,gBAAgB,CAACL,qBAAjB,GAAyCE,MAAvD;EACD,CAJD,MAIO;IACLI,WAAW,GAAGH,YAAd;IACAE,gBAAgB,CAACnB,KAAjB,CAAuBwB,UAAvB,GAAoC,QAApC;IACAH,WAAW,GAAGF,gBAAgB,CAACL,qBAAjB,GAAyCI,KAAvD;EACD;;EACDpB,QAAQ,CAACwB,IAAT,CAAcG,WAAd,CAA0BN,gBAA1B;EACA,OAAOC,WAAW,GAAGC,WAArB;AACD;;IAGKK,Y;;;;;;;;;;;;;;;8FAQI;MACNC,OAAO,EAAE;IADH,C;6GAIEC,iBAAA,CAAMC,SAAN,E;6GAOa,UAACF,OAAD,EAAsB;MAC3C,MAAKG,QAAL,CAAc;QAAEH,OAAO,EAAEA,OAAO,IAAI,MAAKI,WAAL;MAAtB,CAAd;IACD,C;;;;;;WAPD,uBAAc;MACZ,4BAAwB,KAAKC,OAA7B,CAAQC,OAAR;MAAA,IAAQA,OAAR,sCAAkB,CAAlB;MACA,OAAOrB,iBAAiB,CAAC,KAAKsB,OAAL,CAAaC,OAAd,EAAuBF,OAAO,GAAG,CAAjC,CAAxB;IACD;;;WAMD,kBAAS;MAAA;;MACP,IAAMG,SAAS,GAAG,KAAKC,IAAvB;MACA,IAAMC,UAAU,GAAGC,mBAAnB;MACA,oBAAkF,KAAKP,OAAvF;MAAA,IAAQQ,MAAR,iBAAQA,MAAR;MAAA,IAAgBC,QAAhB,iBAAgBA,QAAhB;MAAA,IAA0BR,OAA1B,iBAA0BA,OAA1B;MAAA,IAAmCS,OAAnC,iBAAmCA,OAAnC;MAAA,IAA4CC,IAA5C,iBAA4CA,IAA5C;MAAA,IAAkDC,aAAlD,iBAAkDA,aAAlD;MAAA,IAAiEC,YAAjE,iBAAiEA,YAAjE;MACA,IAAQlB,OAAR,GAAoB,KAAKmB,KAAzB,CAAQnB,OAAR;MACA,IAAMoB,IAAI,GAAG,IAAAC,uBAAA,EAAY,IAAAC,6BAAA,EAAkBR,QAAlB,CAAZ,CAAb;;MAEA,IAAIE,IAAI,KAAK,QAAb,EAAuB;QAAA;;QACrB,cAAO,IAAAO,aAAA,EAAQV,MAAR,CAAP,eACE,gCAAC,cAAD;UAAA,QACQO,IADR;UAAA,UAEUP,MAFV;UAAA,WAGWE,OAHX;UAAA,iBAIiBE,aAJjB;UAAA,gBAKgBC;QALhB,GADF;MASD;;MACD,IAAIH,OAAJ,EAAa;QAAA;;QACX,eAAO,IAAAQ,aAAA,EAAQV,MAAR,CAAP,eACE,gCAAC,UAAD;UAAA,eAAwB,OAAxB;UAAA,SAAuCO,IAAvC;UAAA,WAAsDpB,OAAtD;UAAA,mBAAgF,KAAKwB;QAArF,iBACE,gCAAC,SAAD;UAAA,UAAmBC,YAAnB;UAAA,OAA6B,KAAKlB,OAAlC;UAAA,WAAoDD;QAApD,iBACE,gCAAC,QAAD,2BADF,CADF,CADF;MAOD;;MACD,eAAO,IAAAiB,aAAA,EAAQV,MAAR,CAAP,eACE,gCAAC,SAAD;QAAA,UAAmBY,YAAnB;QAAA,WAAiCnB;MAAjC,iBACE,gCAAC,QAAD,2BADF,CADF;IAKD;;;EAvDwBoB,e;;iCAArB3B,Y,iBACiB,U;iCADjBA,Y,WAEW1B,K;iCAFX0B,Y,kBAG2B;EAC7BiB,IAAI,EAAE,KADuB;EAE7BD,OAAO,EAAE;AAFoB,C;;AAuDjC,IAAMY,cAAuC,GAAG,SAA1CA,cAA0C,CAACC,KAAD,EAAW;EACzD,IAAQf,MAAR,GAA+De,KAA/D,CAAQf,MAAR;EAAA,IAAgBO,IAAhB,GAA+DQ,KAA/D,CAAgBR,IAAhB;EAAA,IAAsBL,OAAtB,GAA+Da,KAA/D,CAAsBb,OAAtB;EAAA,IAA+BE,aAA/B,GAA+DW,KAA/D,CAA+BX,aAA/B;EAAA,IAA8CC,YAA9C,GAA+DU,KAA/D,CAA8CV,YAA9C;EACA,IAAMW,aAAa,GAAG,IAAAC,aAAA,EAA2B,IAA3B,CAAtB;;EACA,gBAAkC,IAAAC,eAAA,EAAoD;IACpFjD,QAAQ,EAAE,IAD0E;IAEpFkD,WAAW,EAAE;EAFuE,CAApD,CAAlC;EAAA;EAAA,IAAOC,SAAP;EAAA,IAAkBC,YAAlB;;EAIA,IAAMC,UAAU,GAAG,IAAAC,oCAAA,EAAkBP,aAAlB,EAAiCZ,aAAjC,EAAgD1B,KAAnE;EAEA,IAAA8C,sBAAA,EAAgB,YAAM;IAAA;;IACpB,IAAMC,QAAQ,GAAGnE,QAAQ,CAACC,aAAT,CAAuB,iBAAvB,CAAjB;IACAkE,QAAQ,CAACC,YAAT,CAAsB,OAAtB,sBAA4CN,SAAS,CAACnD,QAAtD;IACAwD,QAAQ,CAACtD,SAAT,GAAqB,GAArB;IACAb,QAAQ,CAACwB,IAAT,CAAcC,WAAd,CAA0B0C,QAA1B;IACA,IAAME,IAAI,GAAGF,QAAQ,CAACnD,qBAAT,EAAb;IAEA+C,YAAY,CAAC;MACXpD,QAAQ,EAAEd,MAAM,CACd;MADc,CAEbC,gBAFO,0BAEUiD,YAFV,aAEUA,YAFV,uBAEUA,YAAY,CAAEV,OAFxB,yEAEmCqB,aAAa,CAACrB,OAFjD,EAE0D,IAF1D,EAGP3B,gBAHO,CAGU,WAHV,CADC;MAKXmD,WAAW,EAAEQ,IAAI,CAACjD;IALP,CAAD,CAAZ;IAOApB,QAAQ,CAACwB,IAAT,CAAcG,WAAd,CAA0BwC,QAA1B;EACD,CAfD,EAeG,EAfH;EAiBA,IAAMG,KAAK,GAAG,MAAd;EACA,IAAMC,UAAU,GAAG,MAAnB;EACA,IAAMC,gBAAgB,GAAGlB,YAAzB;EACA,IAAMmB,gBAAgB,GAAG,IAAAC,cAAA,EACvB;IAAA,OAAMC,IAAI,CAACC,KAAL,CAAWZ,UAAU,GAAGF,SAAS,CAACD,WAAlC,CAAN;EAAA,CADuB,EAEvB,CAACG,UAAD,EAAaF,SAAS,CAACD,WAAvB,CAFuB,CAAzB;;EAKA,IAAIjB,OAAJ,EAAa;IAAA;;IACX,eAAO,IAAAQ,aAAA,EAAQV,MAAR,CAAP,eACE,gCAAC,gBAAD;MAAA,eACeO,IAAI,CAAC4B,MAAL,GAAcJ,gBAAd,GAAiC,OAAjC,GAA2C,MAD1D;MAAA,SAESxB,IAFT;MAAA,OAGOF,YAHP,aAGOA,YAHP,cAGOA,YAHP,GAGuBW,aAHvB;MAAA,OAIOjB;IAJP,iBAME,gCAAC,UAAD,8BAAaQ,IAAI,CAAC6B,SAAL,CAAe,CAAf,EAAkB7B,IAAI,CAAC4B,MAAL,GAAcJ,gBAAgB,GAAG,CAAjC,GAAqC,CAAvD,CAAb,CANF,eAOE,gCAAC,KAAD,yBAAQxB,IAAI,CAAC6B,SAAL,CAAe7B,IAAI,CAAC4B,MAAL,GAAcJ,gBAAgB,GAAG,CAAjC,GAAqC,CAApD,CAAR,CAPF,CADF;EAWD,CAZD,MAYO;IAAA;;IACL,eAAO,IAAArB,aAAA,EAAQV,MAAR,CAAP,eACE,gCAAC,gBAAD;MAAA,OAAuBK,YAAvB,aAAuBA,YAAvB,cAAuBA,YAAvB,GAAuCW;IAAvC,iBACE,gCAAC,UAAD,8BAAaT,IAAI,CAAC6B,SAAL,CAAe,CAAf,EAAkB7B,IAAI,CAAC4B,MAAL,GAAcJ,gBAAgB,GAAG,CAAjC,GAAqC,CAAvD,CAAb,CADF,eAEE,gCAAC,KAAD,yBAAQxB,IAAI,CAAC6B,SAAL,CAAe7B,IAAI,CAAC4B,MAAL,GAAcJ,gBAAgB,GAAG,CAAjC,GAAqC,CAApD,CAAR,CAFF,CADF;EAMD;AACF,CAtDD;;AAwDA,IAAMM,QAAQ,GAAG,IAAAC,gBAAA,EAAgBpD,YAAhB,CAAjB;eAEemD,Q"}
+{"version":3,"file":"Ellipsis.js","names":["defaultTooltipProps","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","style","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","whiteSpace","removeChild","RootEllipsis","visible","React","createRef","setState","showTooltip","asProps","maxLine","textRef","current","SEllipsis","Root","SContainer","Tooltip","SNoTooltipContainer","Box","styles","Children","tooltip","trim","containerRect","containerRef","includeTooltipProps","state","text","reactToText","getOriginChildren","tooltipProps","pick","sstyled","handlerVisibleChange","Component","EllipsisMiddle","props","resizeElement","useRef","useState","symbolWidth","dimension","setDimension","blockWidth","useResizeObserver","useLayoutEffect","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","displayedSymbols","useMemo","Math","round","length","substring","Ellipsis","createComponent"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState, useLayoutEffect } from 'react';\nimport createComponent, { Component, sstyled } from '@semcore/core';\nimport Tooltip from '@semcore/tooltip';\nimport { Box } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\n\nimport style from './style/ellipsis.shadow.css';\nimport reactToText from '@semcore/utils/lib/reactToText';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\nimport pick from '@semcore/utils/lib/pick';\n\ntype AsProps = {\n  maxLine?: number;\n  trim?: 'end' | 'middle';\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  includeTooltipProps?: string[];\n};\n\ntype AsPropsMiddle = {\n  text: string;\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  tooltipProps: { [propName: string]: unknown };\n};\n\nconst defaultTooltipProps = [\n  'title',\n  'theme',\n  'strategy',\n  'modifiers',\n  'placement',\n  'interaction',\n  'timeout',\n  'visible',\n  'defaultVisible',\n  'onVisibleChange',\n  'offset',\n  'preventOverflow',\n  'arrow',\n  'flip',\n  'computeStyles',\n  'eventListeners',\n  'onFirstUpdate',\n];\n\nconst createMeasurerElement = (element: HTMLElement) => {\n  const styleElement = window.getComputedStyle(element, null);\n  const temporaryElement = document.createElement('temporary-block');\n  temporaryElement.style.display = 'inline-block';\n  temporaryElement.style.padding = '0';\n  temporaryElement.style.position = 'absolute';\n  temporaryElement.style.right = '150%';\n  temporaryElement.style.bottom = '150%';\n  temporaryElement.style.visibility = 'hidden';\n  temporaryElement.style.fontFamily = styleElement.getPropertyValue('font-family');\n  temporaryElement.style.fontSize = styleElement.getPropertyValue('font-size');\n  temporaryElement.style.fontWeight = styleElement.getPropertyValue('font-weight');\n\n  temporaryElement.innerHTML = element.innerHTML;\n  return temporaryElement;\n};\n\nfunction isTextOverflowing(element: HTMLElement | null, multiline: boolean): boolean {\n  if (!element) return false;\n\n  const { height: currentHeight, width: currentWidth } = element.getBoundingClientRect();\n  const measuringElement = createMeasurerElement(element);\n  let currentSize, initialSize;\n  document.body.appendChild(measuringElement);\n  if (multiline) {\n    currentSize = currentHeight;\n    measuringElement.style.width = `${currentWidth}px`;\n    initialSize = measuringElement.getBoundingClientRect().height;\n  } else {\n    currentSize = currentWidth;\n    measuringElement.style.whiteSpace = 'nowrap';\n    initialSize = measuringElement.getBoundingClientRect().width;\n  }\n  document.body.removeChild(measuringElement);\n  return currentSize < initialSize;\n}\n\nclass RootEllipsis extends Component<AsProps> {\n  static displayName = 'Ellipsis';\n  static style = style;\n  static defaultProps: AsProps = {\n    trim: 'end',\n    tooltip: true,\n    includeTooltipProps: defaultTooltipProps,\n  };\n\n  state = {\n    visible: false,\n  };\n\n  textRef = React.createRef<HTMLElement>();\n\n  showTooltip() {\n    const { maxLine = 1 } = this.asProps;\n    return isTextOverflowing(this.textRef.current, maxLine > 1);\n  }\n\n  handlerVisibleChange = (visible: boolean) => {\n    this.setState({ visible: visible && this.showTooltip() });\n  };\n\n  render() {\n    const SEllipsis = this.Root;\n    const SContainer = Tooltip;\n    const SNoTooltipContainer = Box;\n    const {\n      styles,\n      Children,\n      maxLine,\n      tooltip,\n      trim,\n      containerRect,\n      containerRef,\n      includeTooltipProps,\n    } = this.asProps;\n    const { visible } = this.state;\n    const text = reactToText(getOriginChildren(Children));\n    const tooltipProps = pick(this.asProps, includeTooltipProps);\n\n    if (trim === 'middle') {\n      return sstyled(styles)(\n        <EllipsisMiddle\n          text={text}\n          styles={styles}\n          tooltip={tooltip}\n          containerRect={containerRect}\n          containerRef={containerRef}\n          tooltipProps={tooltipProps}\n        />,\n      );\n    }\n    if (tooltip) {\n      return sstyled(styles)(\n        <SContainer\n          interaction=\"hover\"\n          title={text}\n          visible={visible}\n          onVisibleChange={this.handlerVisibleChange}\n          {...tooltipProps}\n        >\n          <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n            <Children />\n          </SEllipsis>\n        </SContainer>,\n      );\n    }\n    return sstyled(styles)(\n      <SNoTooltipContainer>\n        <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n          <Children />\n        </SEllipsis>\n      </SNoTooltipContainer>,\n    );\n  }\n}\n\nconst EllipsisMiddle: React.FC<AsPropsMiddle> = (props) => {\n  const { styles, text, tooltip, containerRect, containerRef, tooltipProps } = props;\n  const resizeElement = useRef<HTMLElement | null>(null);\n  const [dimension, setDimension] = useState<{ fontSize: string; symbolWidth: number }>({\n    fontSize: '14',\n    symbolWidth: 0,\n  });\n  const blockWidth = useResizeObserver(resizeElement, containerRect).width;\n\n  useLayoutEffect(() => {\n    const dateSpan = document.createElement('temporary-block');\n    dateSpan.setAttribute('style', `fontSize: ${dimension.fontSize}px`);\n    dateSpan.innerHTML = 'a';\n    document.body.appendChild(dateSpan);\n    const rect = dateSpan.getBoundingClientRect();\n\n    setDimension({\n      fontSize: window\n        // @ts-ignore\n        .getComputedStyle(containerRef?.current ?? resizeElement.current, null)\n        .getPropertyValue('font-size'),\n      symbolWidth: rect.width,\n    });\n    document.body.removeChild(dateSpan);\n  }, []);\n\n  const STail = 'span';\n  const SBeginning = 'span';\n  const SContainerMiddle = Box;\n  const displayedSymbols = useMemo(\n    () => Math.round(blockWidth / dimension.symbolWidth),\n    [blockWidth, dimension.symbolWidth],\n  );\n\n  if (tooltip) {\n    return sstyled(styles)(\n      <SContainerMiddle\n        interaction={text.length > displayedSymbols ? 'hover' : 'none'}\n        title={text}\n        ref={containerRef ?? resizeElement}\n        tag={Tooltip}\n        {...tooltipProps}\n      >\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  } else {\n    return sstyled(styles)(\n      <SContainerMiddle ref={containerRef ?? resizeElement}>\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  }\n};\n\nconst Ellipsis = createComponent(RootEllipsis);\n\nexport default Ellipsis;\n"],"mappings":"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"}

package/lib/cjs/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { CProps } from '@semcore/core';\nimport { RefObject } from 'react';\n\nexport interface IEllipsisProps {\n  /**\n   * Rows count in multiline Ellipsis\n   * @default 1\n   */\n  maxLine?: number;\n  /**\n   * Trimming type\n   * @default end\n   */\n  trim?: 'end' | 'middle';\n  /**\n   * Show tooltip\n   * @default true\n   */\n  tooltip?: boolean;\n  /**\n   * Ref to the item that will be observed by ResizeObserver\n   */\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  /**\n   * Explicit sizes of container text should be trimmed in\n   **/\n  containerRect?: { width: number };\n}\n\ndeclare const useResizeObserver: (\n  ref: RefObject<HTMLElement>,\n  hookOverride?: { width: number },\n) => { width: number };\n\ndeclare const Ellipsis: <T>(props: CProps<IEllipsisProps & T>) => ReturnEl;\n\nexport { useResizeObserver };\nexport default Ellipsis;\n"],"mappings":""}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { CProps, ReturnEl } from '@semcore/core';\nimport { RefObject } from 'react';\nimport { IBoxProps } from '@semcore/flex-box';\nimport { ITooltipProps } from '@semcore/tooltip';\n\nexport interface IEllipsisProps extends IBoxProps, ITooltipProps {\n  /**\n   * Rows count in multiline Ellipsis\n   * @default 1\n   */\n  maxLine?: number;\n  /**\n   * Trimming type\n   * @default end\n   */\n  trim?: 'end' | 'middle';\n  /**\n   * Show tooltip\n   * @default true\n   */\n  tooltip?: boolean;\n  /**\n   * Ref to the item that will be observed by ResizeObserver\n   */\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  /**\n   * Explicit sizes of container text should be trimmed in\n   **/\n  containerRect?: { width: number };\n  /** List of props that will be passed to tooltip\n   * @default ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate']\n   */\n  includeTooltipProps?: string[];\n}\n\ndeclare const useResizeObserver: (\n  ref: RefObject<HTMLElement>,\n  hookOverride?: { width: number },\n) => { width: number };\n\ndeclare const Ellipsis: <T>(props: CProps<IEllipsisProps & T>) => ReturnEl;\n\nexport { useResizeObserver };\nexport default Ellipsis;\n"],"mappings":""}

package/lib/cjs/style/ellipsis.shadow.css

@@ -1,4 +1,5 @@
 SContainer,
+SNoTooltipContainer,
 SContainerMiddle {
   display: flex;
   overflow: hidden;

package/lib/es6/Ellipsis.js

@@ -8,6 +8,10 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { sstyled as _sstyled } from "@semcore/core";
 
+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(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; }
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -23,21 +27,24 @@ var style = (
 /*__reshadow_css_start__*/
 _sstyled.insert(
 /*__inner_css_start__*/
-".___SContainer_9xuu4_gg_,.___SContainerMiddle_9xuu4_gg_{display:flex;overflow:hidden}.___SBeginning_9xuu4_gg_,.___SEllipsis_9xuu4_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_9xuu4_gg_.__maxLine_9xuu4_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_9xuu4);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_9xuu4_gg_{white-space:nowrap}"
+".___SContainerMiddle_5vwdw_gg_,.___SContainer_5vwdw_gg_,.___SNoTooltipContainer_5vwdw_gg_{display:flex;overflow:hidden}.___SBeginning_5vwdw_gg_,.___SEllipsis_5vwdw_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_5vwdw_gg_.__maxLine_5vwdw_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_5vwdw);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_5vwdw_gg_{white-space:nowrap}"
 /*__inner_css_end__*/
-, "9xuu4_gg_")
+, "5vwdw_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SContainer": "___SContainer_9xuu4_gg_",
-  "__SContainerMiddle": "___SContainerMiddle_9xuu4_gg_",
-  "__SBeginning": "___SBeginning_9xuu4_gg_",
-  "__SEllipsis": "___SEllipsis_9xuu4_gg_",
-  "_maxLine": "__maxLine_9xuu4_gg_",
-  "--maxLine": "--maxLine_9xuu4",
-  "__STail": "___STail_9xuu4_gg_"
+  "__SContainer": "___SContainer_5vwdw_gg_",
+  "__SNoTooltipContainer": "___SNoTooltipContainer_5vwdw_gg_",
+  "__SContainerMiddle": "___SContainerMiddle_5vwdw_gg_",
+  "__SBeginning": "___SBeginning_5vwdw_gg_",
+  "__SEllipsis": "___SEllipsis_5vwdw_gg_",
+  "_maxLine": "__maxLine_5vwdw_gg_",
+  "--maxLine": "--maxLine_5vwdw",
+  "__STail": "___STail_5vwdw_gg_"
 });
 import reactToText from '@semcore/utils/lib/reactToText';
 import getOriginChildren from '@semcore/utils/lib/getOriginChildren';
+import pick from '@semcore/utils/lib/pick';
+var defaultTooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
 
 var createMeasurerElement = function createMeasurerElement(element) {
   var styleElement = window.getComputedStyle(element, null);
@@ -125,6 +132,7 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
 
       var SEllipsis = this.Root;
       var SContainer = Tooltip;
+      var SNoTooltipContainer = Box;
       var _this$asProps = this.asProps,
           styles = _this$asProps.styles,
           Children = _this$asProps.Children,
@@ -132,9 +140,11 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
           tooltip = _this$asProps.tooltip,
           trim = _this$asProps.trim,
           containerRect = _this$asProps.containerRect,
-          containerRef = _this$asProps.containerRef;
+          containerRef = _this$asProps.containerRef,
+          includeTooltipProps = _this$asProps.includeTooltipProps;
       var visible = this.state.visible;
       var text = reactToText(getOriginChildren(Children));
+      var tooltipProps = pick(this.asProps, includeTooltipProps);
 
       if (trim === 'middle') {
         var _ref;
@@ -144,29 +154,31 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
           "styles": styles,
           "tooltip": tooltip,
           "containerRect": containerRect,
-          "containerRef": containerRef
+          "containerRef": containerRef,
+          "tooltipProps": tooltipProps
         }));
       }
 
       if (tooltip) {
         var _ref2;
 
-        return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SContainer, _ref2.cn("SContainer", {
-          "interaction": 'hover',
+        return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SContainer, _ref2.cn("SContainer", _objectSpread({
+          "interaction": "hover",
           "title": text,
           "visible": visible,
           "onVisibleChange": this.handlerVisibleChange
-        }), /*#__PURE__*/React.createElement(SEllipsis, _ref2.cn("SEllipsis", {
+        }, tooltipProps)), /*#__PURE__*/React.createElement(SEllipsis, _ref2.cn("SEllipsis", {
           "render": Box,
           "ref": this.textRef,
           "maxLine": maxLine
         }), /*#__PURE__*/React.createElement(Children, _ref2.cn("Children", {}))));
       }
 
-      return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SEllipsis, _ref3.cn("SEllipsis", {
+      return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SNoTooltipContainer, _ref3.cn("SNoTooltipContainer", {}), /*#__PURE__*/React.createElement(SEllipsis, _ref3.cn("SEllipsis", {
         "render": Box,
+        "ref": this.textRef,
         "maxLine": maxLine
-      }), /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {})));
+      }), /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {}))));
     }
   }]);
 
@@ -179,7 +191,8 @@ _defineProperty(RootEllipsis, "style", style);
 
 _defineProperty(RootEllipsis, "defaultProps", {
   trim: 'end',
-  tooltip: true
+  tooltip: true,
+  includeTooltipProps: defaultTooltipProps
 });
 
 var EllipsisMiddle = function EllipsisMiddle(props) {
@@ -187,7 +200,8 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
       text = props.text,
       tooltip = props.tooltip,
       containerRect = props.containerRect,
-      containerRef = props.containerRef;
+      containerRef = props.containerRef,
+      tooltipProps = props.tooltipProps;
   var resizeElement = useRef(null);
 
   var _useState = useState({
@@ -224,12 +238,12 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
   if (tooltip) {
     var _ref4;
 
-    return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", {
+    return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", _objectSpread({
       "interaction": text.length > displayedSymbols ? 'hover' : 'none',
       "title": text,
       "ref": containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement,
       "tag": Tooltip
-    }), /*#__PURE__*/React.createElement(SBeginning, _ref4.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/React.createElement(STail, _ref4.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
+    }, tooltipProps)), /*#__PURE__*/React.createElement(SBeginning, _ref4.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/React.createElement(STail, _ref4.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
   } else {
     var _ref5;
 

package/lib/es6/Ellipsis.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ellipsis.js","names":["React","useRef","useMemo","useState","useLayoutEffect","createComponent","Component","sstyled","Tooltip","Box","useResizeObserver","reactToText","getOriginChildren","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","style","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","whiteSpace","removeChild","RootEllipsis","visible","createRef","setState","showTooltip","asProps","maxLine","textRef","current","SEllipsis","Root","SContainer","styles","Children","tooltip","trim","containerRect","containerRef","state","text","handlerVisibleChange","EllipsisMiddle","props","resizeElement","symbolWidth","dimension","setDimension","blockWidth","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","displayedSymbols","Math","round","length","substring","Ellipsis"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState, useLayoutEffect } from 'react';\nimport createComponent, { Component, sstyled } from '@semcore/core';\nimport Tooltip from '@semcore/tooltip';\nimport { Box } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\n\nimport style from './style/ellipsis.shadow.css';\nimport reactToText from '@semcore/utils/lib/reactToText';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\n\ntype AsProps = {\n  maxLine?: number;\n  trim?: 'end' | 'middle';\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n};\n\ntype AsPropsMiddle = {\n  text: string;\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n};\n\nconst createMeasurerElement = (element: HTMLElement) => {\n  const styleElement = window.getComputedStyle(element, null);\n  const temporaryElement = document.createElement('temporary-block');\n  temporaryElement.style.display = 'inline-block';\n  temporaryElement.style.padding = '0';\n  temporaryElement.style.position = 'absolute';\n  temporaryElement.style.right = '150%';\n  temporaryElement.style.bottom = '150%';\n  temporaryElement.style.visibility = 'hidden';\n  temporaryElement.style.fontFamily = styleElement.getPropertyValue('font-family');\n  temporaryElement.style.fontSize = styleElement.getPropertyValue('font-size');\n  temporaryElement.style.fontWeight = styleElement.getPropertyValue('font-weight');\n\n  temporaryElement.innerHTML = element.innerHTML;\n  return temporaryElement;\n};\n\nfunction isTextOverflowing(element: HTMLElement | null, multiline: boolean): boolean {\n  if (!element) return false;\n\n  const { height: currentHeight, width: currentWidth } = element.getBoundingClientRect();\n  const measuringElement = createMeasurerElement(element);\n  let currentSize, initialSize;\n  document.body.appendChild(measuringElement);\n  if (multiline) {\n    currentSize = currentHeight;\n    measuringElement.style.width = `${currentWidth}px`;\n    initialSize = measuringElement.getBoundingClientRect().height;\n  } else {\n    currentSize = currentWidth;\n    measuringElement.style.whiteSpace = 'nowrap';\n    initialSize = measuringElement.getBoundingClientRect().width;\n  }\n  document.body.removeChild(measuringElement);\n  return currentSize < initialSize;\n}\n\n\nclass RootEllipsis extends Component<AsProps> {\n  static displayName = 'Ellipsis';\n  static style = style;\n  static defaultProps: AsProps = {\n    trim: 'end',\n    tooltip: true,\n  };\n\n  state = {\n    visible: false,\n  };\n\n  textRef = React.createRef<HTMLElement>();\n\n  showTooltip() {\n    const { maxLine = 1 } = this.asProps;\n    return isTextOverflowing(this.textRef.current, maxLine > 1)\n  };\n\n  handlerVisibleChange = (visible: boolean) => {\n    this.setState({ visible: visible && this.showTooltip() });\n  };\n\n  render() {\n    const SEllipsis = this.Root;\n    const SContainer = Tooltip;\n    const { styles, Children, maxLine, tooltip, trim, containerRect, containerRef } = this.asProps;\n    const { visible } = this.state;\n    const text = reactToText(getOriginChildren(Children));\n\n    if (trim === 'middle') {\n      return sstyled(styles)(\n        <EllipsisMiddle\n          text={text}\n          styles={styles}\n          tooltip={tooltip}\n          containerRect={containerRect}\n          containerRef={containerRef}\n        />,\n      );\n    }\n    if (tooltip) {\n      return sstyled(styles)(\n        <SContainer interaction='hover' title={text} visible={visible} onVisibleChange={this.handlerVisibleChange}>\n          <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n            <Children />\n          </SEllipsis>\n        </SContainer>,\n      );\n    }\n    return sstyled(styles)(\n      <SEllipsis render={Box} maxLine={maxLine}>\n        <Children />\n      </SEllipsis>,\n    );\n  }\n}\n\nconst EllipsisMiddle: React.FC<AsPropsMiddle> = (props) => {\n  const { styles, text, tooltip, containerRect, containerRef } = props;\n  const resizeElement = useRef<HTMLElement | null>(null);\n  const [dimension, setDimension] = useState<{ fontSize: string; symbolWidth: number }>({\n    fontSize: '14',\n    symbolWidth: 0,\n  });\n  const blockWidth = useResizeObserver(resizeElement, containerRect).width;\n\n  useLayoutEffect(() => {\n    const dateSpan = document.createElement('temporary-block');\n    dateSpan.setAttribute('style', `fontSize: ${dimension.fontSize}px`);\n    dateSpan.innerHTML = 'a';\n    document.body.appendChild(dateSpan);\n    const rect = dateSpan.getBoundingClientRect();\n\n    setDimension({\n      fontSize: window\n        // @ts-ignore\n        .getComputedStyle(containerRef?.current ?? resizeElement.current, null)\n        .getPropertyValue('font-size'),\n      symbolWidth: rect.width,\n    });\n    document.body.removeChild(dateSpan);\n  }, []);\n\n  const STail = 'span';\n  const SBeginning = 'span';\n  const SContainerMiddle = Box;\n  const displayedSymbols = useMemo(\n    () => Math.round(blockWidth / dimension.symbolWidth),\n    [blockWidth, dimension.symbolWidth],\n  );\n\n  if (tooltip) {\n    return sstyled(styles)(\n      <SContainerMiddle\n        interaction={text.length > displayedSymbols ? 'hover' : 'none'}\n        title={text}\n        ref={containerRef ?? resizeElement}\n        tag={Tooltip}\n      >\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  } else {\n    return sstyled(styles)(\n      <SContainerMiddle ref={containerRef ?? resizeElement}>\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  }\n};\n\nconst Ellipsis = createComponent(RootEllipsis);\n\nexport default Ellipsis;\n"],"mappings":"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"}
+{"version":3,"file":"Ellipsis.js","names":["React","useRef","useMemo","useState","useLayoutEffect","createComponent","Component","sstyled","Tooltip","Box","useResizeObserver","reactToText","getOriginChildren","pick","defaultTooltipProps","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","style","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","whiteSpace","removeChild","RootEllipsis","visible","createRef","setState","showTooltip","asProps","maxLine","textRef","current","SEllipsis","Root","SContainer","SNoTooltipContainer","styles","Children","tooltip","trim","containerRect","containerRef","includeTooltipProps","state","text","tooltipProps","handlerVisibleChange","EllipsisMiddle","props","resizeElement","symbolWidth","dimension","setDimension","blockWidth","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","displayedSymbols","Math","round","length","substring","Ellipsis"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState, useLayoutEffect } from 'react';\nimport createComponent, { Component, sstyled } from '@semcore/core';\nimport Tooltip from '@semcore/tooltip';\nimport { Box } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\n\nimport style from './style/ellipsis.shadow.css';\nimport reactToText from '@semcore/utils/lib/reactToText';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\nimport pick from '@semcore/utils/lib/pick';\n\ntype AsProps = {\n  maxLine?: number;\n  trim?: 'end' | 'middle';\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  includeTooltipProps?: string[];\n};\n\ntype AsPropsMiddle = {\n  text: string;\n  tooltip?: boolean;\n  styles?: React.CSSProperties;\n  containerRect?: { width: number };\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  tooltipProps: { [propName: string]: unknown };\n};\n\nconst defaultTooltipProps = [\n  'title',\n  'theme',\n  'strategy',\n  'modifiers',\n  'placement',\n  'interaction',\n  'timeout',\n  'visible',\n  'defaultVisible',\n  'onVisibleChange',\n  'offset',\n  'preventOverflow',\n  'arrow',\n  'flip',\n  'computeStyles',\n  'eventListeners',\n  'onFirstUpdate',\n];\n\nconst createMeasurerElement = (element: HTMLElement) => {\n  const styleElement = window.getComputedStyle(element, null);\n  const temporaryElement = document.createElement('temporary-block');\n  temporaryElement.style.display = 'inline-block';\n  temporaryElement.style.padding = '0';\n  temporaryElement.style.position = 'absolute';\n  temporaryElement.style.right = '150%';\n  temporaryElement.style.bottom = '150%';\n  temporaryElement.style.visibility = 'hidden';\n  temporaryElement.style.fontFamily = styleElement.getPropertyValue('font-family');\n  temporaryElement.style.fontSize = styleElement.getPropertyValue('font-size');\n  temporaryElement.style.fontWeight = styleElement.getPropertyValue('font-weight');\n\n  temporaryElement.innerHTML = element.innerHTML;\n  return temporaryElement;\n};\n\nfunction isTextOverflowing(element: HTMLElement | null, multiline: boolean): boolean {\n  if (!element) return false;\n\n  const { height: currentHeight, width: currentWidth } = element.getBoundingClientRect();\n  const measuringElement = createMeasurerElement(element);\n  let currentSize, initialSize;\n  document.body.appendChild(measuringElement);\n  if (multiline) {\n    currentSize = currentHeight;\n    measuringElement.style.width = `${currentWidth}px`;\n    initialSize = measuringElement.getBoundingClientRect().height;\n  } else {\n    currentSize = currentWidth;\n    measuringElement.style.whiteSpace = 'nowrap';\n    initialSize = measuringElement.getBoundingClientRect().width;\n  }\n  document.body.removeChild(measuringElement);\n  return currentSize < initialSize;\n}\n\nclass RootEllipsis extends Component<AsProps> {\n  static displayName = 'Ellipsis';\n  static style = style;\n  static defaultProps: AsProps = {\n    trim: 'end',\n    tooltip: true,\n    includeTooltipProps: defaultTooltipProps,\n  };\n\n  state = {\n    visible: false,\n  };\n\n  textRef = React.createRef<HTMLElement>();\n\n  showTooltip() {\n    const { maxLine = 1 } = this.asProps;\n    return isTextOverflowing(this.textRef.current, maxLine > 1);\n  }\n\n  handlerVisibleChange = (visible: boolean) => {\n    this.setState({ visible: visible && this.showTooltip() });\n  };\n\n  render() {\n    const SEllipsis = this.Root;\n    const SContainer = Tooltip;\n    const SNoTooltipContainer = Box;\n    const {\n      styles,\n      Children,\n      maxLine,\n      tooltip,\n      trim,\n      containerRect,\n      containerRef,\n      includeTooltipProps,\n    } = this.asProps;\n    const { visible } = this.state;\n    const text = reactToText(getOriginChildren(Children));\n    const tooltipProps = pick(this.asProps, includeTooltipProps);\n\n    if (trim === 'middle') {\n      return sstyled(styles)(\n        <EllipsisMiddle\n          text={text}\n          styles={styles}\n          tooltip={tooltip}\n          containerRect={containerRect}\n          containerRef={containerRef}\n          tooltipProps={tooltipProps}\n        />,\n      );\n    }\n    if (tooltip) {\n      return sstyled(styles)(\n        <SContainer\n          interaction=\"hover\"\n          title={text}\n          visible={visible}\n          onVisibleChange={this.handlerVisibleChange}\n          {...tooltipProps}\n        >\n          <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n            <Children />\n          </SEllipsis>\n        </SContainer>,\n      );\n    }\n    return sstyled(styles)(\n      <SNoTooltipContainer>\n        <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n          <Children />\n        </SEllipsis>\n      </SNoTooltipContainer>,\n    );\n  }\n}\n\nconst EllipsisMiddle: React.FC<AsPropsMiddle> = (props) => {\n  const { styles, text, tooltip, containerRect, containerRef, tooltipProps } = props;\n  const resizeElement = useRef<HTMLElement | null>(null);\n  const [dimension, setDimension] = useState<{ fontSize: string; symbolWidth: number }>({\n    fontSize: '14',\n    symbolWidth: 0,\n  });\n  const blockWidth = useResizeObserver(resizeElement, containerRect).width;\n\n  useLayoutEffect(() => {\n    const dateSpan = document.createElement('temporary-block');\n    dateSpan.setAttribute('style', `fontSize: ${dimension.fontSize}px`);\n    dateSpan.innerHTML = 'a';\n    document.body.appendChild(dateSpan);\n    const rect = dateSpan.getBoundingClientRect();\n\n    setDimension({\n      fontSize: window\n        // @ts-ignore\n        .getComputedStyle(containerRef?.current ?? resizeElement.current, null)\n        .getPropertyValue('font-size'),\n      symbolWidth: rect.width,\n    });\n    document.body.removeChild(dateSpan);\n  }, []);\n\n  const STail = 'span';\n  const SBeginning = 'span';\n  const SContainerMiddle = Box;\n  const displayedSymbols = useMemo(\n    () => Math.round(blockWidth / dimension.symbolWidth),\n    [blockWidth, dimension.symbolWidth],\n  );\n\n  if (tooltip) {\n    return sstyled(styles)(\n      <SContainerMiddle\n        interaction={text.length > displayedSymbols ? 'hover' : 'none'}\n        title={text}\n        ref={containerRef ?? resizeElement}\n        tag={Tooltip}\n        {...tooltipProps}\n      >\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  } else {\n    return sstyled(styles)(\n      <SContainerMiddle ref={containerRef ?? resizeElement}>\n        <SBeginning>{text.substring(0, text.length - displayedSymbols / 2 - 1)}</SBeginning>\n        <STail>{text.substring(text.length - displayedSymbols / 2 - 1)}</STail>\n      </SContainerMiddle>,\n    ) as any;\n  }\n};\n\nconst Ellipsis = createComponent(RootEllipsis);\n\nexport default Ellipsis;\n"],"mappings":"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"}

package/lib/es6/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { CProps } from '@semcore/core';\nimport { RefObject } from 'react';\n\nexport interface IEllipsisProps {\n  /**\n   * Rows count in multiline Ellipsis\n   * @default 1\n   */\n  maxLine?: number;\n  /**\n   * Trimming type\n   * @default end\n   */\n  trim?: 'end' | 'middle';\n  /**\n   * Show tooltip\n   * @default true\n   */\n  tooltip?: boolean;\n  /**\n   * Ref to the item that will be observed by ResizeObserver\n   */\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  /**\n   * Explicit sizes of container text should be trimmed in\n   **/\n  containerRect?: { width: number };\n}\n\ndeclare const useResizeObserver: (\n  ref: RefObject<HTMLElement>,\n  hookOverride?: { width: number },\n) => { width: number };\n\ndeclare const Ellipsis: <T>(props: CProps<IEllipsisProps & T>) => ReturnEl;\n\nexport { useResizeObserver };\nexport default Ellipsis;\n"],"mappings":""}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { CProps, ReturnEl } from '@semcore/core';\nimport { RefObject } from 'react';\nimport { IBoxProps } from '@semcore/flex-box';\nimport { ITooltipProps } from '@semcore/tooltip';\n\nexport interface IEllipsisProps extends IBoxProps, ITooltipProps {\n  /**\n   * Rows count in multiline Ellipsis\n   * @default 1\n   */\n  maxLine?: number;\n  /**\n   * Trimming type\n   * @default end\n   */\n  trim?: 'end' | 'middle';\n  /**\n   * Show tooltip\n   * @default true\n   */\n  tooltip?: boolean;\n  /**\n   * Ref to the item that will be observed by ResizeObserver\n   */\n  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope\n  containerRef?: RefObject<HTMLElement | null>;\n  /**\n   * Explicit sizes of container text should be trimmed in\n   **/\n  containerRect?: { width: number };\n  /** List of props that will be passed to tooltip\n   * @default ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate']\n   */\n  includeTooltipProps?: string[];\n}\n\ndeclare const useResizeObserver: (\n  ref: RefObject<HTMLElement>,\n  hookOverride?: { width: number },\n) => { width: number };\n\ndeclare const Ellipsis: <T>(props: CProps<IEllipsisProps & T>) => ReturnEl;\n\nexport { useResizeObserver };\nexport default Ellipsis;\n"],"mappings":""}

package/lib/es6/style/ellipsis.shadow.css

@@ -1,4 +1,5 @@
 SContainer,
+SNoTooltipContainer,
 SContainerMiddle {
   display: flex;
   overflow: hidden;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/ellipsis",
   "description": "Semrush Ellipsis Component",
-  "version": "1.1.10",
+  "version": "1.2.1",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",