@semcore/ellipsis 2.4.1 → 2.5.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 +7 -1
- package/lib/cjs/Ellipsis.js +121 -48
- package/lib/cjs/Ellipsis.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/style/ellipsis.shadow.css +6 -1
- package/lib/es6/Ellipsis.js +124 -49
- package/lib/es6/Ellipsis.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/style/ellipsis.shadow.css +6 -1
- package/lib/types/index.d.ts +6 -3
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,7 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
-
## [2.
|
|
5
|
+
## [2.5.0-prerelease.0] - 2023-08-24
|
|
6
|
+
|
|
7
|
+
### Added
|
|
8
|
+
|
|
9
|
+
- Ellipsis advanced usage with `Ellipsis.Content` and `Ellipsis.Popper` components.
|
|
10
|
+
|
|
11
|
+
## [2.4.1] - 2023-08-24
|
|
6
12
|
|
|
7
13
|
### Changed
|
|
8
14
|
|
package/lib/cjs/Ellipsis.js
CHANGED
|
@@ -20,19 +20,21 @@ var _tooltip = _interopRequireDefault(require("@semcore/tooltip"));
|
|
|
20
20
|
var _flexBox = require("@semcore/flex-box");
|
|
21
21
|
var _useResizeObserver = require("./useResizeObserver");
|
|
22
22
|
var _useEnhancedEffect = _interopRequireDefault(require("@semcore/utils/lib/use/useEnhancedEffect"));
|
|
23
|
+
var _findComponent = _interopRequireWildcard(require("@semcore/utils/lib/findComponent"));
|
|
23
24
|
var _reactToText = _interopRequireDefault(require("@semcore/utils/lib/reactToText"));
|
|
24
25
|
var _getOriginChildren = _interopRequireDefault(require("@semcore/utils/lib/getOriginChildren"));
|
|
25
26
|
var _pick = _interopRequireDefault(require("@semcore/utils/lib/pick"));
|
|
26
27
|
/*__reshadow-styles__:"./style/ellipsis.shadow.css"*/
|
|
27
|
-
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".
|
|
28
|
-
"__SContainer": "
|
|
29
|
-
"__SNoTooltipContainer": "
|
|
30
|
-
"__SContainerMiddle": "
|
|
31
|
-
"__SBeginning": "
|
|
32
|
-
"__SEllipsis": "
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
"
|
|
28
|
+
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SContainerMiddle_zztw5_gg_,.___SContainer_zztw5_gg_,.___SEllipsis_zztw5_gg_.__middle-mod_zztw5_gg_,.___SNoTooltipContainer_zztw5_gg_{display:flex;overflow:hidden}.___SBeginning_zztw5_gg_,.___SEllipsis_zztw5_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_zztw5_gg_.__maxLine_zztw5_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_zztw5);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_zztw5_gg_{white-space:nowrap}" /*__inner_css_end__*/, "zztw5_gg_") /*__reshadow_css_end__*/, {
|
|
29
|
+
"__SContainer": "___SContainer_zztw5_gg_",
|
|
30
|
+
"__SNoTooltipContainer": "___SNoTooltipContainer_zztw5_gg_",
|
|
31
|
+
"__SContainerMiddle": "___SContainerMiddle_zztw5_gg_",
|
|
32
|
+
"__SBeginning": "___SBeginning_zztw5_gg_",
|
|
33
|
+
"__SEllipsis": "___SEllipsis_zztw5_gg_",
|
|
34
|
+
"_middle-mod": "__middle-mod_zztw5_gg_",
|
|
35
|
+
"_maxLine": "__maxLine_zztw5_gg_",
|
|
36
|
+
"--maxLine": "--maxLine_zztw5",
|
|
37
|
+
"__STail": "___STail_zztw5_gg_"
|
|
36
38
|
});
|
|
37
39
|
var defaultTooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
|
|
38
40
|
var createMeasurerElement = function createMeasurerElement(element) {
|
|
@@ -71,6 +73,10 @@ function isTextOverflowing(element, multiline) {
|
|
|
71
73
|
document.body.removeChild(measuringElement);
|
|
72
74
|
return currentSize < initialSize;
|
|
73
75
|
}
|
|
76
|
+
var forcedAdvancedMode = {
|
|
77
|
+
forcedAdvancedMode: true
|
|
78
|
+
};
|
|
79
|
+
var noAdvancedMode = {};
|
|
74
80
|
var RootEllipsis = /*#__PURE__*/function (_Component) {
|
|
75
81
|
(0, _inherits2["default"])(RootEllipsis, _Component);
|
|
76
82
|
var _super = (0, _createSuper2["default"])(RootEllipsis);
|
|
@@ -99,54 +105,77 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
|
|
|
99
105
|
maxLine = _this$asProps$maxLine === void 0 ? 1 : _this$asProps$maxLine;
|
|
100
106
|
return isTextOverflowing(this.textRef.current, maxLine > 1);
|
|
101
107
|
}
|
|
108
|
+
}, {
|
|
109
|
+
key: "getContentProps",
|
|
110
|
+
value: function getContentProps() {
|
|
111
|
+
return {
|
|
112
|
+
ref: this.textRef,
|
|
113
|
+
maxLine: this.asProps.maxLine
|
|
114
|
+
};
|
|
115
|
+
}
|
|
116
|
+
}, {
|
|
117
|
+
key: "getPopperProps",
|
|
118
|
+
value: function getPopperProps() {
|
|
119
|
+
var _this$asProps = this.asProps,
|
|
120
|
+
Children = _this$asProps.Children,
|
|
121
|
+
includeTooltipProps = _this$asProps.includeTooltipProps;
|
|
122
|
+
var text = (0, _reactToText["default"])((0, _getOriginChildren["default"])(Children));
|
|
123
|
+
var tooltipProps = (0, _pick["default"])(this.asProps, includeTooltipProps);
|
|
124
|
+
return (0, _objectSpread2["default"])({
|
|
125
|
+
children: text
|
|
126
|
+
}, tooltipProps);
|
|
127
|
+
}
|
|
102
128
|
}, {
|
|
103
129
|
key: "render",
|
|
104
130
|
value: function render() {
|
|
105
|
-
var
|
|
131
|
+
var _ref4;
|
|
106
132
|
var SEllipsis = this.Root;
|
|
107
133
|
var SContainer = _tooltip["default"];
|
|
108
134
|
var SNoTooltipContainer = _flexBox.Box;
|
|
109
|
-
var _this$
|
|
110
|
-
styles = _this$
|
|
111
|
-
Children = _this$
|
|
112
|
-
maxLine = _this$
|
|
113
|
-
tooltip = _this$
|
|
114
|
-
trim = _this$
|
|
115
|
-
containerRect = _this$
|
|
116
|
-
containerRef = _this$
|
|
117
|
-
includeTooltipProps = _this$
|
|
135
|
+
var _this$asProps2 = this.asProps,
|
|
136
|
+
styles = _this$asProps2.styles,
|
|
137
|
+
Children = _this$asProps2.Children,
|
|
138
|
+
maxLine = _this$asProps2.maxLine,
|
|
139
|
+
tooltip = _this$asProps2.tooltip,
|
|
140
|
+
trim = _this$asProps2.trim,
|
|
141
|
+
containerRect = _this$asProps2.containerRect,
|
|
142
|
+
containerRef = _this$asProps2.containerRef,
|
|
143
|
+
includeTooltipProps = _this$asProps2.includeTooltipProps;
|
|
118
144
|
var visible = this.state.visible;
|
|
119
|
-
var
|
|
145
|
+
var advancedContent = (0, _findComponent["default"])(Children, [Ellipsis.Content.displayName]);
|
|
146
|
+
var text = (0, _reactToText["default"])(advancedContent || (0, _getOriginChildren["default"])(Children));
|
|
147
|
+
var advanceMode = (0, _findComponent.isAdvanceMode)(Children, [Ellipsis.Content.displayName, Ellipsis.Popper.displayName]);
|
|
120
148
|
var tooltipProps = (0, _pick["default"])(this.asProps, includeTooltipProps);
|
|
121
149
|
if (trim === 'middle') {
|
|
122
|
-
var
|
|
123
|
-
return
|
|
150
|
+
var _ref2;
|
|
151
|
+
return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(EllipsisMiddle, _ref2.cn("EllipsisMiddle", {
|
|
124
152
|
"text": text,
|
|
125
153
|
"styles": styles,
|
|
126
154
|
"tooltip": tooltip,
|
|
127
155
|
"containerRect": containerRect,
|
|
128
156
|
"containerRef": containerRef,
|
|
129
|
-
"tooltipProps": tooltipProps
|
|
130
|
-
|
|
157
|
+
"tooltipProps": tooltipProps,
|
|
158
|
+
"advanceMode": advanceMode
|
|
159
|
+
}), /*#__PURE__*/_react["default"].createElement(Children, _ref2.cn("Children", {})));
|
|
131
160
|
}
|
|
132
161
|
if (tooltip) {
|
|
133
|
-
var
|
|
134
|
-
return
|
|
162
|
+
var _ref3;
|
|
163
|
+
return _ref3 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainer, _ref3.cn("SContainer", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
|
|
135
164
|
"interaction": 'hover',
|
|
136
|
-
"title": text,
|
|
165
|
+
"title": !advanceMode ? text : undefined,
|
|
137
166
|
"visible": visible,
|
|
138
167
|
"onVisibleChange": this.handlerVisibleChange
|
|
139
|
-
}, tooltipProps)), /*#__PURE__*/_react["default"].createElement(SEllipsis,
|
|
168
|
+
}, tooltipProps), advanceMode ? forcedAdvancedMode : noAdvancedMode)), advanceMode ? /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {})) : /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref3.cn("SEllipsis", {
|
|
140
169
|
"render": _flexBox.Box,
|
|
141
170
|
"ref": this.textRef,
|
|
142
171
|
"maxLine": maxLine
|
|
143
|
-
}), /*#__PURE__*/_react["default"].createElement(Children,
|
|
172
|
+
}), /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {}))));
|
|
144
173
|
}
|
|
145
|
-
return
|
|
174
|
+
return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SNoTooltipContainer, _ref4.cn("SNoTooltipContainer", {}), advanceMode ? /*#__PURE__*/_react["default"].createElement(Children, _ref4.cn("Children", {})) : /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref4.cn("SEllipsis", {
|
|
146
175
|
"render": _flexBox.Box,
|
|
147
176
|
"ref": this.textRef,
|
|
148
177
|
"maxLine": maxLine
|
|
149
|
-
}), /*#__PURE__*/_react["default"].createElement(Children,
|
|
178
|
+
}), /*#__PURE__*/_react["default"].createElement(Children, _ref4.cn("Children", {}))));
|
|
150
179
|
}
|
|
151
180
|
}]);
|
|
152
181
|
return RootEllipsis;
|
|
@@ -159,13 +188,17 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
|
|
|
159
188
|
includeTooltipProps: defaultTooltipProps,
|
|
160
189
|
__excludeProps: ['title']
|
|
161
190
|
});
|
|
191
|
+
var EllipsisMiddleContext = /*#__PURE__*/_react["default"].createContext(null);
|
|
162
192
|
var EllipsisMiddle = function EllipsisMiddle(props) {
|
|
193
|
+
var _ref7;
|
|
163
194
|
var styles = props.styles,
|
|
164
195
|
text = props.text,
|
|
165
196
|
tooltip = props.tooltip,
|
|
166
197
|
containerRect = props.containerRect,
|
|
167
198
|
containerRef = props.containerRef,
|
|
168
|
-
tooltipProps = props.tooltipProps
|
|
199
|
+
tooltipProps = props.tooltipProps,
|
|
200
|
+
children = props.children,
|
|
201
|
+
advanceMode = props.advanceMode;
|
|
169
202
|
var resizeElement = (0, _react.useRef)(null);
|
|
170
203
|
var _useState = (0, _react.useState)({
|
|
171
204
|
fontSize: '14',
|
|
@@ -176,16 +209,15 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
|
|
|
176
209
|
setDimension = _useState2[1];
|
|
177
210
|
var blockWidth = (0, _useResizeObserver.useResizeObserver)(resizeElement, containerRect).width;
|
|
178
211
|
(0, _useEnhancedEffect["default"])(function () {
|
|
179
|
-
var
|
|
212
|
+
var node = (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) || (resizeElement === null || resizeElement === void 0 ? void 0 : resizeElement.current);
|
|
213
|
+
if (!node) return;
|
|
180
214
|
var dateSpan = document.createElement('temporary-block');
|
|
181
215
|
dateSpan.setAttribute('style', "fontSize: ".concat(dimension.fontSize, "px"));
|
|
182
216
|
dateSpan.innerHTML = 'a';
|
|
183
217
|
document.body.appendChild(dateSpan);
|
|
184
218
|
var rect = dateSpan.getBoundingClientRect();
|
|
185
219
|
setDimension({
|
|
186
|
-
fontSize: window
|
|
187
|
-
// @ts-ignore
|
|
188
|
-
.getComputedStyle((_containerRef$current = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) !== null && _containerRef$current !== void 0 ? _containerRef$current : resizeElement.current, null).getPropertyValue('font-size'),
|
|
220
|
+
fontSize: window.getComputedStyle(node, null).getPropertyValue('font-size'),
|
|
189
221
|
symbolWidth: rect.width
|
|
190
222
|
});
|
|
191
223
|
document.body.removeChild(dateSpan);
|
|
@@ -193,25 +225,66 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
|
|
|
193
225
|
var STail = 'span';
|
|
194
226
|
var SBeginning = 'span';
|
|
195
227
|
var SContainerMiddle = _flexBox.Box;
|
|
228
|
+
var SAdvancedModeContainerMiddle = _tooltip["default"];
|
|
196
229
|
var displayedSymbols = (0, _react.useMemo)(function () {
|
|
197
230
|
return Math.round(blockWidth / dimension.symbolWidth);
|
|
198
231
|
}, [blockWidth, dimension.symbolWidth]);
|
|
232
|
+
var interaction = text.length > displayedSymbols ? 'hover' : 'none';
|
|
233
|
+
var ref = containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement;
|
|
234
|
+
var contextValue = _react["default"].useMemo(function () {
|
|
235
|
+
return {
|
|
236
|
+
begining: text.substring(0, text.length - displayedSymbols / 2 - 1),
|
|
237
|
+
tail: text.substring(text.length - displayedSymbols / 2 - 1),
|
|
238
|
+
ref: ref
|
|
239
|
+
};
|
|
240
|
+
}, [text, displayedSymbols]);
|
|
241
|
+
if (advanceMode) {
|
|
242
|
+
var _ref5;
|
|
243
|
+
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SAdvancedModeContainerMiddle, _ref5.cn("SAdvancedModeContainerMiddle", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
|
|
244
|
+
"interaction": interaction
|
|
245
|
+
}, tooltipProps), forcedAdvancedMode)), /*#__PURE__*/_react["default"].createElement(EllipsisMiddleContext.Provider, {
|
|
246
|
+
value: contextValue
|
|
247
|
+
}, children));
|
|
248
|
+
}
|
|
199
249
|
if (tooltip) {
|
|
200
|
-
var
|
|
201
|
-
return
|
|
202
|
-
"interaction":
|
|
250
|
+
var _ref6;
|
|
251
|
+
return _ref6 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainerMiddle, _ref6.cn("SContainerMiddle", (0, _objectSpread2["default"])({
|
|
252
|
+
"interaction": interaction,
|
|
203
253
|
"title": text,
|
|
204
|
-
"ref":
|
|
205
|
-
"tag": _tooltip["default"]
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
254
|
+
"ref": ref,
|
|
255
|
+
"tag": _tooltip["default"],
|
|
256
|
+
"__excludeProps": ['title']
|
|
257
|
+
}, tooltipProps)), /*#__PURE__*/_react["default"].createElement(SBeginning, _ref6.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/_react["default"].createElement(STail, _ref6.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
|
|
258
|
+
}
|
|
259
|
+
return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SContainerMiddle, _ref7.cn("SContainerMiddle", {
|
|
260
|
+
"ref": containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement
|
|
261
|
+
}), /*#__PURE__*/_react["default"].createElement(SBeginning, _ref7.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/_react["default"].createElement(STail, _ref7.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
|
|
262
|
+
};
|
|
263
|
+
var Content = function Content(_ref10) {
|
|
264
|
+
var _ref = arguments[0],
|
|
265
|
+
_ref9;
|
|
266
|
+
var styles = _ref10.styles,
|
|
267
|
+
Children = _ref10.Children;
|
|
268
|
+
var SEllipsis = _tooltip["default"].Trigger;
|
|
269
|
+
var ellipsisMiddleContext = _react["default"].useContext(EllipsisMiddleContext);
|
|
270
|
+
var STail = 'span';
|
|
271
|
+
var SBeginning = 'span';
|
|
272
|
+
if (ellipsisMiddleContext) {
|
|
273
|
+
var _ref8;
|
|
274
|
+
var begining = ellipsisMiddleContext.begining,
|
|
275
|
+
tail = ellipsisMiddleContext.tail,
|
|
276
|
+
ref = ellipsisMiddleContext.ref;
|
|
277
|
+
return _ref8 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref8.cn("SEllipsis", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
|
|
278
|
+
"middle-mod": true,
|
|
279
|
+
"ref": ref
|
|
280
|
+
}, _ref))), /*#__PURE__*/_react["default"].createElement(SBeginning, _ref8.cn("SBeginning", {}), begining), /*#__PURE__*/_react["default"].createElement(STail, _ref8.cn("STail", {}), tail));
|
|
212
281
|
}
|
|
282
|
+
return _ref9 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SEllipsis, _ref9.cn("SEllipsis", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({}, _ref))), /*#__PURE__*/_react["default"].createElement(Children, _ref9.cn("Children", {})));
|
|
213
283
|
};
|
|
214
|
-
var Ellipsis = (0, _core["default"])(RootEllipsis
|
|
284
|
+
var Ellipsis = (0, _core["default"])(RootEllipsis, {
|
|
285
|
+
Content: Content,
|
|
286
|
+
Popper: _tooltip["default"].Popper
|
|
287
|
+
});
|
|
215
288
|
var _default = Ellipsis;
|
|
216
289
|
exports["default"] = _default;
|
|
217
290
|
//# sourceMappingURL=Ellipsis.js.map
|
package/lib/cjs/Ellipsis.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Ellipsis.js","names":["_core","_interopRequireWildcard","require","_react","_tooltip","_interopRequireDefault","_flexBox","_useResizeObserver","_useEnhancedEffect","_reactToText","_getOriginChildren","_pick","style","sstyled","insert","defaultTooltipProps","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","_element$getBoundingC","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","concat","whiteSpace","removeChild","RootEllipsis","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","_defineProperty2","_assertThisInitialized2","visible","React","createRef","setState","showTooltip","_createClass2","key","value","_this$asProps$maxLine","asProps","maxLine","textRef","current","render","_ref3","SEllipsis","Root","SContainer","Tooltip","SNoTooltipContainer","Box","_this$asProps","styles","Children","tooltip","trim","containerRect","containerRef","includeTooltipProps","state","text","reactToText","getOriginChildren","tooltipProps","pick","_ref","EllipsisMiddle","cn","_ref2","_objectSpread2","handlerVisibleChange","Component","__excludeProps","props","resizeElement","useRef","_useState","useState","symbolWidth","_useState2","_slicedToArray2","dimension","setDimension","blockWidth","useResizeObserver","useEnhancedEffect","_containerRef$current","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","displayedSymbols","useMemo","Math","round","_ref4","substring","_ref5","Ellipsis","createComponent","_default","exports"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState } from 'react';\nimport createComponent, { Component, Intergalactic, sstyled } from '@semcore/core';\nimport Tooltip, { TooltipProps } from '@semcore/tooltip';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\nimport useEnhancedEffect from '@semcore/utils/lib/use/useEnhancedEffect';\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\n containerRef?: RefObject<HTMLDivElement>;\n includeTooltipProps?: string[];\n __excludeProps?: string[];\n};\n\ntype AsPropsMiddle = {\n text: string;\n tooltip?: boolean;\n styles?: React.CSSProperties;\n containerRect?: { width: number };\n\n containerRef?: RefObject<HTMLDivElement>;\n tooltipProps: TooltipProps;\n};\n\ntype EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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<HTMLDivElement>;\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\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: HTMLDivElement) => {\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: HTMLDivElement, 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;\n let 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 __excludeProps: ['title'],\n };\n\n state = {\n visible: false,\n };\n\n textRef = React.createRef<HTMLDivElement>();\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 as any) as TooltipProps;\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 as any}\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<HTMLDivElement>(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 useEnhancedEffect(() => {\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 as any}\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) as any as Intergalactic.Component<\n 'div',\n EllipsisProps\n>;\n\nexport default Ellipsis;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Ellipsis.js","names":["_core","_interopRequireWildcard","require","_react","_tooltip","_interopRequireDefault","_flexBox","_useResizeObserver","_useEnhancedEffect","_findComponent","_reactToText","_getOriginChildren","_pick","style","sstyled","insert","defaultTooltipProps","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","_element$getBoundingC","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","concat","whiteSpace","removeChild","forcedAdvancedMode","noAdvancedMode","RootEllipsis","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","_defineProperty2","_assertThisInitialized2","visible","React","createRef","setState","showTooltip","_createClass2","key","value","_this$asProps$maxLine","asProps","maxLine","textRef","current","getContentProps","ref","getPopperProps","_this$asProps","Children","includeTooltipProps","text","reactToText","getOriginChildren","tooltipProps","pick","_objectSpread2","children","render","_ref4","SEllipsis","Root","SContainer","Tooltip","SNoTooltipContainer","Box","_this$asProps2","styles","tooltip","trim","containerRect","containerRef","state","advancedContent","findComponent","Ellipsis","Content","displayName","advanceMode","isAdvanceMode","Popper","_ref2","EllipsisMiddle","cn","_ref3","undefined","handlerVisibleChange","Component","__excludeProps","EllipsisMiddleContext","createContext","props","_ref7","resizeElement","useRef","_useState","useState","symbolWidth","_useState2","_slicedToArray2","dimension","setDimension","blockWidth","useResizeObserver","useEnhancedEffect","node","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","SAdvancedModeContainerMiddle","displayedSymbols","useMemo","Math","round","interaction","contextValue","begining","substring","tail","_ref5","Provider","_ref6","_ref10","_ref","arguments[0]","_ref9","Trigger","ellipsisMiddleContext","useContext","_ref8","assignProps","createComponent","_default","exports"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState } from 'react';\nimport createComponent, { Component, Intergalactic, Root, sstyled } from '@semcore/core';\nimport Tooltip, { TooltipProps } from '@semcore/tooltip';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\nimport useEnhancedEffect from '@semcore/utils/lib/use/useEnhancedEffect';\nimport findComponent, { isAdvanceMode } from '@semcore/utils/lib/findComponent';\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\n containerRef?: RefObject<HTMLDivElement>;\n includeTooltipProps?: string[];\n __excludeProps?: string[];\n};\n\ntype AsPropsMiddle = {\n text: string;\n tooltip?: boolean;\n styles?: React.CSSProperties;\n containerRect?: { width: number };\n\n containerRef?: RefObject<HTMLDivElement>;\n tooltipProps: TooltipProps;\n children?: React.ReactNode;\n advanceMode?: boolean;\n};\n\ntype EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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<HTMLDivElement>;\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\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: HTMLDivElement) => {\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: HTMLDivElement, 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;\n let 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\nconst forcedAdvancedMode = { forcedAdvancedMode: true } as any;\nconst noAdvancedMode = {} as any;\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 __excludeProps: ['title'],\n };\n\n state = {\n visible: false,\n };\n\n textRef = React.createRef<HTMLDivElement>();\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 getContentProps() {\n return {\n ref: this.textRef,\n maxLine: this.asProps.maxLine,\n };\n }\n\n getPopperProps() {\n const { Children, includeTooltipProps } = this.asProps;\n const text = reactToText(getOriginChildren(Children));\n const tooltipProps = pick(this.asProps, includeTooltipProps as any) as TooltipProps;\n return { children: text, ...tooltipProps };\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 advancedContent = findComponent(Children, [(Ellipsis as any).Content.displayName]);\n const text = reactToText(advancedContent || getOriginChildren(Children));\n const advanceMode = isAdvanceMode(Children, [\n (Ellipsis as any).Content.displayName,\n (Ellipsis as any).Popper.displayName,\n ]);\n const tooltipProps = pick(this.asProps, includeTooltipProps as any) as TooltipProps;\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 advanceMode={advanceMode}\n >\n <Children />\n </EllipsisMiddle>,\n );\n }\n if (tooltip) {\n return sstyled(styles)(\n <SContainer\n interaction='hover'\n title={!advanceMode ? text : undefined}\n visible={visible}\n onVisibleChange={this.handlerVisibleChange}\n {...tooltipProps}\n {...(advanceMode ? forcedAdvancedMode : noAdvancedMode)}\n >\n {advanceMode ? (\n <Children />\n ) : (\n <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n <Children />\n </SEllipsis>\n )}\n </SContainer>,\n );\n }\n return sstyled(styles)(\n <SNoTooltipContainer>\n {advanceMode ? (\n <Children />\n ) : (\n <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n <Children />\n </SEllipsis>\n )}\n </SNoTooltipContainer>,\n );\n }\n}\n\nconst EllipsisMiddleContext = React.createContext<null | {\n begining: string;\n tail: string;\n ref: React.RefObject<HTMLElement>;\n}>(null);\n\nconst EllipsisMiddle: React.FC<AsPropsMiddle> = (props) => {\n const {\n styles,\n text,\n tooltip,\n containerRect,\n containerRef,\n tooltipProps,\n children,\n advanceMode,\n } = props;\n const resizeElement = useRef<HTMLDivElement>(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 useEnhancedEffect(() => {\n const node = containerRef?.current || resizeElement?.current;\n if (!node) return;\n\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.getComputedStyle(node, null).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 SAdvancedModeContainerMiddle = Tooltip;\n const displayedSymbols = useMemo(\n () => Math.round(blockWidth / dimension.symbolWidth),\n [blockWidth, dimension.symbolWidth],\n );\n\n const interaction = text.length > displayedSymbols ? 'hover' : 'none';\n const ref = containerRef ?? resizeElement;\n const contextValue = React.useMemo(\n () => ({\n begining: text.substring(0, text.length - displayedSymbols / 2 - 1),\n tail: text.substring(text.length - displayedSymbols / 2 - 1),\n ref,\n }),\n [text, displayedSymbols],\n );\n\n if (advanceMode) {\n return sstyled(styles)(\n <SAdvancedModeContainerMiddle\n interaction={interaction}\n {...tooltipProps}\n {...forcedAdvancedMode}\n >\n <EllipsisMiddleContext.Provider value={contextValue}>\n {children}\n </EllipsisMiddleContext.Provider>\n </SAdvancedModeContainerMiddle>,\n ) as any;\n }\n if (tooltip) {\n return sstyled(styles)(\n <SContainerMiddle\n interaction={interaction}\n title={text as any}\n ref={ref}\n tag={Tooltip}\n __excludeProps={['title']}\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 }\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\ntype EllipsisContentAsProps = {\n styles: any;\n Children: React.FC;\n};\n\nconst Content: React.FC<EllipsisContentAsProps> = ({ styles, Children }) => {\n const SEllipsis = Root;\n const ellipsisMiddleContext = React.useContext(EllipsisMiddleContext);\n const STail = 'span';\n const SBeginning = 'span';\n\n if (ellipsisMiddleContext) {\n const { begining, tail, ref } = ellipsisMiddleContext;\n return sstyled(styles)(\n <SEllipsis render={Tooltip.Trigger} middle-mod ref={ref}>\n <SBeginning>{begining}</SBeginning>\n <STail>{tail}</STail>\n </SEllipsis>,\n ) as any;\n }\n\n return sstyled(styles)(\n <SEllipsis render={Tooltip.Trigger}>\n <Children />\n </SEllipsis>,\n ) as any;\n};\n\nconst Ellipsis = createComponent(RootEllipsis, {\n Content,\n Popper: Tooltip.Popper,\n}) as any as Intergalactic.Component<'div', EllipsisProps> & {\n Content: typeof Box;\n Popper: typeof Tooltip.Popper;\n};\n\nexport default Ellipsis;\n"],"mappings":"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"}
|
package/lib/cjs/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { UnknownProperties, Intergalactic } from '@semcore/core';\nimport { RefObject } from 'react';\nimport { BoxProps } from '@semcore/flex-box';\nimport { TooltipProps } from '@semcore/tooltip';\n\n/** @deprecated */\nexport interface IEllipsisProps extends EllipsisProps, UnknownProperties {}\nexport type EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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 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: Intergalactic.Component<'div', EllipsisProps
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { UnknownProperties, Intergalactic } from '@semcore/core';\nimport { RefObject } from 'react';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport Tooltip, { TooltipProps } from '@semcore/tooltip';\n\n/** @deprecated */\nexport interface IEllipsisProps extends EllipsisProps, UnknownProperties {}\nexport type EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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 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: Intergalactic.Component<'div', EllipsisProps> & {\n Content: typeof Box;\n Popper: typeof Tooltip.Popper;\n};\n\nexport { useResizeObserver };\nexport default Ellipsis;\n"],"mappings":""}
|
|
@@ -13,6 +13,11 @@ SEllipsis {
|
|
|
13
13
|
white-space: nowrap;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
+
SEllipsis[middle-mod] {
|
|
17
|
+
display: flex;
|
|
18
|
+
overflow: hidden;
|
|
19
|
+
}
|
|
20
|
+
|
|
16
21
|
SEllipsis[maxLine] {
|
|
17
22
|
display: -webkit-box;
|
|
18
23
|
-webkit-line-clamp: var(--maxLine);
|
|
@@ -23,4 +28,4 @@ SEllipsis[maxLine] {
|
|
|
23
28
|
|
|
24
29
|
STail {
|
|
25
30
|
white-space: nowrap;
|
|
26
|
-
}
|
|
31
|
+
}
|
package/lib/es6/Ellipsis.js
CHANGED
|
@@ -7,22 +7,26 @@ import _inherits from "@babel/runtime/helpers/inherits";
|
|
|
7
7
|
import _createSuper from "@babel/runtime/helpers/createSuper";
|
|
8
8
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
9
9
|
import { sstyled as _sstyled } from "@semcore/core";
|
|
10
|
+
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
11
|
+
import { assignProps as _assignProps } from "@semcore/core";
|
|
10
12
|
import React, { useRef, useMemo, useState } from 'react';
|
|
11
|
-
import createComponent, { Component, sstyled } from '@semcore/core';
|
|
13
|
+
import createComponent, { Component, Root, sstyled } from '@semcore/core';
|
|
12
14
|
import Tooltip from '@semcore/tooltip';
|
|
13
15
|
import { Box } from '@semcore/flex-box';
|
|
14
16
|
import { useResizeObserver } from './useResizeObserver';
|
|
15
17
|
import useEnhancedEffect from '@semcore/utils/lib/use/useEnhancedEffect';
|
|
18
|
+
import findComponent, { isAdvanceMode } from '@semcore/utils/lib/findComponent';
|
|
16
19
|
/*__reshadow-styles__:"./style/ellipsis.shadow.css"*/
|
|
17
|
-
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".
|
|
18
|
-
"__SContainer": "
|
|
19
|
-
"__SNoTooltipContainer": "
|
|
20
|
-
"__SContainerMiddle": "
|
|
21
|
-
"__SBeginning": "
|
|
22
|
-
"__SEllipsis": "
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"
|
|
20
|
+
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SContainerMiddle_zztw5_gg_,.___SContainer_zztw5_gg_,.___SEllipsis_zztw5_gg_.__middle-mod_zztw5_gg_,.___SNoTooltipContainer_zztw5_gg_{display:flex;overflow:hidden}.___SBeginning_zztw5_gg_,.___SEllipsis_zztw5_gg_{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap}.___SEllipsis_zztw5_gg_.__maxLine_zztw5_gg_{display:-webkit-box;-webkit-line-clamp:var(--maxLine_zztw5);-webkit-box-orient:vertical;overflow:hidden;white-space:normal}.___STail_zztw5_gg_{white-space:nowrap}" /*__inner_css_end__*/, "zztw5_gg_") /*__reshadow_css_end__*/, {
|
|
21
|
+
"__SContainer": "___SContainer_zztw5_gg_",
|
|
22
|
+
"__SNoTooltipContainer": "___SNoTooltipContainer_zztw5_gg_",
|
|
23
|
+
"__SContainerMiddle": "___SContainerMiddle_zztw5_gg_",
|
|
24
|
+
"__SBeginning": "___SBeginning_zztw5_gg_",
|
|
25
|
+
"__SEllipsis": "___SEllipsis_zztw5_gg_",
|
|
26
|
+
"_middle-mod": "__middle-mod_zztw5_gg_",
|
|
27
|
+
"_maxLine": "__maxLine_zztw5_gg_",
|
|
28
|
+
"--maxLine": "--maxLine_zztw5",
|
|
29
|
+
"__STail": "___STail_zztw5_gg_"
|
|
26
30
|
});
|
|
27
31
|
import reactToText from '@semcore/utils/lib/reactToText';
|
|
28
32
|
import getOriginChildren from '@semcore/utils/lib/getOriginChildren';
|
|
@@ -64,6 +68,10 @@ function isTextOverflowing(element, multiline) {
|
|
|
64
68
|
document.body.removeChild(measuringElement);
|
|
65
69
|
return currentSize < initialSize;
|
|
66
70
|
}
|
|
71
|
+
var forcedAdvancedMode = {
|
|
72
|
+
forcedAdvancedMode: true
|
|
73
|
+
};
|
|
74
|
+
var noAdvancedMode = {};
|
|
67
75
|
var RootEllipsis = /*#__PURE__*/function (_Component) {
|
|
68
76
|
_inherits(RootEllipsis, _Component);
|
|
69
77
|
var _super = _createSuper(RootEllipsis);
|
|
@@ -92,54 +100,77 @@ var RootEllipsis = /*#__PURE__*/function (_Component) {
|
|
|
92
100
|
maxLine = _this$asProps$maxLine === void 0 ? 1 : _this$asProps$maxLine;
|
|
93
101
|
return isTextOverflowing(this.textRef.current, maxLine > 1);
|
|
94
102
|
}
|
|
103
|
+
}, {
|
|
104
|
+
key: "getContentProps",
|
|
105
|
+
value: function getContentProps() {
|
|
106
|
+
return {
|
|
107
|
+
ref: this.textRef,
|
|
108
|
+
maxLine: this.asProps.maxLine
|
|
109
|
+
};
|
|
110
|
+
}
|
|
111
|
+
}, {
|
|
112
|
+
key: "getPopperProps",
|
|
113
|
+
value: function getPopperProps() {
|
|
114
|
+
var _this$asProps = this.asProps,
|
|
115
|
+
Children = _this$asProps.Children,
|
|
116
|
+
includeTooltipProps = _this$asProps.includeTooltipProps;
|
|
117
|
+
var text = reactToText(getOriginChildren(Children));
|
|
118
|
+
var tooltipProps = pick(this.asProps, includeTooltipProps);
|
|
119
|
+
return _objectSpread({
|
|
120
|
+
children: text
|
|
121
|
+
}, tooltipProps);
|
|
122
|
+
}
|
|
95
123
|
}, {
|
|
96
124
|
key: "render",
|
|
97
125
|
value: function render() {
|
|
98
|
-
var
|
|
126
|
+
var _ref4;
|
|
99
127
|
var SEllipsis = this.Root;
|
|
100
128
|
var SContainer = Tooltip;
|
|
101
129
|
var SNoTooltipContainer = Box;
|
|
102
|
-
var _this$
|
|
103
|
-
styles = _this$
|
|
104
|
-
Children = _this$
|
|
105
|
-
maxLine = _this$
|
|
106
|
-
tooltip = _this$
|
|
107
|
-
trim = _this$
|
|
108
|
-
containerRect = _this$
|
|
109
|
-
containerRef = _this$
|
|
110
|
-
includeTooltipProps = _this$
|
|
130
|
+
var _this$asProps2 = this.asProps,
|
|
131
|
+
styles = _this$asProps2.styles,
|
|
132
|
+
Children = _this$asProps2.Children,
|
|
133
|
+
maxLine = _this$asProps2.maxLine,
|
|
134
|
+
tooltip = _this$asProps2.tooltip,
|
|
135
|
+
trim = _this$asProps2.trim,
|
|
136
|
+
containerRect = _this$asProps2.containerRect,
|
|
137
|
+
containerRef = _this$asProps2.containerRef,
|
|
138
|
+
includeTooltipProps = _this$asProps2.includeTooltipProps;
|
|
111
139
|
var visible = this.state.visible;
|
|
112
|
-
var
|
|
140
|
+
var advancedContent = findComponent(Children, [Ellipsis.Content.displayName]);
|
|
141
|
+
var text = reactToText(advancedContent || getOriginChildren(Children));
|
|
142
|
+
var advanceMode = isAdvanceMode(Children, [Ellipsis.Content.displayName, Ellipsis.Popper.displayName]);
|
|
113
143
|
var tooltipProps = pick(this.asProps, includeTooltipProps);
|
|
114
144
|
if (trim === 'middle') {
|
|
115
|
-
var
|
|
116
|
-
return
|
|
145
|
+
var _ref2;
|
|
146
|
+
return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(EllipsisMiddle, _ref2.cn("EllipsisMiddle", {
|
|
117
147
|
"text": text,
|
|
118
148
|
"styles": styles,
|
|
119
149
|
"tooltip": tooltip,
|
|
120
150
|
"containerRect": containerRect,
|
|
121
151
|
"containerRef": containerRef,
|
|
122
|
-
"tooltipProps": tooltipProps
|
|
123
|
-
|
|
152
|
+
"tooltipProps": tooltipProps,
|
|
153
|
+
"advanceMode": advanceMode
|
|
154
|
+
}), /*#__PURE__*/React.createElement(Children, _ref2.cn("Children", {})));
|
|
124
155
|
}
|
|
125
156
|
if (tooltip) {
|
|
126
|
-
var
|
|
127
|
-
return
|
|
157
|
+
var _ref3;
|
|
158
|
+
return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SContainer, _ref3.cn("SContainer", _objectSpread(_objectSpread({
|
|
128
159
|
"interaction": 'hover',
|
|
129
|
-
"title": text,
|
|
160
|
+
"title": !advanceMode ? text : undefined,
|
|
130
161
|
"visible": visible,
|
|
131
162
|
"onVisibleChange": this.handlerVisibleChange
|
|
132
|
-
}, tooltipProps)), /*#__PURE__*/React.createElement(SEllipsis,
|
|
163
|
+
}, tooltipProps), advanceMode ? forcedAdvancedMode : noAdvancedMode)), advanceMode ? /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {})) : /*#__PURE__*/React.createElement(SEllipsis, _ref3.cn("SEllipsis", {
|
|
133
164
|
"render": Box,
|
|
134
165
|
"ref": this.textRef,
|
|
135
166
|
"maxLine": maxLine
|
|
136
|
-
}), /*#__PURE__*/React.createElement(Children,
|
|
167
|
+
}), /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {}))));
|
|
137
168
|
}
|
|
138
|
-
return
|
|
169
|
+
return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SNoTooltipContainer, _ref4.cn("SNoTooltipContainer", {}), advanceMode ? /*#__PURE__*/React.createElement(Children, _ref4.cn("Children", {})) : /*#__PURE__*/React.createElement(SEllipsis, _ref4.cn("SEllipsis", {
|
|
139
170
|
"render": Box,
|
|
140
171
|
"ref": this.textRef,
|
|
141
172
|
"maxLine": maxLine
|
|
142
|
-
}), /*#__PURE__*/React.createElement(Children,
|
|
173
|
+
}), /*#__PURE__*/React.createElement(Children, _ref4.cn("Children", {}))));
|
|
143
174
|
}
|
|
144
175
|
}]);
|
|
145
176
|
return RootEllipsis;
|
|
@@ -152,13 +183,17 @@ _defineProperty(RootEllipsis, "defaultProps", {
|
|
|
152
183
|
includeTooltipProps: defaultTooltipProps,
|
|
153
184
|
__excludeProps: ['title']
|
|
154
185
|
});
|
|
186
|
+
var EllipsisMiddleContext = /*#__PURE__*/React.createContext(null);
|
|
155
187
|
var EllipsisMiddle = function EllipsisMiddle(props) {
|
|
188
|
+
var _ref7;
|
|
156
189
|
var styles = props.styles,
|
|
157
190
|
text = props.text,
|
|
158
191
|
tooltip = props.tooltip,
|
|
159
192
|
containerRect = props.containerRect,
|
|
160
193
|
containerRef = props.containerRef,
|
|
161
|
-
tooltipProps = props.tooltipProps
|
|
194
|
+
tooltipProps = props.tooltipProps,
|
|
195
|
+
children = props.children,
|
|
196
|
+
advanceMode = props.advanceMode;
|
|
162
197
|
var resizeElement = useRef(null);
|
|
163
198
|
var _useState = useState({
|
|
164
199
|
fontSize: '14',
|
|
@@ -169,16 +204,15 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
|
|
|
169
204
|
setDimension = _useState2[1];
|
|
170
205
|
var blockWidth = useResizeObserver(resizeElement, containerRect).width;
|
|
171
206
|
useEnhancedEffect(function () {
|
|
172
|
-
var
|
|
207
|
+
var node = (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) || (resizeElement === null || resizeElement === void 0 ? void 0 : resizeElement.current);
|
|
208
|
+
if (!node) return;
|
|
173
209
|
var dateSpan = document.createElement('temporary-block');
|
|
174
210
|
dateSpan.setAttribute('style', "fontSize: ".concat(dimension.fontSize, "px"));
|
|
175
211
|
dateSpan.innerHTML = 'a';
|
|
176
212
|
document.body.appendChild(dateSpan);
|
|
177
213
|
var rect = dateSpan.getBoundingClientRect();
|
|
178
214
|
setDimension({
|
|
179
|
-
fontSize: window
|
|
180
|
-
// @ts-ignore
|
|
181
|
-
.getComputedStyle((_containerRef$current = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) !== null && _containerRef$current !== void 0 ? _containerRef$current : resizeElement.current, null).getPropertyValue('font-size'),
|
|
215
|
+
fontSize: window.getComputedStyle(node, null).getPropertyValue('font-size'),
|
|
182
216
|
symbolWidth: rect.width
|
|
183
217
|
});
|
|
184
218
|
document.body.removeChild(dateSpan);
|
|
@@ -186,24 +220,65 @@ var EllipsisMiddle = function EllipsisMiddle(props) {
|
|
|
186
220
|
var STail = 'span';
|
|
187
221
|
var SBeginning = 'span';
|
|
188
222
|
var SContainerMiddle = Box;
|
|
223
|
+
var SAdvancedModeContainerMiddle = Tooltip;
|
|
189
224
|
var displayedSymbols = useMemo(function () {
|
|
190
225
|
return Math.round(blockWidth / dimension.symbolWidth);
|
|
191
226
|
}, [blockWidth, dimension.symbolWidth]);
|
|
227
|
+
var interaction = text.length > displayedSymbols ? 'hover' : 'none';
|
|
228
|
+
var ref = containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement;
|
|
229
|
+
var contextValue = React.useMemo(function () {
|
|
230
|
+
return {
|
|
231
|
+
begining: text.substring(0, text.length - displayedSymbols / 2 - 1),
|
|
232
|
+
tail: text.substring(text.length - displayedSymbols / 2 - 1),
|
|
233
|
+
ref: ref
|
|
234
|
+
};
|
|
235
|
+
}, [text, displayedSymbols]);
|
|
236
|
+
if (advanceMode) {
|
|
237
|
+
var _ref5;
|
|
238
|
+
return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(SAdvancedModeContainerMiddle, _ref5.cn("SAdvancedModeContainerMiddle", _objectSpread(_objectSpread({
|
|
239
|
+
"interaction": interaction
|
|
240
|
+
}, tooltipProps), forcedAdvancedMode)), /*#__PURE__*/React.createElement(EllipsisMiddleContext.Provider, {
|
|
241
|
+
value: contextValue
|
|
242
|
+
}, children));
|
|
243
|
+
}
|
|
192
244
|
if (tooltip) {
|
|
193
|
-
var
|
|
194
|
-
return
|
|
195
|
-
"interaction":
|
|
245
|
+
var _ref6;
|
|
246
|
+
return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(SContainerMiddle, _ref6.cn("SContainerMiddle", _objectSpread({
|
|
247
|
+
"interaction": interaction,
|
|
196
248
|
"title": text,
|
|
197
|
-
"ref":
|
|
198
|
-
"tag": Tooltip
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
249
|
+
"ref": ref,
|
|
250
|
+
"tag": Tooltip,
|
|
251
|
+
"__excludeProps": ['title']
|
|
252
|
+
}, tooltipProps)), /*#__PURE__*/React.createElement(SBeginning, _ref6.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/React.createElement(STail, _ref6.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
|
|
253
|
+
}
|
|
254
|
+
return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SContainerMiddle, _ref7.cn("SContainerMiddle", {
|
|
255
|
+
"ref": containerRef !== null && containerRef !== void 0 ? containerRef : resizeElement
|
|
256
|
+
}), /*#__PURE__*/React.createElement(SBeginning, _ref7.cn("SBeginning", {}), text.substring(0, text.length - displayedSymbols / 2 - 1)), /*#__PURE__*/React.createElement(STail, _ref7.cn("STail", {}), text.substring(text.length - displayedSymbols / 2 - 1)));
|
|
257
|
+
};
|
|
258
|
+
var Content = function Content(_ref10) {
|
|
259
|
+
var _ref = arguments[0],
|
|
260
|
+
_ref9;
|
|
261
|
+
var styles = _ref10.styles,
|
|
262
|
+
Children = _ref10.Children;
|
|
263
|
+
var SEllipsis = Tooltip.Trigger;
|
|
264
|
+
var ellipsisMiddleContext = React.useContext(EllipsisMiddleContext);
|
|
265
|
+
var STail = 'span';
|
|
266
|
+
var SBeginning = 'span';
|
|
267
|
+
if (ellipsisMiddleContext) {
|
|
268
|
+
var _ref8;
|
|
269
|
+
var begining = ellipsisMiddleContext.begining,
|
|
270
|
+
tail = ellipsisMiddleContext.tail,
|
|
271
|
+
ref = ellipsisMiddleContext.ref;
|
|
272
|
+
return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SEllipsis, _ref8.cn("SEllipsis", _objectSpread({}, _assignProps({
|
|
273
|
+
"middle-mod": true,
|
|
274
|
+
"ref": ref
|
|
275
|
+
}, _ref))), /*#__PURE__*/React.createElement(SBeginning, _ref8.cn("SBeginning", {}), begining), /*#__PURE__*/React.createElement(STail, _ref8.cn("STail", {}), tail));
|
|
205
276
|
}
|
|
277
|
+
return _ref9 = sstyled(styles), /*#__PURE__*/React.createElement(SEllipsis, _ref9.cn("SEllipsis", _objectSpread({}, _assignProps2({}, _ref))), /*#__PURE__*/React.createElement(Children, _ref9.cn("Children", {})));
|
|
206
278
|
};
|
|
207
|
-
var Ellipsis = createComponent(RootEllipsis
|
|
279
|
+
var Ellipsis = createComponent(RootEllipsis, {
|
|
280
|
+
Content: Content,
|
|
281
|
+
Popper: Tooltip.Popper
|
|
282
|
+
});
|
|
208
283
|
export default Ellipsis;
|
|
209
284
|
//# sourceMappingURL=Ellipsis.js.map
|
package/lib/es6/Ellipsis.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Ellipsis.js","names":["React","useRef","useMemo","useState","createComponent","Component","sstyled","Tooltip","Box","useResizeObserver","useEnhancedEffect","style","_sstyled","insert","reactToText","getOriginChildren","pick","defaultTooltipProps","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","_element$getBoundingC","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","concat","whiteSpace","removeChild","RootEllipsis","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","_defineProperty","_assertThisInitialized","visible","createRef","setState","showTooltip","_createClass","key","value","_this$asProps$maxLine","asProps","maxLine","textRef","current","render","_ref3","SEllipsis","Root","SContainer","SNoTooltipContainer","_this$asProps","styles","Children","tooltip","trim","containerRect","containerRef","includeTooltipProps","state","text","tooltipProps","_ref","EllipsisMiddle","cn","_ref2","_objectSpread","handlerVisibleChange","__excludeProps","props","resizeElement","_useState","symbolWidth","_useState2","_slicedToArray","dimension","setDimension","blockWidth","_containerRef$current","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","displayedSymbols","Math","round","_ref4","substring","_ref5","Ellipsis"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState } from 'react';\nimport createComponent, { Component, Intergalactic, sstyled } from '@semcore/core';\nimport Tooltip, { TooltipProps } from '@semcore/tooltip';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\nimport useEnhancedEffect from '@semcore/utils/lib/use/useEnhancedEffect';\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\n containerRef?: RefObject<HTMLDivElement>;\n includeTooltipProps?: string[];\n __excludeProps?: string[];\n};\n\ntype AsPropsMiddle = {\n text: string;\n tooltip?: boolean;\n styles?: React.CSSProperties;\n containerRect?: { width: number };\n\n containerRef?: RefObject<HTMLDivElement>;\n tooltipProps: TooltipProps;\n};\n\ntype EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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<HTMLDivElement>;\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\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: HTMLDivElement) => {\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: HTMLDivElement, 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;\n let 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 __excludeProps: ['title'],\n };\n\n state = {\n visible: false,\n };\n\n textRef = React.createRef<HTMLDivElement>();\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 as any) as TooltipProps;\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 as any}\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<HTMLDivElement>(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 useEnhancedEffect(() => {\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 as any}\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) as any as Intergalactic.Component<\n 'div',\n EllipsisProps\n>;\n\nexport default Ellipsis;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Ellipsis.js","names":["React","useRef","useMemo","useState","createComponent","Component","Root","sstyled","Tooltip","Box","useResizeObserver","useEnhancedEffect","findComponent","isAdvanceMode","style","_sstyled","insert","reactToText","getOriginChildren","pick","defaultTooltipProps","createMeasurerElement","element","styleElement","window","getComputedStyle","temporaryElement","document","createElement","display","padding","position","right","bottom","visibility","fontFamily","getPropertyValue","fontSize","fontWeight","innerHTML","isTextOverflowing","multiline","_element$getBoundingC","getBoundingClientRect","currentHeight","height","currentWidth","width","measuringElement","currentSize","initialSize","body","appendChild","concat","whiteSpace","removeChild","forcedAdvancedMode","noAdvancedMode","RootEllipsis","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","_defineProperty","_assertThisInitialized","visible","createRef","setState","showTooltip","_createClass","key","value","_this$asProps$maxLine","asProps","maxLine","textRef","current","getContentProps","ref","getPopperProps","_this$asProps","Children","includeTooltipProps","text","tooltipProps","_objectSpread","children","render","_ref4","SEllipsis","SContainer","SNoTooltipContainer","_this$asProps2","styles","tooltip","trim","containerRect","containerRef","state","advancedContent","Ellipsis","Content","displayName","advanceMode","Popper","_ref2","EllipsisMiddle","cn","_ref3","undefined","handlerVisibleChange","__excludeProps","EllipsisMiddleContext","createContext","props","_ref7","resizeElement","_useState","symbolWidth","_useState2","_slicedToArray","dimension","setDimension","blockWidth","node","dateSpan","setAttribute","rect","STail","SBeginning","SContainerMiddle","SAdvancedModeContainerMiddle","displayedSymbols","Math","round","interaction","contextValue","begining","substring","tail","_ref5","Provider","_ref6","_ref10","_ref","arguments[0]","_ref9","Trigger","ellipsisMiddleContext","useContext","_ref8","_assignProps","_assignProps2"],"sources":["../../src/Ellipsis.tsx"],"sourcesContent":["import React, { RefObject, useRef, useMemo, useState } from 'react';\nimport createComponent, { Component, Intergalactic, Root, sstyled } from '@semcore/core';\nimport Tooltip, { TooltipProps } from '@semcore/tooltip';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { useResizeObserver } from './useResizeObserver';\nimport useEnhancedEffect from '@semcore/utils/lib/use/useEnhancedEffect';\nimport findComponent, { isAdvanceMode } from '@semcore/utils/lib/findComponent';\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\n containerRef?: RefObject<HTMLDivElement>;\n includeTooltipProps?: string[];\n __excludeProps?: string[];\n};\n\ntype AsPropsMiddle = {\n text: string;\n tooltip?: boolean;\n styles?: React.CSSProperties;\n containerRect?: { width: number };\n\n containerRef?: RefObject<HTMLDivElement>;\n tooltipProps: TooltipProps;\n children?: React.ReactNode;\n advanceMode?: boolean;\n};\n\ntype EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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<HTMLDivElement>;\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\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: HTMLDivElement) => {\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: HTMLDivElement, 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;\n let 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\nconst forcedAdvancedMode = { forcedAdvancedMode: true } as any;\nconst noAdvancedMode = {} as any;\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 __excludeProps: ['title'],\n };\n\n state = {\n visible: false,\n };\n\n textRef = React.createRef<HTMLDivElement>();\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 getContentProps() {\n return {\n ref: this.textRef,\n maxLine: this.asProps.maxLine,\n };\n }\n\n getPopperProps() {\n const { Children, includeTooltipProps } = this.asProps;\n const text = reactToText(getOriginChildren(Children));\n const tooltipProps = pick(this.asProps, includeTooltipProps as any) as TooltipProps;\n return { children: text, ...tooltipProps };\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 advancedContent = findComponent(Children, [(Ellipsis as any).Content.displayName]);\n const text = reactToText(advancedContent || getOriginChildren(Children));\n const advanceMode = isAdvanceMode(Children, [\n (Ellipsis as any).Content.displayName,\n (Ellipsis as any).Popper.displayName,\n ]);\n const tooltipProps = pick(this.asProps, includeTooltipProps as any) as TooltipProps;\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 advanceMode={advanceMode}\n >\n <Children />\n </EllipsisMiddle>,\n );\n }\n if (tooltip) {\n return sstyled(styles)(\n <SContainer\n interaction='hover'\n title={!advanceMode ? text : undefined}\n visible={visible}\n onVisibleChange={this.handlerVisibleChange}\n {...tooltipProps}\n {...(advanceMode ? forcedAdvancedMode : noAdvancedMode)}\n >\n {advanceMode ? (\n <Children />\n ) : (\n <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n <Children />\n </SEllipsis>\n )}\n </SContainer>,\n );\n }\n return sstyled(styles)(\n <SNoTooltipContainer>\n {advanceMode ? (\n <Children />\n ) : (\n <SEllipsis render={Box} ref={this.textRef} maxLine={maxLine}>\n <Children />\n </SEllipsis>\n )}\n </SNoTooltipContainer>,\n );\n }\n}\n\nconst EllipsisMiddleContext = React.createContext<null | {\n begining: string;\n tail: string;\n ref: React.RefObject<HTMLElement>;\n}>(null);\n\nconst EllipsisMiddle: React.FC<AsPropsMiddle> = (props) => {\n const {\n styles,\n text,\n tooltip,\n containerRect,\n containerRef,\n tooltipProps,\n children,\n advanceMode,\n } = props;\n const resizeElement = useRef<HTMLDivElement>(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 useEnhancedEffect(() => {\n const node = containerRef?.current || resizeElement?.current;\n if (!node) return;\n\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.getComputedStyle(node, null).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 SAdvancedModeContainerMiddle = Tooltip;\n const displayedSymbols = useMemo(\n () => Math.round(blockWidth / dimension.symbolWidth),\n [blockWidth, dimension.symbolWidth],\n );\n\n const interaction = text.length > displayedSymbols ? 'hover' : 'none';\n const ref = containerRef ?? resizeElement;\n const contextValue = React.useMemo(\n () => ({\n begining: text.substring(0, text.length - displayedSymbols / 2 - 1),\n tail: text.substring(text.length - displayedSymbols / 2 - 1),\n ref,\n }),\n [text, displayedSymbols],\n );\n\n if (advanceMode) {\n return sstyled(styles)(\n <SAdvancedModeContainerMiddle\n interaction={interaction}\n {...tooltipProps}\n {...forcedAdvancedMode}\n >\n <EllipsisMiddleContext.Provider value={contextValue}>\n {children}\n </EllipsisMiddleContext.Provider>\n </SAdvancedModeContainerMiddle>,\n ) as any;\n }\n if (tooltip) {\n return sstyled(styles)(\n <SContainerMiddle\n interaction={interaction}\n title={text as any}\n ref={ref}\n tag={Tooltip}\n __excludeProps={['title']}\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 }\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\ntype EllipsisContentAsProps = {\n styles: any;\n Children: React.FC;\n};\n\nconst Content: React.FC<EllipsisContentAsProps> = ({ styles, Children }) => {\n const SEllipsis = Root;\n const ellipsisMiddleContext = React.useContext(EllipsisMiddleContext);\n const STail = 'span';\n const SBeginning = 'span';\n\n if (ellipsisMiddleContext) {\n const { begining, tail, ref } = ellipsisMiddleContext;\n return sstyled(styles)(\n <SEllipsis render={Tooltip.Trigger} middle-mod ref={ref}>\n <SBeginning>{begining}</SBeginning>\n <STail>{tail}</STail>\n </SEllipsis>,\n ) as any;\n }\n\n return sstyled(styles)(\n <SEllipsis render={Tooltip.Trigger}>\n <Children />\n </SEllipsis>,\n ) as any;\n};\n\nconst Ellipsis = createComponent(RootEllipsis, {\n Content,\n Popper: Tooltip.Popper,\n}) as any as Intergalactic.Component<'div', EllipsisProps> & {\n Content: typeof Box;\n Popper: typeof Tooltip.Popper;\n};\n\nexport default Ellipsis;\n"],"mappings":"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"}
|
package/lib/es6/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { UnknownProperties, Intergalactic } from '@semcore/core';\nimport { RefObject } from 'react';\nimport { BoxProps } from '@semcore/flex-box';\nimport { TooltipProps } from '@semcore/tooltip';\n\n/** @deprecated */\nexport interface IEllipsisProps extends EllipsisProps, UnknownProperties {}\nexport type EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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 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: Intergalactic.Component<'div', EllipsisProps
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { UnknownProperties, Intergalactic } from '@semcore/core';\nimport { RefObject } from 'react';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport Tooltip, { TooltipProps } from '@semcore/tooltip';\n\n/** @deprecated */\nexport interface IEllipsisProps extends EllipsisProps, UnknownProperties {}\nexport type EllipsisProps = BoxProps &\n Partial<TooltipProps> & {\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 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: Intergalactic.Component<'div', EllipsisProps> & {\n Content: typeof Box;\n Popper: typeof Tooltip.Popper;\n};\n\nexport { useResizeObserver };\nexport default Ellipsis;\n"],"mappings":""}
|
|
@@ -13,6 +13,11 @@ SEllipsis {
|
|
|
13
13
|
white-space: nowrap;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
+
SEllipsis[middle-mod] {
|
|
17
|
+
display: flex;
|
|
18
|
+
overflow: hidden;
|
|
19
|
+
}
|
|
20
|
+
|
|
16
21
|
SEllipsis[maxLine] {
|
|
17
22
|
display: -webkit-box;
|
|
18
23
|
-webkit-line-clamp: var(--maxLine);
|
|
@@ -23,4 +28,4 @@ SEllipsis[maxLine] {
|
|
|
23
28
|
|
|
24
29
|
STail {
|
|
25
30
|
white-space: nowrap;
|
|
26
|
-
}
|
|
31
|
+
}
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { UnknownProperties, Intergalactic } from '@semcore/core';
|
|
2
2
|
import { RefObject } from 'react';
|
|
3
|
-
import { BoxProps } from '@semcore/flex-box';
|
|
4
|
-
import { TooltipProps } from '@semcore/tooltip';
|
|
3
|
+
import { Box, BoxProps } from '@semcore/flex-box';
|
|
4
|
+
import Tooltip, { TooltipProps } from '@semcore/tooltip';
|
|
5
5
|
|
|
6
6
|
/** @deprecated */
|
|
7
7
|
export interface IEllipsisProps extends EllipsisProps, UnknownProperties {}
|
|
@@ -41,7 +41,10 @@ declare const useResizeObserver: (
|
|
|
41
41
|
hookOverride?: { width: number },
|
|
42
42
|
) => { width: number };
|
|
43
43
|
|
|
44
|
-
declare const Ellipsis: Intergalactic.Component<'div', EllipsisProps
|
|
44
|
+
declare const Ellipsis: Intergalactic.Component<'div', EllipsisProps> & {
|
|
45
|
+
Content: typeof Box;
|
|
46
|
+
Popper: typeof Tooltip.Popper;
|
|
47
|
+
};
|
|
45
48
|
|
|
46
49
|
export { useResizeObserver };
|
|
47
50
|
export default Ellipsis;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/ellipsis",
|
|
3
3
|
"description": "Semrush Ellipsis Component",
|
|
4
|
-
"version": "2.
|
|
4
|
+
"version": "2.5.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"@semcore/utils": "4.4.1",
|
|
13
13
|
"@semcore/flex-box": "5.4.1",
|
|
14
|
-
"@semcore/tooltip": "6.
|
|
14
|
+
"@semcore/tooltip": "6.5.0"
|
|
15
15
|
},
|
|
16
16
|
"peerDependencies": {
|
|
17
17
|
"@semcore/core": "^2.4.1-prerelease.0",
|