lkd-web-kit 0.7.24 → 0.7.25
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.
|
@@ -12,6 +12,7 @@ const InfinityLoadMoreButton = ({
|
|
|
12
12
|
infinity,
|
|
13
13
|
labels,
|
|
14
14
|
parentRef,
|
|
15
|
+
loader,
|
|
15
16
|
...props
|
|
16
17
|
}) => {
|
|
17
18
|
const { entry, ref } = hooks.useIntersection({
|
|
@@ -19,7 +20,7 @@ const InfinityLoadMoreButton = ({
|
|
|
19
20
|
rootMargin: "0px 0px 0px 0px",
|
|
20
21
|
threshold: 0.5
|
|
21
22
|
});
|
|
22
|
-
const { loadMore = "Cargar más",
|
|
23
|
+
const { loadMore = "Cargar más", end = "Fin de la lista" } = labels || {};
|
|
23
24
|
const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
|
|
24
25
|
React.useEffect(() => {
|
|
25
26
|
if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
|
|
@@ -30,11 +31,12 @@ const InfinityLoadMoreButton = ({
|
|
|
30
31
|
{
|
|
31
32
|
ref,
|
|
32
33
|
onClick: () => fetchNextPage(),
|
|
33
|
-
|
|
34
|
+
loading: showLoader,
|
|
35
|
+
className: clsx(!hasNextPage && "pointer-events-none", "font-medium"),
|
|
34
36
|
variant: "transparent",
|
|
35
|
-
color: !hasNextPage
|
|
37
|
+
color: !hasNextPage ? "gray" : void 0,
|
|
36
38
|
...props,
|
|
37
|
-
children:
|
|
39
|
+
children: hasNextPage ? loadMore : end
|
|
38
40
|
}
|
|
39
41
|
);
|
|
40
42
|
};
|
|
@@ -8,6 +8,7 @@ const InfinityLoadMoreButton = ({
|
|
|
8
8
|
infinity,
|
|
9
9
|
labels,
|
|
10
10
|
parentRef,
|
|
11
|
+
loader,
|
|
11
12
|
...props
|
|
12
13
|
}) => {
|
|
13
14
|
const { entry, ref } = useIntersection({
|
|
@@ -15,7 +16,7 @@ const InfinityLoadMoreButton = ({
|
|
|
15
16
|
rootMargin: "0px 0px 0px 0px",
|
|
16
17
|
threshold: 0.5
|
|
17
18
|
});
|
|
18
|
-
const { loadMore = "Cargar más",
|
|
19
|
+
const { loadMore = "Cargar más", end = "Fin de la lista" } = labels || {};
|
|
19
20
|
const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
|
|
20
21
|
useEffect(() => {
|
|
21
22
|
if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
|
|
@@ -26,11 +27,12 @@ const InfinityLoadMoreButton = ({
|
|
|
26
27
|
{
|
|
27
28
|
ref,
|
|
28
29
|
onClick: () => fetchNextPage(),
|
|
29
|
-
|
|
30
|
+
loading: showLoader,
|
|
31
|
+
className: clsx(!hasNextPage && "pointer-events-none", "font-medium"),
|
|
30
32
|
variant: "transparent",
|
|
31
|
-
color: !hasNextPage
|
|
33
|
+
color: !hasNextPage ? "gray" : void 0,
|
|
32
34
|
...props,
|
|
33
|
-
children:
|
|
35
|
+
children: hasNextPage ? loadMore : end
|
|
34
36
|
}
|
|
35
37
|
);
|
|
36
38
|
};
|
|
@@ -81,7 +81,7 @@ function InfinitySelect({
|
|
|
81
81
|
}
|
|
82
82
|
},
|
|
83
83
|
onOptionSubmit: (val) => {
|
|
84
|
-
const selectedOption2 = data.find((i) => getOptionValue(i) === val);
|
|
84
|
+
const selectedOption2 = data.find((i) => i && getOptionValue(i) === val);
|
|
85
85
|
if (selectedOption2) {
|
|
86
86
|
setSearchAndValue(selectedOption2);
|
|
87
87
|
handleSelectedOption(selectedOption2);
|
|
@@ -135,6 +135,7 @@ function InfinitySelect({
|
|
|
135
135
|
/* @__PURE__ */ jsxRuntime.jsx("div", { ...virtualStyles.getVirtualContainerProps(virtualizer), children: virtualizer.getVirtualItems().map((virtualItem) => {
|
|
136
136
|
const option = data[virtualItem.index];
|
|
137
137
|
const virtualItemProps = virtualStyles.getVirtualItemProps(virtualItem, virtualizer);
|
|
138
|
+
if (!option) return null;
|
|
138
139
|
return /* @__PURE__ */ React.createElement(
|
|
139
140
|
core.Combobox.Option,
|
|
140
141
|
{
|
|
@@ -77,7 +77,7 @@ function InfinitySelect({
|
|
|
77
77
|
}
|
|
78
78
|
},
|
|
79
79
|
onOptionSubmit: (val) => {
|
|
80
|
-
const selectedOption2 = data.find((i) => getOptionValue(i) === val);
|
|
80
|
+
const selectedOption2 = data.find((i) => i && getOptionValue(i) === val);
|
|
81
81
|
if (selectedOption2) {
|
|
82
82
|
setSearchAndValue(selectedOption2);
|
|
83
83
|
handleSelectedOption(selectedOption2);
|
|
@@ -131,6 +131,7 @@ function InfinitySelect({
|
|
|
131
131
|
/* @__PURE__ */ jsx("div", { ...getVirtualContainerProps(virtualizer), children: virtualizer.getVirtualItems().map((virtualItem) => {
|
|
132
132
|
const option = data[virtualItem.index];
|
|
133
133
|
const virtualItemProps = getVirtualItemProps(virtualItem, virtualizer);
|
|
134
|
+
if (!option) return null;
|
|
134
135
|
return /* @__PURE__ */ createElement(
|
|
135
136
|
Combobox.Option,
|
|
136
137
|
{
|
package/dist/index.d.ts
CHANGED
|
@@ -320,16 +320,16 @@ export declare function indexBy<T, K, C extends string>(arr: T[], getKey: (item:
|
|
|
320
320
|
|
|
321
321
|
export declare type IndexByResult<T> = Record<string, T | undefined>;
|
|
322
322
|
|
|
323
|
-
export declare const InfinityLoadMoreButton: <T>({ infinity, labels, parentRef, ...props }: InfinityLoadMoreButtonProps<T>) => JSX.Element;
|
|
323
|
+
export declare const InfinityLoadMoreButton: <T>({ infinity, labels, parentRef, loader, ...props }: InfinityLoadMoreButtonProps<T>) => JSX.Element;
|
|
324
324
|
|
|
325
325
|
export declare interface InfinityLoadMoreButtonProps<T> extends ButtonProps {
|
|
326
326
|
infinity: InfiniteQueryHookResult<InfiniteData<{
|
|
327
|
-
data
|
|
327
|
+
data?: T[];
|
|
328
328
|
}, number>, Error>;
|
|
329
329
|
parentRef?: RefObject<HTMLElement | null>;
|
|
330
|
+
loader?: React.ReactNode;
|
|
330
331
|
labels?: {
|
|
331
332
|
loadMore?: string;
|
|
332
|
-
loading?: string;
|
|
333
333
|
end?: string;
|
|
334
334
|
};
|
|
335
335
|
}
|
|
@@ -345,7 +345,7 @@ export declare interface InfinitySelectProps<T = unknown> extends InputBaseProps
|
|
|
345
345
|
combobox: ComboboxStore;
|
|
346
346
|
}) => ReactNode);
|
|
347
347
|
infinity: InfiniteQueryHookResult<InfiniteData<{
|
|
348
|
-
data
|
|
348
|
+
data?: T[];
|
|
349
349
|
}, number>, Error>;
|
|
350
350
|
defaultSelectedOption?: T | null;
|
|
351
351
|
selectedOption?: T | null;
|