lecom-ui 5.4.28 → 5.4.29
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/dist/components/TagInput/TagInput.js +36 -12
- package/dist/index.d.ts +1 -1
- package/package.json +2 -2
|
@@ -13,15 +13,31 @@ function TagItem({ item, onRemove, readOnly }) {
|
|
|
13
13
|
},
|
|
14
14
|
[item.value, onRemove]
|
|
15
15
|
);
|
|
16
|
-
return /* @__PURE__ */ React.createElement(
|
|
17
|
-
|
|
16
|
+
return /* @__PURE__ */ React.createElement(
|
|
17
|
+
Tag,
|
|
18
18
|
{
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
"
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
19
|
+
"data-tag": "true",
|
|
20
|
+
color: "blue",
|
|
21
|
+
className: "max-w-[15.625rem] h-6 !px-2 !py-0.5"
|
|
22
|
+
},
|
|
23
|
+
/* @__PURE__ */ React.createElement(
|
|
24
|
+
Typography,
|
|
25
|
+
{
|
|
26
|
+
variant: "body-small-400",
|
|
27
|
+
className: "text-blue-600 truncate p-0"
|
|
28
|
+
},
|
|
29
|
+
item.label
|
|
30
|
+
),
|
|
31
|
+
!readOnly && /* @__PURE__ */ React.createElement(
|
|
32
|
+
X,
|
|
33
|
+
{
|
|
34
|
+
className: "w-4 h-4 cursor-pointer flex-shrink-0",
|
|
35
|
+
onClick: handleRemove,
|
|
36
|
+
"aria-label": `Remover ${item.label}`,
|
|
37
|
+
tabIndex: 0
|
|
38
|
+
}
|
|
39
|
+
)
|
|
40
|
+
);
|
|
25
41
|
}
|
|
26
42
|
function HiddenCountTag({ count }) {
|
|
27
43
|
return /* @__PURE__ */ React.createElement(Tag, { color: "blue", "data-tag": "true" }, /* @__PURE__ */ React.createElement(Typography, { variant: "body-small-400", className: "text-blue-600" }, "+", count));
|
|
@@ -69,7 +85,8 @@ function useDynamicMaxCount(ref, value, maxDisplayCount) {
|
|
|
69
85
|
const [maxLines, setMaxLines] = React.useState(null);
|
|
70
86
|
const hasCalculatedMaxLines = React.useRef(false);
|
|
71
87
|
React.useEffect(() => {
|
|
72
|
-
if (hasCalculatedMaxLines.current || !ref.current || value.length === 0)
|
|
88
|
+
if (hasCalculatedMaxLines.current || !ref.current || value.length === 0)
|
|
89
|
+
return;
|
|
73
90
|
const calculateMaxLines = () => {
|
|
74
91
|
if (!ref.current) {
|
|
75
92
|
setTimeout(calculateMaxLines, 10);
|
|
@@ -83,7 +100,10 @@ function useDynamicMaxCount(ref, value, maxDisplayCount) {
|
|
|
83
100
|
const TAG_HEIGHT = 24;
|
|
84
101
|
const CONTAINER_PADDING_VERTICAL = 4;
|
|
85
102
|
const availableHeight = containerHeight - CONTAINER_PADDING_VERTICAL * 2;
|
|
86
|
-
const calculatedMaxLines = Math.max(
|
|
103
|
+
const calculatedMaxLines = Math.max(
|
|
104
|
+
1,
|
|
105
|
+
Math.floor(availableHeight / TAG_HEIGHT)
|
|
106
|
+
);
|
|
87
107
|
setMaxLines(calculatedMaxLines);
|
|
88
108
|
hasCalculatedMaxLines.current = true;
|
|
89
109
|
};
|
|
@@ -126,7 +146,11 @@ function useDynamicMaxCount(ref, value, maxDisplayCount) {
|
|
|
126
146
|
setDynamicMaxCount(value.length);
|
|
127
147
|
return;
|
|
128
148
|
}
|
|
129
|
-
const count = simulateTagLayout(
|
|
149
|
+
const count = simulateTagLayout(
|
|
150
|
+
estimatedWidths,
|
|
151
|
+
availableWidth,
|
|
152
|
+
maxLines
|
|
153
|
+
);
|
|
130
154
|
setDynamicMaxCount(count);
|
|
131
155
|
};
|
|
132
156
|
const rafId = requestAnimationFrame(() => {
|
|
@@ -192,7 +216,7 @@ function TagInput(props) {
|
|
|
192
216
|
style: containerStyles,
|
|
193
217
|
...restProps
|
|
194
218
|
},
|
|
195
|
-
value.length === 0 && /* @__PURE__ */ React.createElement(Typography, { variant: "body-small-400", className: "text-grey-
|
|
219
|
+
value.length === 0 && /* @__PURE__ */ React.createElement(Typography, { variant: "body-small-400", className: "text-grey-500" }, placeholder),
|
|
196
220
|
displayTags.map((item) => /* @__PURE__ */ React.createElement(
|
|
197
221
|
TagItem,
|
|
198
222
|
{
|
package/dist/index.d.ts
CHANGED
|
@@ -992,7 +992,7 @@ declare const RadioGroup: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimi
|
|
|
992
992
|
declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
993
993
|
|
|
994
994
|
declare const ResizablePanelGroup: ({ className, ...props }: React$1.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => React$1.JSX.Element;
|
|
995
|
-
declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLDivElement | HTMLElement | HTMLButtonElement | HTMLOListElement | HTMLLIElement | HTMLAnchorElement | HTMLSpanElement | HTMLHeadingElement | HTMLParagraphElement |
|
|
995
|
+
declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLDivElement | HTMLElement | HTMLButtonElement | HTMLOListElement | HTMLLIElement | HTMLAnchorElement | HTMLSpanElement | HTMLHeadingElement | HTMLParagraphElement | HTMLLabelElement | HTMLInputElement | HTMLUListElement | HTMLObjectElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLLegendElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLVideoElement>, "id" | "onResize"> & {
|
|
996
996
|
className?: string;
|
|
997
997
|
collapsedSize?: number | undefined;
|
|
998
998
|
collapsible?: boolean | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "lecom-ui",
|
|
3
|
-
"version": "5.4.
|
|
3
|
+
"version": "5.4.29",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"hex-color-opacity": "^0.4.2",
|
|
51
51
|
"i18next": "^24.2.2",
|
|
52
52
|
"lucide-react": "^0.488.0",
|
|
53
|
-
"next": "
|
|
53
|
+
"next": "15.5.9",
|
|
54
54
|
"react": ">=18.0.0",
|
|
55
55
|
"react-colorful": "^5.6.1",
|
|
56
56
|
"react-day-picker": "^9.8.0",
|