lecom-ui 5.2.98 → 5.2.99
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.
|
@@ -40,7 +40,7 @@ function HiddenCountTag({
|
|
|
40
40
|
{
|
|
41
41
|
className: "w-4 h-4 cursor-pointer",
|
|
42
42
|
onClick: handleRemove,
|
|
43
|
-
"aria-label":
|
|
43
|
+
"aria-label": "Remover tag oculta",
|
|
44
44
|
tabIndex: 0
|
|
45
45
|
}
|
|
46
46
|
));
|
|
@@ -64,21 +64,17 @@ function useTagVisibility(ref, value) {
|
|
|
64
64
|
(a, b) => a - b
|
|
65
65
|
);
|
|
66
66
|
if (offsetTops.length <= 1) {
|
|
67
|
-
return
|
|
67
|
+
return { visibleCount: totalTags, hiddenCount: 0 };
|
|
68
68
|
}
|
|
69
69
|
const firstLineTop = offsetTops[0];
|
|
70
70
|
const secondLineTop = offsetTops[1];
|
|
71
71
|
let firstLineCount = 0;
|
|
72
72
|
let secondLineCount = 0;
|
|
73
73
|
for (const child of children) {
|
|
74
|
-
if (child.offsetTop === firstLineTop)
|
|
75
|
-
|
|
76
|
-
} else if (child.offsetTop === secondLineTop) {
|
|
77
|
-
secondLineCount++;
|
|
78
|
-
}
|
|
74
|
+
if (child.offsetTop === firstLineTop) firstLineCount++;
|
|
75
|
+
else if (child.offsetTop === secondLineTop) secondLineCount++;
|
|
79
76
|
}
|
|
80
|
-
const
|
|
81
|
-
const visibleCount = firstLineCount + maxSecondLineVisible;
|
|
77
|
+
const visibleCount = firstLineCount + secondLineCount;
|
|
82
78
|
return {
|
|
83
79
|
visibleCount,
|
|
84
80
|
hiddenCount: Math.max(totalTags - visibleCount, 0)
|
|
@@ -101,20 +97,13 @@ function useTagVisibility(ref, value) {
|
|
|
101
97
|
}, [ref, calculateVisibleTags, value.length]);
|
|
102
98
|
React.useLayoutEffect(() => {
|
|
103
99
|
const calculateWhenVisible = () => {
|
|
104
|
-
requestAnimationFrame(() =>
|
|
105
|
-
requestAnimationFrame(() => {
|
|
106
|
-
calculateMaxVisible();
|
|
107
|
-
});
|
|
108
|
-
});
|
|
100
|
+
requestAnimationFrame(() => requestAnimationFrame(calculateMaxVisible));
|
|
109
101
|
};
|
|
102
|
+
calculateWhenVisible();
|
|
110
103
|
const observer = new IntersectionObserver((entries) => {
|
|
111
|
-
if (entries.some((entry) => entry.isIntersecting))
|
|
112
|
-
calculateWhenVisible();
|
|
113
|
-
}
|
|
114
|
-
});
|
|
115
|
-
const resizeObserver = new ResizeObserver(() => {
|
|
116
|
-
calculateMaxVisible();
|
|
104
|
+
if (entries.some((entry) => entry.isIntersecting)) calculateWhenVisible();
|
|
117
105
|
});
|
|
106
|
+
const resizeObserver = new ResizeObserver(calculateMaxVisible);
|
|
118
107
|
if (ref.current) {
|
|
119
108
|
observer.observe(ref.current);
|
|
120
109
|
resizeObserver.observe(ref.current);
|
|
@@ -125,9 +114,7 @@ function useTagVisibility(ref, value) {
|
|
|
125
114
|
};
|
|
126
115
|
}, [value, calculateMaxVisible, ref]);
|
|
127
116
|
React.useEffect(() => {
|
|
128
|
-
const timeout = setTimeout(
|
|
129
|
-
calculateMaxVisible();
|
|
130
|
-
}, 150);
|
|
117
|
+
const timeout = setTimeout(calculateMaxVisible, 150);
|
|
131
118
|
return () => clearTimeout(timeout);
|
|
132
119
|
}, [value.length, calculateMaxVisible]);
|
|
133
120
|
return { maxVisibleCount, hiddenCount };
|
|
@@ -164,18 +151,13 @@ function TagInput(props) {
|
|
|
164
151
|
}),
|
|
165
152
|
[disabled, actualHiddenCount]
|
|
166
153
|
);
|
|
167
|
-
const showPlaceholder = value.length === 0;
|
|
168
|
-
const showHiddenCount = actualHiddenCount > 0;
|
|
169
154
|
const handleRemove = React.useCallback(
|
|
170
|
-
(valueToRemove) =>
|
|
171
|
-
onRemove(valueToRemove);
|
|
172
|
-
},
|
|
155
|
+
(valueToRemove) => onRemove(valueToRemove),
|
|
173
156
|
[onRemove]
|
|
174
157
|
);
|
|
175
158
|
const handleRemoveHidden = React.useCallback(() => {
|
|
176
159
|
if (value.length > visibleCount) {
|
|
177
|
-
const
|
|
178
|
-
const tagToRemove = value[lastVisibleIndex];
|
|
160
|
+
const tagToRemove = value[visibleCount];
|
|
179
161
|
if (tagToRemove) {
|
|
180
162
|
onRemove(tagToRemove.value);
|
|
181
163
|
}
|
|
@@ -191,7 +173,7 @@ function TagInput(props) {
|
|
|
191
173
|
style: containerStyles,
|
|
192
174
|
...restProps
|
|
193
175
|
},
|
|
194
|
-
|
|
176
|
+
value.length === 0 && /* @__PURE__ */ React.createElement(Typography, { variant: "body-small-400", className: "text-grey-400" }, placeholder),
|
|
195
177
|
displayTags.map((item) => /* @__PURE__ */ React.createElement(
|
|
196
178
|
TagItem,
|
|
197
179
|
{
|
|
@@ -201,7 +183,7 @@ function TagInput(props) {
|
|
|
201
183
|
readOnly
|
|
202
184
|
}
|
|
203
185
|
)),
|
|
204
|
-
|
|
186
|
+
actualHiddenCount > 0 && /* @__PURE__ */ React.createElement(
|
|
205
187
|
HiddenCountTag,
|
|
206
188
|
{
|
|
207
189
|
count: actualHiddenCount,
|