lkd-web-kit 0.7.31 → 0.8.1

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.
Files changed (135) hide show
  1. package/dist/_virtual/_rolldown/runtime.cjs +23 -0
  2. package/dist/components/EmptyState/index.cjs +38 -52
  3. package/dist/components/EmptyState/index.js +37 -48
  4. package/dist/components/Icon.cjs +46 -50
  5. package/dist/components/Icon.js +44 -46
  6. package/dist/components/InfinityLoadMoreButton/index.cjs +30 -42
  7. package/dist/components/InfinityLoadMoreButton/index.js +28 -38
  8. package/dist/components/InfinitySelect/index.cjs +126 -168
  9. package/dist/components/InfinitySelect/index.js +125 -164
  10. package/dist/components/MyCheckboxGroup/index.cjs +14 -22
  11. package/dist/components/MyCheckboxGroup/index.js +13 -18
  12. package/dist/components/MyDateInput/index.cjs +12 -18
  13. package/dist/components/MyDateInput/index.js +11 -14
  14. package/dist/components/MyDatePickerInput/CalendarIcon.cjs +45 -64
  15. package/dist/components/MyDatePickerInput/CalendarIcon.js +43 -61
  16. package/dist/components/MyDatePickerInput/index.cjs +12 -18
  17. package/dist/components/MyDatePickerInput/index.js +11 -14
  18. package/dist/components/MyDateTimePicker/index.cjs +12 -18
  19. package/dist/components/MyDateTimePicker/index.js +11 -14
  20. package/dist/components/MyMonthPickerInput/index.cjs +12 -18
  21. package/dist/components/MyMonthPickerInput/index.js +11 -14
  22. package/dist/components/MyMultiSelect/index.cjs +9 -9
  23. package/dist/components/MyMultiSelect/index.js +8 -5
  24. package/dist/components/MyNotifications/index.cjs +11 -16
  25. package/dist/components/MyNotifications/index.js +10 -12
  26. package/dist/components/MyNumberInput/index.cjs +9 -15
  27. package/dist/components/MyNumberInput/index.js +8 -11
  28. package/dist/components/MyRadioGroup/index.cjs +14 -22
  29. package/dist/components/MyRadioGroup/index.js +13 -18
  30. package/dist/components/MySelect/index.cjs +9 -15
  31. package/dist/components/MySelect/index.js +8 -11
  32. package/dist/components/MyTextInput/index.cjs +9 -15
  33. package/dist/components/MyTextInput/index.js +8 -11
  34. package/dist/components/MyTextarea/index.cjs +9 -15
  35. package/dist/components/MyTextarea/index.js +8 -11
  36. package/dist/components/MyTimeInput/index.cjs +9 -15
  37. package/dist/components/MyTimeInput/index.js +8 -11
  38. package/dist/components/NavItems.cjs +28 -38
  39. package/dist/components/NavItems.js +26 -34
  40. package/dist/consts/http-status.cjs +66 -69
  41. package/dist/consts/http-status.js +66 -65
  42. package/dist/consts/revalidate.cjs +10 -13
  43. package/dist/consts/revalidate.js +10 -9
  44. package/dist/contexts/NavigationHistoryContext/hook.cjs +41 -42
  45. package/dist/contexts/NavigationHistoryContext/hook.js +40 -38
  46. package/dist/contexts/NavigationHistoryContext/index.cjs +31 -28
  47. package/dist/contexts/NavigationHistoryContext/index.js +30 -24
  48. package/dist/contexts/PageDataContext/index.cjs +15 -18
  49. package/dist/contexts/PageDataContext/index.js +14 -14
  50. package/dist/form/Form.cjs +19 -28
  51. package/dist/form/Form.js +18 -24
  52. package/dist/form/FormSubmitButton.cjs +15 -27
  53. package/dist/form/FormSubmitButton.js +14 -23
  54. package/dist/form/base/FormCheckbox.cjs +15 -23
  55. package/dist/form/base/FormCheckbox.js +14 -19
  56. package/dist/form/base/FormCheckboxGroup.cjs +10 -16
  57. package/dist/form/base/FormCheckboxGroup.js +9 -12
  58. package/dist/form/base/FormDateInput.cjs +10 -16
  59. package/dist/form/base/FormDateInput.js +9 -12
  60. package/dist/form/base/FormDatePickerInput.cjs +10 -16
  61. package/dist/form/base/FormDatePickerInput.js +9 -12
  62. package/dist/form/base/FormDateTimePicker.cjs +10 -16
  63. package/dist/form/base/FormDateTimePicker.js +9 -12
  64. package/dist/form/base/FormMonthPickerInput.cjs +10 -16
  65. package/dist/form/base/FormMonthPickerInput.js +9 -12
  66. package/dist/form/base/FormMultiSelect.cjs +10 -16
  67. package/dist/form/base/FormMultiSelect.js +9 -12
  68. package/dist/form/base/FormNumberInput.cjs +12 -16
  69. package/dist/form/base/FormNumberInput.js +10 -12
  70. package/dist/form/base/FormRadioGroup.cjs +10 -16
  71. package/dist/form/base/FormRadioGroup.js +9 -12
  72. package/dist/form/base/FormSelect.cjs +10 -16
  73. package/dist/form/base/FormSelect.js +9 -12
  74. package/dist/form/base/FormSelectInfinity.cjs +15 -21
  75. package/dist/form/base/FormSelectInfinity.js +14 -17
  76. package/dist/form/base/FormTextInput.cjs +10 -16
  77. package/dist/form/base/FormTextInput.js +9 -12
  78. package/dist/form/base/FormTextarea.cjs +10 -10
  79. package/dist/form/base/FormTextarea.js +9 -6
  80. package/dist/form/base/FormTimeInput.cjs +18 -24
  81. package/dist/form/base/FormTimeInput.js +17 -20
  82. package/dist/form/utils/nullable-but-required.cjs +14 -17
  83. package/dist/form/utils/nullable-but-required.js +13 -13
  84. package/dist/form/utils/optional-but-required.cjs +14 -17
  85. package/dist/form/utils/optional-but-required.js +13 -13
  86. package/dist/form/utils/zodValidator.cjs +9 -13
  87. package/dist/form/utils/zodValidator.js +9 -9
  88. package/dist/hocs/withController.cjs +43 -54
  89. package/dist/hocs/withController.js +42 -50
  90. package/dist/hocs/withModalManager.cjs +29 -35
  91. package/dist/hocs/withModalManager.js +28 -31
  92. package/dist/hooks/useBreakpoint.cjs +8 -12
  93. package/dist/hooks/useBreakpoint.js +7 -8
  94. package/dist/hooks/useFetchNextPageOnScroll.cjs +13 -21
  95. package/dist/hooks/useFetchNextPageOnScroll.js +13 -17
  96. package/dist/hooks/useOnScrollProgress.cjs +33 -37
  97. package/dist/hooks/useOnScrollProgress.js +32 -33
  98. package/dist/hooks/useUpdateSearchParams.cjs +22 -22
  99. package/dist/hooks/useUpdateSearchParams.js +21 -18
  100. package/dist/hooks/useZodConfig.cjs +14 -19
  101. package/dist/hooks/useZodConfig.js +12 -15
  102. package/dist/index.cjs +130 -136
  103. package/dist/index.d.ts +14 -16
  104. package/dist/index.js +62 -61
  105. package/dist/mantine/breakpoints-with-px.cjs +9 -12
  106. package/dist/mantine/breakpoints-with-px.js +9 -8
  107. package/dist/mantine/my-default-theme.cjs +23 -41
  108. package/dist/mantine/my-default-theme.js +22 -37
  109. package/dist/mantine/to-tailwind-colors.cjs +9 -18
  110. package/dist/mantine/to-tailwind-colors.js +9 -14
  111. package/dist/node_modules/@tanstack/react-virtual/dist/esm/index.cjs +35 -70
  112. package/dist/node_modules/@tanstack/react-virtual/dist/esm/index.js +34 -42
  113. package/dist/node_modules/@tanstack/virtual-core/dist/esm/index.cjs +700 -811
  114. package/dist/node_modules/@tanstack/virtual-core/dist/esm/index.js +701 -804
  115. package/dist/node_modules/@tanstack/virtual-core/dist/esm/utils.cjs +44 -64
  116. package/dist/node_modules/@tanstack/virtual-core/dist/esm/utils.js +44 -60
  117. package/dist/utils/array/groupBy.cjs +30 -40
  118. package/dist/utils/array/groupBy.js +30 -36
  119. package/dist/utils/array/shuffleArray.cjs +11 -17
  120. package/dist/utils/array/shuffleArray.js +11 -13
  121. package/dist/utils/formatBytes.cjs +12 -11
  122. package/dist/utils/formatBytes.js +12 -7
  123. package/dist/utils/isInfinityEmpty.cjs +3 -6
  124. package/dist/utils/isInfinityEmpty.js +3 -2
  125. package/dist/utils/ky/addBodyJsonHook.cjs +9 -10
  126. package/dist/utils/ky/addBodyJsonHook.js +8 -6
  127. package/dist/utils/ky/parseJson.cjs +6 -9
  128. package/dist/utils/ky/parseJson.js +6 -5
  129. package/dist/utils/new-route.cjs +30 -39
  130. package/dist/utils/new-route.js +30 -35
  131. package/dist/utils/query-stringify.cjs +5 -8
  132. package/dist/utils/query-stringify.js +5 -4
  133. package/dist/utils/virtual-styles.cjs +21 -26
  134. package/dist/utils/virtual-styles.js +21 -22
  135. package/package.json +67 -65
@@ -0,0 +1,23 @@
1
+ //#region \0rolldown/runtime.js
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __copyProps = (to, from, except, desc) => {
9
+ if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
10
+ key = keys[i];
11
+ if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
12
+ get: ((k) => from[k]).bind(null, key),
13
+ enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
14
+ });
15
+ }
16
+ return to;
17
+ };
18
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
19
+ value: mod,
20
+ enumerable: true
21
+ }) : target, mod));
22
+ //#endregion
23
+ exports.__toESM = __toESM;
@@ -1,55 +1,41 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
-
5
- const jsxRuntime = require('react/jsx-runtime');
6
- const Icon = require('../Icon.cjs');
7
- const core = require('@mantine/core');
8
-
9
- const pxBySize = {
10
- sm: 48,
11
- md: 60,
12
- lg: 84
1
+ require("../../../_virtual/_rolldown/runtime.cjs");
2
+ const require_Icon = require("../Icon.cjs");
3
+ let react_jsx_runtime = require("react/jsx-runtime");
4
+ let _mantine_core = require("@mantine/core");
5
+ //#region src/components/EmptyState/index.tsx
6
+ var pxBySize = {
7
+ sm: 48,
8
+ md: 60,
9
+ lg: 84
13
10
  };
14
- const EmptyState = ({ label, action, icon, size = "md", ...props }) => {
15
- const { colors } = core.useMantineTheme();
16
- return /* @__PURE__ */ jsxRuntime.jsxs(
17
- "div",
18
- {
19
- style: {
20
- display: "flex",
21
- flexDirection: "column",
22
- alignItems: "center",
23
- justifyContent: "center",
24
- gap: 4
25
- },
26
- ...props,
27
- children: [
28
- icon && /* @__PURE__ */ jsxRuntime.jsx(
29
- Icon.Icon,
30
- {
31
- i: icon,
32
- size: pxBySize[size],
33
- style: {
34
- color: colors.gray[2]
35
- }
36
- }
37
- ),
38
- /* @__PURE__ */ jsxRuntime.jsx(
39
- core.Text,
40
- {
41
- c: "gray.6",
42
- style: {
43
- fontSize: 14,
44
- fontWeight: 600
45
- },
46
- children: label
47
- }
48
- ),
49
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: action })
50
- ]
51
- }
52
- );
11
+ var EmptyState = ({ label, action, icon, size = "md", ...props }) => {
12
+ const { colors } = (0, _mantine_core.useMantineTheme)();
13
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
14
+ style: {
15
+ display: "flex",
16
+ flexDirection: "column",
17
+ alignItems: "center",
18
+ justifyContent: "center",
19
+ gap: 4
20
+ },
21
+ ...props,
22
+ children: [
23
+ icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Icon.Icon, {
24
+ i: icon,
25
+ size: pxBySize[size],
26
+ style: { color: colors.gray[2] }
27
+ }),
28
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Text, {
29
+ c: "gray.6",
30
+ style: {
31
+ fontSize: 14,
32
+ fontWeight: 600
33
+ },
34
+ children: label
35
+ }),
36
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: action })
37
+ ]
38
+ });
53
39
  };
54
-
40
+ //#endregion
55
41
  exports.EmptyState = EmptyState;
@@ -1,51 +1,40 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { Icon } from '../Icon.js';
3
- import { useMantineTheme, Text } from '@mantine/core';
4
-
5
- const pxBySize = {
6
- sm: 48,
7
- md: 60,
8
- lg: 84
1
+ import { Icon } from "../Icon.js";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { Text, useMantineTheme } from "@mantine/core";
4
+ //#region src/components/EmptyState/index.tsx
5
+ var pxBySize = {
6
+ sm: 48,
7
+ md: 60,
8
+ lg: 84
9
9
  };
10
- const EmptyState = ({ label, action, icon, size = "md", ...props }) => {
11
- const { colors } = useMantineTheme();
12
- return /* @__PURE__ */ jsxs(
13
- "div",
14
- {
15
- style: {
16
- display: "flex",
17
- flexDirection: "column",
18
- alignItems: "center",
19
- justifyContent: "center",
20
- gap: 4
21
- },
22
- ...props,
23
- children: [
24
- icon && /* @__PURE__ */ jsx(
25
- Icon,
26
- {
27
- i: icon,
28
- size: pxBySize[size],
29
- style: {
30
- color: colors.gray[2]
31
- }
32
- }
33
- ),
34
- /* @__PURE__ */ jsx(
35
- Text,
36
- {
37
- c: "gray.6",
38
- style: {
39
- fontSize: 14,
40
- fontWeight: 600
41
- },
42
- children: label
43
- }
44
- ),
45
- /* @__PURE__ */ jsx("div", { children: action })
46
- ]
47
- }
48
- );
10
+ var EmptyState = ({ label, action, icon, size = "md", ...props }) => {
11
+ const { colors } = useMantineTheme();
12
+ return /* @__PURE__ */ jsxs("div", {
13
+ style: {
14
+ display: "flex",
15
+ flexDirection: "column",
16
+ alignItems: "center",
17
+ justifyContent: "center",
18
+ gap: 4
19
+ },
20
+ ...props,
21
+ children: [
22
+ icon && /* @__PURE__ */ jsx(Icon, {
23
+ i: icon,
24
+ size: pxBySize[size],
25
+ style: { color: colors.gray[2] }
26
+ }),
27
+ /* @__PURE__ */ jsx(Text, {
28
+ c: "gray.6",
29
+ style: {
30
+ fontSize: 14,
31
+ fontWeight: 600
32
+ },
33
+ children: label
34
+ }),
35
+ /* @__PURE__ */ jsx("div", { children: action })
36
+ ]
37
+ });
49
38
  };
50
-
39
+ //#endregion
51
40
  export { EmptyState };
@@ -1,53 +1,49 @@
1
- 'use client';
2
- 'use strict';
3
-
4
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
-
6
- const jsxRuntime = require('react/jsx-runtime');
7
-
8
- const Icon = ({ i: I, size = "md", style, rotate, ...rest }) => {
9
- return /* @__PURE__ */ jsxRuntime.jsx(
10
- I,
11
- {
12
- ...typeof size === "number" ? {
13
- height: size,
14
- width: size
15
- } : stylesBySize[size],
16
- viewBox: "0 0 24 24",
17
- style: {
18
- ...style,
19
- flexShrink: 0,
20
- transform: `rotate(${rotate}deg)`
21
- },
22
- ...rest
23
- }
24
- );
1
+ "use client";
2
+ const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
3
+ let react = require("react");
4
+ react = require_runtime.__toESM(react, 1);
5
+ let react_jsx_runtime = require("react/jsx-runtime");
6
+ //#region src/components/Icon.tsx
7
+ var Icon = ({ i: I, size = "md", style, rotate, ...rest }) => {
8
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(I, {
9
+ ...typeof size === "number" ? {
10
+ height: size,
11
+ width: size
12
+ } : stylesBySize[size],
13
+ viewBox: "0 0 24 24",
14
+ style: {
15
+ ...style,
16
+ flexShrink: 0,
17
+ transform: `rotate(${rotate}deg)`
18
+ },
19
+ ...rest
20
+ });
25
21
  };
26
- const stylesBySize = {
27
- xs: {
28
- height: 16,
29
- width: 16
30
- },
31
- sm: {
32
- height: 20,
33
- width: 20
34
- },
35
- md: {
36
- height: 24,
37
- width: 24
38
- },
39
- lg: {
40
- height: 28,
41
- width: 28
42
- },
43
- xl: {
44
- height: 32,
45
- width: 32
46
- },
47
- ["2xl"]: {
48
- height: 40,
49
- width: 40
50
- }
22
+ var stylesBySize = {
23
+ xs: {
24
+ height: 16,
25
+ width: 16
26
+ },
27
+ sm: {
28
+ height: 20,
29
+ width: 20
30
+ },
31
+ md: {
32
+ height: 24,
33
+ width: 24
34
+ },
35
+ lg: {
36
+ height: 28,
37
+ width: 28
38
+ },
39
+ xl: {
40
+ height: 32,
41
+ width: 32
42
+ },
43
+ ["2xl"]: {
44
+ height: 40,
45
+ width: 40
46
+ }
51
47
  };
52
-
48
+ //#endregion
53
49
  exports.Icon = Icon;
@@ -1,49 +1,47 @@
1
- 'use client';
2
- import { jsx } from 'react/jsx-runtime';
3
-
4
- const Icon = ({ i: I, size = "md", style, rotate, ...rest }) => {
5
- return /* @__PURE__ */ jsx(
6
- I,
7
- {
8
- ...typeof size === "number" ? {
9
- height: size,
10
- width: size
11
- } : stylesBySize[size],
12
- viewBox: "0 0 24 24",
13
- style: {
14
- ...style,
15
- flexShrink: 0,
16
- transform: `rotate(${rotate}deg)`
17
- },
18
- ...rest
19
- }
20
- );
1
+ "use client";
2
+ import "react";
3
+ import { jsx } from "react/jsx-runtime";
4
+ //#region src/components/Icon.tsx
5
+ var Icon = ({ i: I, size = "md", style, rotate, ...rest }) => {
6
+ return /* @__PURE__ */ jsx(I, {
7
+ ...typeof size === "number" ? {
8
+ height: size,
9
+ width: size
10
+ } : stylesBySize[size],
11
+ viewBox: "0 0 24 24",
12
+ style: {
13
+ ...style,
14
+ flexShrink: 0,
15
+ transform: `rotate(${rotate}deg)`
16
+ },
17
+ ...rest
18
+ });
21
19
  };
22
- const stylesBySize = {
23
- xs: {
24
- height: 16,
25
- width: 16
26
- },
27
- sm: {
28
- height: 20,
29
- width: 20
30
- },
31
- md: {
32
- height: 24,
33
- width: 24
34
- },
35
- lg: {
36
- height: 28,
37
- width: 28
38
- },
39
- xl: {
40
- height: 32,
41
- width: 32
42
- },
43
- ["2xl"]: {
44
- height: 40,
45
- width: 40
46
- }
20
+ var stylesBySize = {
21
+ xs: {
22
+ height: 16,
23
+ width: 16
24
+ },
25
+ sm: {
26
+ height: 20,
27
+ width: 20
28
+ },
29
+ md: {
30
+ height: 24,
31
+ width: 24
32
+ },
33
+ lg: {
34
+ height: 28,
35
+ width: 28
36
+ },
37
+ xl: {
38
+ height: 32,
39
+ width: 32
40
+ },
41
+ ["2xl"]: {
42
+ height: 40,
43
+ width: 40
44
+ }
47
45
  };
48
-
46
+ //#endregion
49
47
  export { Icon };
@@ -1,44 +1,32 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
-
5
- const jsxRuntime = require('react/jsx-runtime');
6
- const core = require('@mantine/core');
7
- const hooks = require('@mantine/hooks');
8
- const clsx = require('clsx');
9
- const React = require('react');
10
-
11
- const InfinityLoadMoreButton = ({
12
- infinity,
13
- labels,
14
- parentRef,
15
- loader,
16
- ...props
17
- }) => {
18
- const { entry, ref } = hooks.useIntersection({
19
- root: parentRef?.current,
20
- rootMargin: "0px 0px 0px 0px",
21
- threshold: 0.5
22
- });
23
- const { loadMore = "Cargar más", end = "Fin de la lista" } = labels || {};
24
- const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
25
- React.useEffect(() => {
26
- if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
27
- }, [entry?.isIntersecting]);
28
- const showLoader = infinity.isLoading || infinity.isFetchingNextPage;
29
- return /* @__PURE__ */ jsxRuntime.jsx(
30
- core.Button,
31
- {
32
- ref,
33
- onClick: () => fetchNextPage(),
34
- loading: showLoader,
35
- className: clsx(!hasNextPage && "pointer-events-none", "font-medium"),
36
- variant: "transparent",
37
- color: !hasNextPage ? "gray" : void 0,
38
- ...props,
39
- children: hasNextPage ? loadMore : end
40
- }
41
- );
1
+ const require_runtime = require("../../../_virtual/_rolldown/runtime.cjs");
2
+ let react = require("react");
3
+ let react_jsx_runtime = require("react/jsx-runtime");
4
+ let _mantine_core = require("@mantine/core");
5
+ let _mantine_hooks = require("@mantine/hooks");
6
+ let clsx = require("clsx");
7
+ clsx = require_runtime.__toESM(clsx, 1);
8
+ //#region src/components/InfinityLoadMoreButton/index.tsx
9
+ var InfinityLoadMoreButton = ({ infinity, labels, parentRef, loader, ...props }) => {
10
+ const { entry, ref } = (0, _mantine_hooks.useIntersection)({
11
+ root: parentRef?.current,
12
+ rootMargin: "0px 0px 0px 0px",
13
+ threshold: .5
14
+ });
15
+ const { loadMore = "Cargar más", end = "Fin de la lista" } = labels || {};
16
+ const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
17
+ (0, react.useEffect)(() => {
18
+ if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
19
+ }, [entry?.isIntersecting]);
20
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Button, {
21
+ ref,
22
+ onClick: () => fetchNextPage(),
23
+ loading: infinity.isLoading || infinity.isFetchingNextPage,
24
+ className: (0, clsx.default)(!hasNextPage && "pointer-events-none", "font-medium"),
25
+ variant: "transparent",
26
+ color: !hasNextPage ? "gray" : void 0,
27
+ ...props,
28
+ children: hasNextPage ? loadMore : end
29
+ });
42
30
  };
43
-
31
+ //#endregion
44
32
  exports.InfinityLoadMoreButton = InfinityLoadMoreButton;
@@ -1,40 +1,30 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { Button } from '@mantine/core';
3
- import { useIntersection } from '@mantine/hooks';
4
- import clsx from 'clsx';
5
- import { useEffect } from 'react';
6
-
7
- const InfinityLoadMoreButton = ({
8
- infinity,
9
- labels,
10
- parentRef,
11
- loader,
12
- ...props
13
- }) => {
14
- const { entry, ref } = useIntersection({
15
- root: parentRef?.current,
16
- rootMargin: "0px 0px 0px 0px",
17
- threshold: 0.5
18
- });
19
- const { loadMore = "Cargar más", end = "Fin de la lista" } = labels || {};
20
- const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
21
- useEffect(() => {
22
- if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
23
- }, [entry?.isIntersecting]);
24
- const showLoader = infinity.isLoading || infinity.isFetchingNextPage;
25
- return /* @__PURE__ */ jsx(
26
- Button,
27
- {
28
- ref,
29
- onClick: () => fetchNextPage(),
30
- loading: showLoader,
31
- className: clsx(!hasNextPage && "pointer-events-none", "font-medium"),
32
- variant: "transparent",
33
- color: !hasNextPage ? "gray" : void 0,
34
- ...props,
35
- children: hasNextPage ? loadMore : end
36
- }
37
- );
1
+ import { useEffect } from "react";
2
+ import { jsx } from "react/jsx-runtime";
3
+ import { Button } from "@mantine/core";
4
+ import { useIntersection } from "@mantine/hooks";
5
+ import clsx from "clsx";
6
+ //#region src/components/InfinityLoadMoreButton/index.tsx
7
+ var InfinityLoadMoreButton = ({ infinity, labels, parentRef, loader, ...props }) => {
8
+ const { entry, ref } = useIntersection({
9
+ root: parentRef?.current,
10
+ rootMargin: "0px 0px 0px 0px",
11
+ threshold: .5
12
+ });
13
+ const { loadMore = "Cargar más", end = "Fin de la lista" } = labels || {};
14
+ const { hasNextPage, isFetchingNextPage, fetchNextPage } = infinity;
15
+ useEffect(() => {
16
+ if (hasNextPage && !isFetchingNextPage && entry?.isIntersecting) fetchNextPage();
17
+ }, [entry?.isIntersecting]);
18
+ return /* @__PURE__ */ jsx(Button, {
19
+ ref,
20
+ onClick: () => fetchNextPage(),
21
+ loading: infinity.isLoading || infinity.isFetchingNextPage,
22
+ className: clsx(!hasNextPage && "pointer-events-none", "font-medium"),
23
+ variant: "transparent",
24
+ color: !hasNextPage ? "gray" : void 0,
25
+ ...props,
26
+ children: hasNextPage ? loadMore : end
27
+ });
38
28
  };
39
-
29
+ //#endregion
40
30
  export { InfinityLoadMoreButton };