lkd-web-kit 0.7.16 → 0.7.18
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/InfinityLoadMoreButton/index.cjs +7 -12
- package/dist/components/InfinityLoadMoreButton/index.js +7 -12
- package/dist/components/InfinitySelect/index.cjs +2 -6
- package/dist/components/InfinitySelect/index.js +2 -6
- package/dist/components/MyMultiSelect/index.cjs +1 -7
- package/dist/components/MyMultiSelect/index.js +1 -7
- package/dist/contexts/NavigationHistoryContext/hook.cjs +5 -6
- package/dist/contexts/NavigationHistoryContext/hook.js +1 -2
- package/dist/index.d.ts +2 -2
- package/package.json +5 -4
|
@@ -19,29 +19,24 @@ const InfinityLoadMoreButton = ({
|
|
|
19
19
|
rootMargin: "0px 0px 0px 0px",
|
|
20
20
|
threshold: 0.5
|
|
21
21
|
});
|
|
22
|
-
const {
|
|
23
|
-
loadMore = "Cargar más",
|
|
24
|
-
loading = "Cargando...",
|
|
25
|
-
end = "Fin de la lista"
|
|
26
|
-
} = labels || {};
|
|
22
|
+
const { loadMore = "Cargar más", loading = "Cargando...", end = "Fin de la lista" } = labels || {};
|
|
27
23
|
const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
|
|
28
24
|
React.useEffect(() => {
|
|
29
|
-
if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting)
|
|
30
|
-
fetchNextPage();
|
|
25
|
+
if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
|
|
31
26
|
}, [entry?.isIntersecting]);
|
|
27
|
+
const showLoader = infinity.isLoading || infinity.isFetchingNextPage;
|
|
28
|
+
const showEndMessage = infinity.data && infinity.data.pages.length > 1 && !infinity.hasNextPage;
|
|
29
|
+
if (showLoader && !showEndMessage) return null;
|
|
32
30
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
33
31
|
core.Button,
|
|
34
32
|
{
|
|
35
33
|
ref,
|
|
36
34
|
onClick: () => fetchNextPage(),
|
|
37
|
-
className: clsx(
|
|
38
|
-
(!hasNextPage || isFetchingNextPage) && "pointer-events-none",
|
|
39
|
-
"font-medium"
|
|
40
|
-
),
|
|
35
|
+
className: clsx((!hasNextPage || isFetchingNextPage) && "pointer-events-none", "font-medium"),
|
|
41
36
|
variant: "transparent",
|
|
42
37
|
color: !hasNextPage ? "gray" : void 0,
|
|
43
38
|
...props,
|
|
44
|
-
children:
|
|
39
|
+
children: showLoader ? loading : hasNextPage ? loadMore : end
|
|
45
40
|
}
|
|
46
41
|
);
|
|
47
42
|
};
|
|
@@ -15,29 +15,24 @@ const InfinityLoadMoreButton = ({
|
|
|
15
15
|
rootMargin: "0px 0px 0px 0px",
|
|
16
16
|
threshold: 0.5
|
|
17
17
|
});
|
|
18
|
-
const {
|
|
19
|
-
loadMore = "Cargar más",
|
|
20
|
-
loading = "Cargando...",
|
|
21
|
-
end = "Fin de la lista"
|
|
22
|
-
} = labels || {};
|
|
18
|
+
const { loadMore = "Cargar más", loading = "Cargando...", end = "Fin de la lista" } = labels || {};
|
|
23
19
|
const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
|
|
24
20
|
useEffect(() => {
|
|
25
|
-
if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting)
|
|
26
|
-
fetchNextPage();
|
|
21
|
+
if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
|
|
27
22
|
}, [entry?.isIntersecting]);
|
|
23
|
+
const showLoader = infinity.isLoading || infinity.isFetchingNextPage;
|
|
24
|
+
const showEndMessage = infinity.data && infinity.data.pages.length > 1 && !infinity.hasNextPage;
|
|
25
|
+
if (showLoader && !showEndMessage) return null;
|
|
28
26
|
return /* @__PURE__ */ jsx(
|
|
29
27
|
Button,
|
|
30
28
|
{
|
|
31
29
|
ref,
|
|
32
30
|
onClick: () => fetchNextPage(),
|
|
33
|
-
className: clsx(
|
|
34
|
-
(!hasNextPage || isFetchingNextPage) && "pointer-events-none",
|
|
35
|
-
"font-medium"
|
|
36
|
-
),
|
|
31
|
+
className: clsx((!hasNextPage || isFetchingNextPage) && "pointer-events-none", "font-medium"),
|
|
37
32
|
variant: "transparent",
|
|
38
33
|
color: !hasNextPage ? "gray" : void 0,
|
|
39
34
|
...props,
|
|
40
|
-
children:
|
|
35
|
+
children: showLoader ? loading : hasNextPage ? loadMore : end
|
|
41
36
|
}
|
|
42
37
|
);
|
|
43
38
|
};
|
|
@@ -106,8 +106,7 @@ function InfinitySelect({
|
|
|
106
106
|
handleSearch(event.currentTarget.value);
|
|
107
107
|
} : void 0,
|
|
108
108
|
onClick: (event) => {
|
|
109
|
-
if (!props.readOnly)
|
|
110
|
-
searchable ? combobox.openDropdown() : combobox.toggleDropdown();
|
|
109
|
+
if (!props.readOnly) searchable ? combobox.openDropdown() : combobox.toggleDropdown();
|
|
111
110
|
props.onClick?.(event);
|
|
112
111
|
},
|
|
113
112
|
onFocus: (event) => {
|
|
@@ -135,10 +134,7 @@ function InfinitySelect({
|
|
|
135
134
|
children: data.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
136
135
|
/* @__PURE__ */ jsxRuntime.jsx("div", { ...virtualStyles.getVirtualContainerProps(virtualizer), children: virtualizer.getVirtualItems().map((virtualItem) => {
|
|
137
136
|
const option = data[virtualItem.index];
|
|
138
|
-
const virtualItemProps = virtualStyles.getVirtualItemProps(
|
|
139
|
-
virtualItem,
|
|
140
|
-
virtualizer
|
|
141
|
-
);
|
|
137
|
+
const virtualItemProps = virtualStyles.getVirtualItemProps(virtualItem, virtualizer);
|
|
142
138
|
return /* @__PURE__ */ React.createElement(
|
|
143
139
|
core.Combobox.Option,
|
|
144
140
|
{
|
|
@@ -102,8 +102,7 @@ function InfinitySelect({
|
|
|
102
102
|
handleSearch(event.currentTarget.value);
|
|
103
103
|
} : void 0,
|
|
104
104
|
onClick: (event) => {
|
|
105
|
-
if (!props.readOnly)
|
|
106
|
-
searchable ? combobox.openDropdown() : combobox.toggleDropdown();
|
|
105
|
+
if (!props.readOnly) searchable ? combobox.openDropdown() : combobox.toggleDropdown();
|
|
107
106
|
props.onClick?.(event);
|
|
108
107
|
},
|
|
109
108
|
onFocus: (event) => {
|
|
@@ -131,10 +130,7 @@ function InfinitySelect({
|
|
|
131
130
|
children: data.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
132
131
|
/* @__PURE__ */ jsx("div", { ...getVirtualContainerProps(virtualizer), children: virtualizer.getVirtualItems().map((virtualItem) => {
|
|
133
132
|
const option = data[virtualItem.index];
|
|
134
|
-
const virtualItemProps = getVirtualItemProps(
|
|
135
|
-
virtualItem,
|
|
136
|
-
virtualizer
|
|
137
|
-
);
|
|
133
|
+
const virtualItemProps = getVirtualItemProps(virtualItem, virtualizer);
|
|
138
134
|
return /* @__PURE__ */ createElement(
|
|
139
135
|
Combobox.Option,
|
|
140
136
|
{
|
|
@@ -5,12 +5,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
5
5
|
const jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
const core = require('@mantine/core');
|
|
7
7
|
|
|
8
|
-
const MyMultiSelect = (props) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
9
|
-
core.MultiSelect,
|
|
10
|
-
{
|
|
11
|
-
variant: props.readOnly ? "filled" : "default",
|
|
12
|
-
...props
|
|
13
|
-
}
|
|
14
|
-
);
|
|
8
|
+
const MyMultiSelect = (props) => /* @__PURE__ */ jsxRuntime.jsx(core.MultiSelect, { variant: props.readOnly ? "filled" : "default", ...props });
|
|
15
9
|
|
|
16
10
|
exports.MyMultiSelect = MyMultiSelect;
|
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { MultiSelect } from '@mantine/core';
|
|
3
3
|
|
|
4
|
-
const MyMultiSelect = (props) => /* @__PURE__ */ jsx(
|
|
5
|
-
MultiSelect,
|
|
6
|
-
{
|
|
7
|
-
variant: props.readOnly ? "filled" : "default",
|
|
8
|
-
...props
|
|
9
|
-
}
|
|
10
|
-
);
|
|
4
|
+
const MyMultiSelect = (props) => /* @__PURE__ */ jsx(MultiSelect, { variant: props.readOnly ? "filled" : "default", ...props });
|
|
11
5
|
|
|
12
6
|
export { MyMultiSelect };
|
|
@@ -3,14 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
5
|
const navigation = require('next/navigation');
|
|
6
|
-
const router = require('next/router');
|
|
7
6
|
const React = require('react');
|
|
8
7
|
const index = require('./index.cjs');
|
|
9
8
|
|
|
10
9
|
const QP_BACK_URL_NAME = "backUrl";
|
|
11
10
|
function useNavigationHistory() {
|
|
12
11
|
const context = React.useContext(index.NavigationHistoryContext);
|
|
13
|
-
const router
|
|
12
|
+
const router = navigation.useRouter();
|
|
14
13
|
if (!context) {
|
|
15
14
|
throw new Error("useNavigationHistory debe usarse dentro de un NavigationHistoryProvider");
|
|
16
15
|
}
|
|
@@ -19,20 +18,20 @@ function useNavigationHistory() {
|
|
|
19
18
|
const goBack = (fallback) => {
|
|
20
19
|
const returnUrl = searchParams.get(QP_BACK_URL_NAME);
|
|
21
20
|
if (returnUrl) {
|
|
22
|
-
router
|
|
21
|
+
router.push(returnUrl);
|
|
23
22
|
return;
|
|
24
23
|
}
|
|
25
24
|
if (history.length <= 1) {
|
|
26
|
-
router
|
|
25
|
+
router.push(fallback ?? "/");
|
|
27
26
|
return;
|
|
28
27
|
}
|
|
29
28
|
const previousRoute = history[history.length - 2];
|
|
30
29
|
const currentRoute = history[history.length - 1];
|
|
31
30
|
if (history.length >= 3 && history[history.length - 3] === currentRoute) {
|
|
32
|
-
router
|
|
31
|
+
router.push(fallback ?? "/");
|
|
33
32
|
return;
|
|
34
33
|
}
|
|
35
|
-
router
|
|
34
|
+
router.push(previousRoute ?? "/");
|
|
36
35
|
};
|
|
37
36
|
return {
|
|
38
37
|
history,
|
package/dist/index.d.ts
CHANGED
|
@@ -320,7 +320,7 @@ 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, ...props }: InfinityLoadMoreButtonProps<T>) => JSX.Element | null;
|
|
324
324
|
|
|
325
325
|
export declare interface InfinityLoadMoreButtonProps<T> extends ButtonProps {
|
|
326
326
|
infinity: InfiniteQueryHookResult<InfiniteData<{
|
|
@@ -336,7 +336,7 @@ export declare interface InfinityLoadMoreButtonProps<T> extends ButtonProps {
|
|
|
336
336
|
|
|
337
337
|
export declare function InfinitySelect<T = unknown>({ value, searchValue, defaultSearchValue, nothingFoundMessage, infinity, defaultValue, onChange, onSearchChange, renderOption, onOptionSubmit, getOptionLabel, getOptionValue, onSelectedOptionChange, selectedOption, comboboxProps, searchable, defaultSelectedOption, loadMoreButtonProps, ...props }: InfinitySelectProps<T>): JSX.Element;
|
|
338
338
|
|
|
339
|
-
export declare interface InfinitySelectProps<T = unknown> extends InputBaseProps, ElementProps<
|
|
339
|
+
export declare interface InfinitySelectProps<T = unknown> extends InputBaseProps, ElementProps<'input', keyof InputBaseProps | 'value' | 'onChange'> {
|
|
340
340
|
value?: string | null;
|
|
341
341
|
defaultValue?: string;
|
|
342
342
|
searchValue?: string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "lkd-web-kit",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.18",
|
|
4
4
|
"description": "A template for creating React component libraries with Vite.",
|
|
5
5
|
"author": "LKD",
|
|
6
6
|
"license": "MIT",
|
|
@@ -23,11 +23,12 @@
|
|
|
23
23
|
"test": "vitest run",
|
|
24
24
|
"test:watch": "vitest",
|
|
25
25
|
"build": "tsc && vite build",
|
|
26
|
-
"lint": "
|
|
27
|
-
"format": "
|
|
26
|
+
"lint": "biome check",
|
|
27
|
+
"format": "biome format --write",
|
|
28
28
|
"prepublishOnly": "npm run build"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
+
"@biomejs/biome": "2.3.7",
|
|
31
32
|
"@testing-library/jest-dom": "^6.8.0",
|
|
32
33
|
"@testing-library/react": "^16.3.0",
|
|
33
34
|
"@testing-library/user-event": "^14.6.1",
|
|
@@ -70,4 +71,4 @@
|
|
|
70
71
|
"dependencies": {
|
|
71
72
|
"@tanstack/react-virtual": "^3.13.12"
|
|
72
73
|
}
|
|
73
|
-
}
|
|
74
|
+
}
|