@semcore/ellipsis 1.1.10 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,13 +2,13 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
- ## [1.1.10] - 2023-02-09
5
+ ## [1.2.0] - 2023-02-15
6
6
 
7
- ### Changed
7
+ ### Added
8
8
 
9
- - Version patch update due to children dependencies update (`@semcore/utils` [3.46.0 ~> 3.46.1], `@semcore/tooltip` [5.3.8 ~> 5.3.9]).
9
+ - Supported passing tooltip props.
10
10
 
11
- ## [1.1.9] - 2023-01-24
11
+ ## [1.1.10] - 2023-02-09
12
12
 
13
13
  ### Fixed
14
14
 
@@ -39,10 +39,16 @@ var _reactToText = _interopRequireDefault(require("@semcore/utils/lib/reactToTex
39
39
 
40
40
  var _getOriginChildren = _interopRequireDefault(require("@semcore/utils/lib/getOriginChildren"));
41
41
 
42
+ var _pick = _interopRequireDefault(require("@semcore/utils/lib/pick"));
43
+
42
44
  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); }
43
45
 
44
46
  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; }
45
47
 
48
+ 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; }
49
+
50
+ 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; }
51
+
46
52
  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); }; }
47
53
 
48
54
  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,20 @@ var style = (
52
58
  /*__reshadow_css_start__*/
53
59
  _core.sstyled.insert(
54
60
  /*__inner_css_start__*/
55
- ".___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}"
61
+ ".___SContainerMiddle_taf9e_gg_,.___SContainer_taf9e_gg_{display:flex;overflow:hidden}.___SBeginning_taf9e_gg_,.___SEllipsis_taf9e_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_taf9e_gg_.__maxLine_taf9e_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_taf9e);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_taf9e_gg_{white-space:nowrap}"
56
62
  /*__inner_css_end__*/
57
- , "9xuu4_gg_")
63
+ , "taf9e_gg_")
58
64
  /*__reshadow_css_end__*/
59
65
  , {
60
- "__SContainer": "___SContainer_9xuu4_gg_",
61
- "__SContainerMiddle": "___SContainerMiddle_9xuu4_gg_",
62
- "__SBeginning": "___SBeginning_9xuu4_gg_",
63
- "__SEllipsis": "___SEllipsis_9xuu4_gg_",
64
- "_maxLine": "__maxLine_9xuu4_gg_",
65
- "--maxLine": "--maxLine_9xuu4",
66
- "__STail": "___STail_9xuu4_gg_"
66
+ "__SContainer": "___SContainer_taf9e_gg_",
67
+ "__SContainerMiddle": "___SContainerMiddle_taf9e_gg_",
68
+ "__SBeginning": "___SBeginning_taf9e_gg_",
69
+ "__SEllipsis": "___SEllipsis_taf9e_gg_",
70
+ "_maxLine": "__maxLine_taf9e_gg_",
71
+ "--maxLine": "--maxLine_taf9e",
72
+ "__STail": "___STail_taf9e_gg_"
67
73
  });
74
+ var defaultTooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
68
75
 
69
76
  var createMeasurerElement = function createMeasurerElement(element) {
70
77
  var styleElement = window.getComputedStyle(element, null);
@@ -155,9 +162,11 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
155
162
  tooltip = _this$asProps.tooltip,
156
163
  trim = _this$asProps.trim,
157
164
  containerRect = _this$asProps.containerRect,
158
- containerRef = _this$asProps.containerRef;
165
+ containerRef = _this$asProps.containerRef,
166
+ includeTooltipProps = _this$asProps.includeTooltipProps;
159
167
  var visible = this.state.visible;
160
168
  var text = (0, _reactToText["default"])((0, _getOriginChildren["default"])(Children));
169
+ var tooltipProps = (0, _pick["default"])(this.asProps, includeTooltipProps);
161
170
 
162
171
  if (trim === 'middle') {
163
172
  var _ref;
@@ -167,19 +176,20 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
167
176
  "styles": styles,
168
177
  "tooltip": tooltip,
169
178
  "containerRect": containerRect,
170
- "containerRef": containerRef
179
+ "containerRef": containerRef,
180
+ "tooltipProps": tooltipProps
171
181
  }));
172
182
  }
173
183
 
174
184
  if (tooltip) {
175
185
  var _ref2;
176
186
 
177
- return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainer, _ref2.cn("SContainer", {
178
- "interaction": 'hover',
187
+ return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainer, _ref2.cn("SContainer", _objectSpread({
188
+ "interaction": "hover",
179
189
  "title": text,
180
190
  "visible": visible,
181
191
  "onVisibleChange": this.handlerVisibleChange
182
- }), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref2.cn("SEllipsis", {
192
+ }, tooltipProps)), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref2.cn("SEllipsis", {
183
193
  "render": _flexBox.Box,
184
194
  "ref": this.textRef,
185
195
  "maxLine": maxLine
@@ -199,7 +209,8 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
199
209
  (0, _defineProperty2["default"])(RootEllipsis, "style", style);
200
210
  (0, _defineProperty2["default"])(RootEllipsis, "defaultProps", {
201
211
  trim: 'end',
202
- tooltip: true
212
+ tooltip: true,
213
+ includeTooltipProps: defaultTooltipProps
203
214
  });
204
215
 
205
216
  var EllipsisMiddle = function EllipsisMiddle(props) {
@@ -207,7 +218,8 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
207
218
  text = props.text,
208
219
  tooltip = props.tooltip,
209
220
  containerRect = props.containerRect,
210
- containerRef = props.containerRef;
221
+ containerRef = props.containerRef,
222
+ tooltipProps = props.tooltipProps;
211
223
  var resizeElement = (0, _react.useRef)(null);
212
224
 
213
225
  var _useState = (0, _react.useState)({
@@ -244,12 +256,12 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
244
256
  if (tooltip) {
245
257
  var _ref4;
246
258
 
247
- return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", {
259
+ return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", _objectSpread({
248
260
  "interaction": text.length > displayedSymbols ? 'hover' : 'none',
249
261
  "title": text,
250
262
  "ref": containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement,
251
263
  "tag": _tooltip["default"]
252
- }), /*#__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)));
264
+ }, 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)));
253
265
  } else {
254
266
  var _ref5;
255
267
 
@@ -1 +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":"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"}
1
+ {"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","styles","Children","tooltip","trim","containerRect","containerRef","includeTooltipProps","state","text","reactToText","getOriginChildren","tooltipProps","pick","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';\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 {\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 <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, 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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"}
@@ -1 +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":""}
1
+ {"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":""}
@@ -8,6 +8,10 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
8
8
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
9
9
  import { sstyled as _sstyled } from "@semcore/core";
10
10
 
11
+ 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; }
12
+
13
+ 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; }
14
+
11
15
  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); }; }
12
16
 
13
17
  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,23 @@ var style = (
23
27
  /*__reshadow_css_start__*/
24
28
  _sstyled.insert(
25
29
  /*__inner_css_start__*/
26
- ".___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}"
30
+ ".___SContainerMiddle_taf9e_gg_,.___SContainer_taf9e_gg_{display:flex;overflow:hidden}.___SBeginning_taf9e_gg_,.___SEllipsis_taf9e_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_taf9e_gg_.__maxLine_taf9e_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_taf9e);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_taf9e_gg_{white-space:nowrap}"
27
31
  /*__inner_css_end__*/
28
- , "9xuu4_gg_")
32
+ , "taf9e_gg_")
29
33
  /*__reshadow_css_end__*/
30
34
  , {
31
- "__SContainer": "___SContainer_9xuu4_gg_",
32
- "__SContainerMiddle": "___SContainerMiddle_9xuu4_gg_",
33
- "__SBeginning": "___SBeginning_9xuu4_gg_",
34
- "__SEllipsis": "___SEllipsis_9xuu4_gg_",
35
- "_maxLine": "__maxLine_9xuu4_gg_",
36
- "--maxLine": "--maxLine_9xuu4",
37
- "__STail": "___STail_9xuu4_gg_"
35
+ "__SContainer": "___SContainer_taf9e_gg_",
36
+ "__SContainerMiddle": "___SContainerMiddle_taf9e_gg_",
37
+ "__SBeginning": "___SBeginning_taf9e_gg_",
38
+ "__SEllipsis": "___SEllipsis_taf9e_gg_",
39
+ "_maxLine": "__maxLine_taf9e_gg_",
40
+ "--maxLine": "--maxLine_taf9e",
41
+ "__STail": "___STail_taf9e_gg_"
38
42
  });
39
43
  import reactToText from '@semcore/utils/lib/reactToText';
40
44
  import getOriginChildren from '@semcore/utils/lib/getOriginChildren';
45
+ import pick from '@semcore/utils/lib/pick';
46
+ var defaultTooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
41
47
 
42
48
  var createMeasurerElement = function createMeasurerElement(element) {
43
49
  var styleElement = window.getComputedStyle(element, null);
@@ -132,9 +138,11 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
132
138
  tooltip = _this$asProps.tooltip,
133
139
  trim = _this$asProps.trim,
134
140
  containerRect = _this$asProps.containerRect,
135
- containerRef = _this$asProps.containerRef;
141
+ containerRef = _this$asProps.containerRef,
142
+ includeTooltipProps = _this$asProps.includeTooltipProps;
136
143
  var visible = this.state.visible;
137
144
  var text = reactToText(getOriginChildren(Children));
145
+ var tooltipProps = pick(this.asProps, includeTooltipProps);
138
146
 
139
147
  if (trim === 'middle') {
140
148
  var _ref;
@@ -144,19 +152,20 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
144
152
  "styles": styles,
145
153
  "tooltip": tooltip,
146
154
  "containerRect": containerRect,
147
- "containerRef": containerRef
155
+ "containerRef": containerRef,
156
+ "tooltipProps": tooltipProps
148
157
  }));
149
158
  }
150
159
 
151
160
  if (tooltip) {
152
161
  var _ref2;
153
162
 
154
- return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SContainer, _ref2.cn("SContainer", {
155
- "interaction": 'hover',
163
+ return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SContainer, _ref2.cn("SContainer", _objectSpread({
164
+ "interaction": "hover",
156
165
  "title": text,
157
166
  "visible": visible,
158
167
  "onVisibleChange": this.handlerVisibleChange
159
- }), /*#__PURE__*/React.createElement(SEllipsis, _ref2.cn("SEllipsis", {
168
+ }, tooltipProps)), /*#__PURE__*/React.createElement(SEllipsis, _ref2.cn("SEllipsis", {
160
169
  "render": Box,
161
170
  "ref": this.textRef,
162
171
  "maxLine": maxLine
@@ -179,7 +188,8 @@ _defineProperty(RootEllipsis, "style", style);
179
188
 
180
189
  _defineProperty(RootEllipsis, "defaultProps", {
181
190
  trim: 'end',
182
- tooltip: true
191
+ tooltip: true,
192
+ includeTooltipProps: defaultTooltipProps
183
193
  });
184
194
 
185
195
  var EllipsisMiddle = function EllipsisMiddle(props) {
@@ -187,7 +197,8 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
187
197
  text = props.text,
188
198
  tooltip = props.tooltip,
189
199
  containerRect = props.containerRect,
190
- containerRef = props.containerRef;
200
+ containerRef = props.containerRef,
201
+ tooltipProps = props.tooltipProps;
191
202
  var resizeElement = useRef(null);
192
203
 
193
204
  var _useState = useState({
@@ -224,12 +235,12 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
224
235
  if (tooltip) {
225
236
  var _ref4;
226
237
 
227
- return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", {
238
+ return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SContainerMiddle, _ref4.cn("SContainerMiddle", _objectSpread({
228
239
  "interaction": text.length > displayedSymbols ? 'hover' : 'none',
229
240
  "title": text,
230
241
  "ref": containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement,
231
242
  "tag": Tooltip
232
- }), /*#__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)));
243
+ }, 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)));
233
244
  } else {
234
245
  var _ref5;
235
246
 
@@ -1 +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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"}
1
+ {"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","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 {\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 <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, 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":";;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,IAA2BC,MAA3B,EAAmCC,OAAnC,EAA4CC,QAA5C,EAAsDC,eAAtD,QAA6E,OAA7E;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,OAArC,QAAoD,eAApD;AACA,OAAOC,OAAP,MAAoB,kBAApB;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,SAASC,iBAAT,QAAkC,qBAAlC;;;;;;;;;;;;;;;;;;;;AAGA,OAAOC,WAAP,MAAwB,gCAAxB;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,IAAP,MAAiB,yBAAjB;AAuBA,IAAMC,mBAAmB,GAAG,CAC1B,OAD0B,EAE1B,OAF0B,EAG1B,UAH0B,EAI1B,WAJ0B,EAK1B,WAL0B,EAM1B,aAN0B,EAO1B,SAP0B,EAQ1B,SAR0B,EAS1B,gBAT0B,EAU1B,iBAV0B,EAW1B,QAX0B,EAY1B,iBAZ0B,EAa1B,OAb0B,EAc1B,MAd0B,EAe1B,eAf0B,EAgB1B,gBAhB0B,EAiB1B,eAjB0B,CAA5B;;AAoBA,IAAMC,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;;IAEKK,Y;;;;;;;;;;;;;;;;4DASI;MACNC,OAAO,EAAE;IADH,C;;2EAIElD,KAAK,CAACmD,SAAN,E;;2EAOa,UAACD,OAAD,EAAsB;MAC3C,MAAKE,QAAL,CAAc;QAAEF,OAAO,EAAEA,OAAO,IAAI,MAAKG,WAAL;MAAtB,CAAd;IACD,C;;;;;;;WAPD,uBAAc;MACZ,4BAAwB,KAAKC,OAA7B,CAAQC,OAAR;MAAA,IAAQA,OAAR,sCAAkB,CAAlB;MACA,OAAOpB,iBAAiB,CAAC,KAAKqB,OAAL,CAAaC,OAAd,EAAuBF,OAAO,GAAG,CAAjC,CAAxB;IACD;;;WAMD,kBAAS;MAAA;;MACP,IAAMG,SAAS,GAAG,KAAKC,IAAvB;MACA,IAAMC,UAAU,GAAGpD,OAAnB;MACA,oBASI,KAAK8C,OATT;MAAA,IACEO,MADF,iBACEA,MADF;MAAA,IAEEC,QAFF,iBAEEA,QAFF;MAAA,IAGEP,OAHF,iBAGEA,OAHF;MAAA,IAIEQ,OAJF,iBAIEA,OAJF;MAAA,IAKEC,IALF,iBAKEA,IALF;MAAA,IAMEC,aANF,iBAMEA,aANF;MAAA,IAOEC,YAPF,iBAOEA,YAPF;MAAA,IAQEC,mBARF,iBAQEA,mBARF;MAUA,IAAQjB,OAAR,GAAoB,KAAKkB,KAAzB,CAAQlB,OAAR;MACA,IAAMmB,IAAI,GAAG1D,WAAW,CAACC,iBAAiB,CAACkD,QAAD,CAAlB,CAAxB;MACA,IAAMQ,YAAY,GAAGzD,IAAI,CAAC,KAAKyC,OAAN,EAAea,mBAAf,CAAzB;;MAEA,IAAIH,IAAI,KAAK,QAAb,EAAuB;QAAA;;QACrB,cAAOzD,OAAO,CAACsD,MAAD,CAAd,eACE,oBAAC,cAAD;UAAA,QACQQ,IADR;UAAA,UAEUR,MAFV;UAAA,WAGWE,OAHX;UAAA,iBAIiBE,aAJjB;UAAA,gBAKgBC,YALhB;UAAA,gBAMgBI;QANhB,GADF;MAUD;;MACD,IAAIP,OAAJ,EAAa;QAAA;;QACX,eAAOxD,OAAO,CAACsD,MAAD,CAAd,eACE,oBAAC,UAAD;UAAA,eACc,OADd;UAAA,SAESQ,IAFT;UAAA,WAGWnB,OAHX;UAAA,mBAImB,KAAKqB;QAJxB,GAKMD,YALN,iBAOE,oBAAC,SAAD;UAAA,UAAmB7D,GAAnB;UAAA,OAA6B,KAAK+C,OAAlC;UAAA,WAAoDD;QAApD,iBACE,oBAAC,QAAD,2BADF,CAPF,CADF;MAaD;;MACD,eAAOhD,OAAO,CAACsD,MAAD,CAAd,eACE,oBAAC,SAAD;QAAA,UAAmBpD,GAAnB;QAAA,WAAiC8C;MAAjC,iBACE,oBAAC,QAAD,2BADF,CADF;IAKD;;;;EAzEwBjD,S;;gBAArB2C,Y,iBACiB,U;;gBADjBA,Y,WAEW1B,K;;gBAFX0B,Y,kBAG2B;EAC7Be,IAAI,EAAE,KADuB;EAE7BD,OAAO,EAAE,IAFoB;EAG7BI,mBAAmB,EAAErD;AAHQ,C;;AAyEjC,IAAM0D,cAAuC,GAAG,SAA1CA,cAA0C,CAACC,KAAD,EAAW;EACzD,IAAQZ,MAAR,GAA6EY,KAA7E,CAAQZ,MAAR;EAAA,IAAgBQ,IAAhB,GAA6EI,KAA7E,CAAgBJ,IAAhB;EAAA,IAAsBN,OAAtB,GAA6EU,KAA7E,CAAsBV,OAAtB;EAAA,IAA+BE,aAA/B,GAA6EQ,KAA7E,CAA+BR,aAA/B;EAAA,IAA8CC,YAA9C,GAA6EO,KAA7E,CAA8CP,YAA9C;EAAA,IAA4DI,YAA5D,GAA6EG,KAA7E,CAA4DH,YAA5D;EACA,IAAMI,aAAa,GAAGzE,MAAM,CAAqB,IAArB,CAA5B;;EACA,gBAAkCE,QAAQ,CAA4C;IACpF6B,QAAQ,EAAE,IAD0E;IAEpF2C,WAAW,EAAE;EAFuE,CAA5C,CAA1C;EAAA;EAAA,IAAOC,SAAP;EAAA,IAAkBC,YAAlB;;EAIA,IAAMC,UAAU,GAAGpE,iBAAiB,CAACgE,aAAD,EAAgBT,aAAhB,CAAjB,CAAgDxB,KAAnE;EAEArC,eAAe,CAAC,YAAM;IAAA;;IACpB,IAAM2E,QAAQ,GAAG1D,QAAQ,CAACC,aAAT,CAAuB,iBAAvB,CAAjB;IACAyD,QAAQ,CAACC,YAAT,CAAsB,OAAtB,sBAA4CJ,SAAS,CAAC5C,QAAtD;IACA+C,QAAQ,CAAC7C,SAAT,GAAqB,GAArB;IACAb,QAAQ,CAACwB,IAAT,CAAcC,WAAd,CAA0BiC,QAA1B;IACA,IAAME,IAAI,GAAGF,QAAQ,CAAC1C,qBAAT,EAAb;IAEAwC,YAAY,CAAC;MACX7C,QAAQ,EAAEd,MAAM,CACd;MADc,CAEbC,gBAFO,0BAEU+C,YAFV,aAEUA,YAFV,uBAEUA,YAAY,CAAET,OAFxB,yEAEmCiB,aAAa,CAACjB,OAFjD,EAE0D,IAF1D,EAGP1B,gBAHO,CAGU,WAHV,CADC;MAKX4C,WAAW,EAAEM,IAAI,CAACxC;IALP,CAAD,CAAZ;IAOApB,QAAQ,CAACwB,IAAT,CAAcG,WAAd,CAA0B+B,QAA1B;EACD,CAfc,EAeZ,EAfY,CAAf;EAiBA,IAAMG,KAAK,GAAG,MAAd;EACA,IAAMC,UAAU,GAAG,MAAnB;EACA,IAAMC,gBAAgB,GAAG3E,GAAzB;EACA,IAAM4E,gBAAgB,GAAGnF,OAAO,CAC9B;IAAA,OAAMoF,IAAI,CAACC,KAAL,CAAWT,UAAU,GAAGF,SAAS,CAACD,WAAlC,CAAN;EAAA,CAD8B,EAE9B,CAACG,UAAD,EAAaF,SAAS,CAACD,WAAvB,CAF8B,CAAhC;;EAKA,IAAIZ,OAAJ,EAAa;IAAA;;IACX,eAAOxD,OAAO,CAACsD,MAAD,CAAd,eACE,oBAAC,gBAAD;MAAA,eACeQ,IAAI,CAACmB,MAAL,GAAcH,gBAAd,GAAiC,OAAjC,GAA2C,MAD1D;MAAA,SAEShB,IAFT;MAAA,OAGOH,YAHP,aAGOA,YAHP,cAGOA,YAHP,GAGuBQ,aAHvB;MAAA,OAIOlE;IAJP,GAKM8D,YALN,iBAOE,oBAAC,UAAD,8BAAaD,IAAI,CAACoB,SAAL,CAAe,CAAf,EAAkBpB,IAAI,CAACmB,MAAL,GAAcH,gBAAgB,GAAG,CAAjC,GAAqC,CAAvD,CAAb,CAPF,eAQE,oBAAC,KAAD,yBAAQhB,IAAI,CAACoB,SAAL,CAAepB,IAAI,CAACmB,MAAL,GAAcH,gBAAgB,GAAG,CAAjC,GAAqC,CAApD,CAAR,CARF,CADF;EAYD,CAbD,MAaO;IAAA;;IACL,eAAO9E,OAAO,CAACsD,MAAD,CAAd,eACE,oBAAC,gBAAD;MAAA,OAAuBK,YAAvB,aAAuBA,YAAvB,cAAuBA,YAAvB,GAAuCQ;IAAvC,iBACE,oBAAC,UAAD,8BAAaL,IAAI,CAACoB,SAAL,CAAe,CAAf,EAAkBpB,IAAI,CAACmB,MAAL,GAAcH,gBAAgB,GAAG,CAAjC,GAAqC,CAAvD,CAAb,CADF,eAEE,oBAAC,KAAD,yBAAQhB,IAAI,CAACoB,SAAL,CAAepB,IAAI,CAACmB,MAAL,GAAcH,gBAAgB,GAAG,CAAjC,GAAqC,CAApD,CAAR,CAFF,CADF;EAMD;AACF,CAvDD;;AAyDA,IAAMK,QAAQ,GAAGrF,eAAe,CAAC4C,YAAD,CAAhC;AAEA,eAAeyC,QAAf"}
@@ -1 +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":""}
1
+ {"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/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/ellipsis",
3
3
  "description": "Semrush Ellipsis Component",
4
- "version": "1.1.10",
4
+ "version": "1.2.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",