@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20260722112436 → 0.8.1-dev.20260723123821
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/{LinkNodeButton-U7T2NP22.mjs → LinkNodeButton-KZRNRJRI.mjs} +139 -46
- package/dist/index.js +39 -40
- package/dist/index.mjs +105 -106
- package/dist/server.js +202 -82
- package/dist/server.mjs +35 -13
- package/package.json +6 -5
- package/dist/DateTimeViewClient-22GW4AD7.mjs +0 -14
- package/dist/DateTimeViewClient-R3M6ISVK.mjs +0 -16
- package/dist/DateViewClient-ELEHLGWS.mjs +0 -7
- package/dist/DateViewClient-VLTRN47D.mjs +0 -9
- package/dist/EnterAnimationClient-4OKXLKSA.mjs +0 -45
- package/dist/EnterAnimationClient-ZN3NLFNO.mjs +0 -47
- package/dist/InputControlClient-AZRPSTUZ.mjs +0 -677
- package/dist/InputControlClient-BUOYZNWQ.mjs +0 -675
- package/dist/InputControlClient-HIZOJLKW.mjs +0 -677
- package/dist/LinkNodeButton-BIZA2NPE.mjs +0 -225
- package/dist/LinkNodeButton-LX3KKGZY.mjs +0 -173
- package/dist/Pagination-NCJCOYHF.mjs +0 -181
- package/dist/Pagination-OQT7Q2XO.mjs +0 -183
- package/dist/chunk-3R4VVVNK.mjs +0 -903
- package/dist/chunk-DBHUCH4B.mjs +0 -109
- package/dist/chunk-FI2KJBK2.mjs +0 -110
- package/dist/chunk-JKP4XOZB.mjs +0 -214
- package/dist/chunk-OGGIS4AN.mjs +0 -201
- package/dist/chunk-RHVNJMS4.mjs +0 -251
- package/dist/chunk-SPRVN5IM.mjs +0 -118
- package/dist/chunk-UFKPTMM7.mjs +0 -199
- package/dist/chunk-XG6SXZWP.mjs +0 -115
- package/dist/chunk-YG6FKKQJ.mjs +0 -900
|
@@ -1,225 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import {
|
|
3
|
-
ServiceClient_default
|
|
4
|
-
} from "./chunk-3GWLDT7C.mjs";
|
|
5
|
-
import {
|
|
6
|
-
Button_default,
|
|
7
|
-
ToastService_default
|
|
8
|
-
} from "./chunk-RHVNJMS4.mjs";
|
|
9
|
-
import "./chunk-56HSDML5.mjs";
|
|
10
|
-
|
|
11
|
-
// src/components/pageRenderingEngine/nodes/LinkNodeButton.tsx
|
|
12
|
-
import { useCallback, useState } from "react";
|
|
13
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
|
-
var LinkNodeButton = (props) => {
|
|
15
|
-
const { node, dataitem, children, linkText, linkType, linkUrl } = props;
|
|
16
|
-
const [isLoading, setIsLoading] = useState(false);
|
|
17
|
-
const [successMessage, setSuccessMessage] = useState(null);
|
|
18
|
-
console.log("LinkNodeButton props:", props);
|
|
19
|
-
const extractFieldNames = useCallback((template) => {
|
|
20
|
-
if (!template) return [];
|
|
21
|
-
const regex = /\{(\{\})?([a-zA-Z_$][a-zA-Z0-9_$]*)(?:\}\})?\}/g;
|
|
22
|
-
const matches = Array.from(template.matchAll(regex));
|
|
23
|
-
const fieldNames = matches.map((match) => match[2] || match[1]).filter((name, index, self) => self.indexOf(name) === index);
|
|
24
|
-
return fieldNames;
|
|
25
|
-
}, []);
|
|
26
|
-
const replaceTemplateVariables = useCallback(
|
|
27
|
-
(template, responseData) => {
|
|
28
|
-
if (!template) return template;
|
|
29
|
-
let result = template;
|
|
30
|
-
const fieldNames = extractFieldNames(template);
|
|
31
|
-
if (responseData) {
|
|
32
|
-
fieldNames.forEach((fieldName) => {
|
|
33
|
-
const value = getNestedValue(responseData, fieldName);
|
|
34
|
-
if (value !== void 0) {
|
|
35
|
-
const regex1 = new RegExp(`\\{${fieldName}\\}`, "g");
|
|
36
|
-
const regex2 = new RegExp(`\\{\\{${fieldName}\\}\\}`, "g");
|
|
37
|
-
result = result.replace(regex1, String(value));
|
|
38
|
-
result = result.replace(regex2, String(value));
|
|
39
|
-
}
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
if (props.routeParameters) {
|
|
43
|
-
Object.entries(props.routeParameters).forEach(([key, value]) => {
|
|
44
|
-
const regex = new RegExp(`\\{\\{${key}\\}\\}`, "g");
|
|
45
|
-
result = result.replace(regex, String(value));
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
if (dataitem) {
|
|
49
|
-
Object.entries(dataitem).forEach(([key, value]) => {
|
|
50
|
-
const regex = new RegExp(`\\{\\{${key}\\}\\}`, "g");
|
|
51
|
-
result = result.replace(regex, String(value));
|
|
52
|
-
});
|
|
53
|
-
}
|
|
54
|
-
return result;
|
|
55
|
-
},
|
|
56
|
-
[props.routeParameters, dataitem, extractFieldNames]
|
|
57
|
-
);
|
|
58
|
-
const getNestedValue = useCallback((obj, path) => {
|
|
59
|
-
if (!obj || !path) return void 0;
|
|
60
|
-
if (obj[path] !== void 0) {
|
|
61
|
-
return obj[path];
|
|
62
|
-
}
|
|
63
|
-
const keys = path.split(".");
|
|
64
|
-
let current = obj;
|
|
65
|
-
for (const key of keys) {
|
|
66
|
-
if (current[key] === void 0) {
|
|
67
|
-
return void 0;
|
|
68
|
-
}
|
|
69
|
-
current = current[key];
|
|
70
|
-
}
|
|
71
|
-
return current;
|
|
72
|
-
}, []);
|
|
73
|
-
const onClick = useCallback(async () => {
|
|
74
|
-
if (!node.postUrl) {
|
|
75
|
-
return {
|
|
76
|
-
isSuccessful: false,
|
|
77
|
-
message: "No POST URL configured for this button"
|
|
78
|
-
};
|
|
79
|
-
}
|
|
80
|
-
setIsLoading(true);
|
|
81
|
-
try {
|
|
82
|
-
const resolvedPostUrl = replaceTemplateVariables(node.postUrl);
|
|
83
|
-
let parsedPayload = {};
|
|
84
|
-
if (node.payload) {
|
|
85
|
-
try {
|
|
86
|
-
const payloadStr = replaceTemplateVariables(node.payload);
|
|
87
|
-
parsedPayload = JSON.parse(payloadStr);
|
|
88
|
-
console.log("Parsed payload:", parsedPayload);
|
|
89
|
-
} catch (err) {
|
|
90
|
-
console.error("Failed to parse payload JSON:", err);
|
|
91
|
-
parsedPayload = { error: "Invalid payload JSON" };
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
const serviceClient = new ServiceClient_default(props.apiBaseUrl, props.session);
|
|
95
|
-
const response = await serviceClient.post(resolvedPostUrl, parsedPayload);
|
|
96
|
-
console.log("API Response:", response);
|
|
97
|
-
if (response && !response.isSuccessful) {
|
|
98
|
-
const errorMessage = response.message || "API request failed";
|
|
99
|
-
setIsLoading(false);
|
|
100
|
-
return { isSuccessful: false, message: errorMessage };
|
|
101
|
-
}
|
|
102
|
-
if (response?.message) {
|
|
103
|
-
ToastService_default.showSuccess(response.message);
|
|
104
|
-
setSuccessMessage(response.message);
|
|
105
|
-
}
|
|
106
|
-
if (response && node.redirectUrl) {
|
|
107
|
-
const fieldNames = extractFieldNames(node.redirectUrl);
|
|
108
|
-
console.log("Field names in redirect URL:", fieldNames);
|
|
109
|
-
const fieldValueMap = {};
|
|
110
|
-
fieldNames.forEach((fieldName) => {
|
|
111
|
-
const value = getNestedValue(response, fieldName);
|
|
112
|
-
if (value !== void 0) {
|
|
113
|
-
fieldValueMap[fieldName] = String(value);
|
|
114
|
-
} else {
|
|
115
|
-
const resultValue = getNestedValue(response, `result.${fieldName}`);
|
|
116
|
-
if (resultValue !== void 0) {
|
|
117
|
-
fieldValueMap[fieldName] = String(resultValue);
|
|
118
|
-
} else {
|
|
119
|
-
const dataValue = getNestedValue(response, `data.${fieldName}`);
|
|
120
|
-
if (dataValue !== void 0) {
|
|
121
|
-
fieldValueMap[fieldName] = String(dataValue);
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
});
|
|
126
|
-
console.log("Field value map:", fieldValueMap);
|
|
127
|
-
const missingFields = fieldNames.filter(
|
|
128
|
-
(fieldName) => !fieldValueMap[fieldName]
|
|
129
|
-
);
|
|
130
|
-
if (missingFields.length > 0) {
|
|
131
|
-
console.warn(`Missing field values for: ${missingFields.join(", ")}`);
|
|
132
|
-
}
|
|
133
|
-
let resolvedRedirectUrl = node.redirectUrl;
|
|
134
|
-
Object.entries(fieldValueMap).forEach(([fieldName, value]) => {
|
|
135
|
-
const regex1 = new RegExp(`\\{${fieldName}\\}`, "g");
|
|
136
|
-
const regex2 = new RegExp(`\\{\\{${fieldName}\\}\\}`, "g");
|
|
137
|
-
resolvedRedirectUrl = resolvedRedirectUrl.replace(regex1, value);
|
|
138
|
-
resolvedRedirectUrl = resolvedRedirectUrl.replace(regex2, value);
|
|
139
|
-
});
|
|
140
|
-
resolvedRedirectUrl = replaceTemplateVariables(
|
|
141
|
-
resolvedRedirectUrl,
|
|
142
|
-
response
|
|
143
|
-
);
|
|
144
|
-
console.log("Final redirect URL:", resolvedRedirectUrl);
|
|
145
|
-
if (resolvedRedirectUrl && !resolvedRedirectUrl.includes("{")) {
|
|
146
|
-
window.location.href = resolvedRedirectUrl;
|
|
147
|
-
}
|
|
148
|
-
} else if (!response) {
|
|
149
|
-
const errorMessage = "No response from server";
|
|
150
|
-
setIsLoading(false);
|
|
151
|
-
return { isSuccessful: false, message: errorMessage };
|
|
152
|
-
}
|
|
153
|
-
setIsLoading(false);
|
|
154
|
-
return {
|
|
155
|
-
isSuccessful: true,
|
|
156
|
-
message: response?.message,
|
|
157
|
-
result: response
|
|
158
|
-
};
|
|
159
|
-
} catch (err) {
|
|
160
|
-
console.error("Button API call failed:", err);
|
|
161
|
-
const errorMessage = err.message || "An unexpected error occurred";
|
|
162
|
-
setIsLoading(false);
|
|
163
|
-
return { isSuccessful: false, message: errorMessage };
|
|
164
|
-
}
|
|
165
|
-
}, [
|
|
166
|
-
node.postUrl,
|
|
167
|
-
node.payload,
|
|
168
|
-
node.redirectUrl,
|
|
169
|
-
replaceTemplateVariables,
|
|
170
|
-
extractFieldNames,
|
|
171
|
-
getNestedValue,
|
|
172
|
-
props.apiBaseUrl,
|
|
173
|
-
props.session
|
|
174
|
-
]);
|
|
175
|
-
const renderButtonContent = () => {
|
|
176
|
-
if (children) {
|
|
177
|
-
return children;
|
|
178
|
-
}
|
|
179
|
-
if (linkText) {
|
|
180
|
-
return /* @__PURE__ */ jsx("span", { children: linkText });
|
|
181
|
-
}
|
|
182
|
-
return node.title || "Button";
|
|
183
|
-
};
|
|
184
|
-
const fontSize = node.children?.[0]?.style?.match(/font-size:\s*([^;]+)/)?.[1];
|
|
185
|
-
return /* @__PURE__ */ jsx("div", { className: "link-button-wrapper", children: /* @__PURE__ */ jsx(
|
|
186
|
-
Button_default,
|
|
187
|
-
{
|
|
188
|
-
ButtonType: linkType,
|
|
189
|
-
onClick,
|
|
190
|
-
disabled: isLoading || !!successMessage,
|
|
191
|
-
className: "w-full",
|
|
192
|
-
children: successMessage ? /* @__PURE__ */ jsxs(
|
|
193
|
-
"span",
|
|
194
|
-
{
|
|
195
|
-
style: fontSize ? { fontSize } : void 0,
|
|
196
|
-
className: "inline-flex items-center gap-2",
|
|
197
|
-
children: [
|
|
198
|
-
/* @__PURE__ */ jsx(
|
|
199
|
-
"svg",
|
|
200
|
-
{
|
|
201
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
202
|
-
viewBox: "0 0 20 20",
|
|
203
|
-
fill: "currentColor",
|
|
204
|
-
className: "w-5 h-5",
|
|
205
|
-
children: /* @__PURE__ */ jsx(
|
|
206
|
-
"path",
|
|
207
|
-
{
|
|
208
|
-
fillRule: "evenodd",
|
|
209
|
-
d: "M16.704 5.29a1 1 0 010 1.42l-7.25 7.25a1 1 0 01-1.415 0L3.29 9.21a1 1 0 111.415-1.414l4.042 4.042 6.543-6.543a1 1 0 011.414 0z",
|
|
210
|
-
clipRule: "evenodd"
|
|
211
|
-
}
|
|
212
|
-
)
|
|
213
|
-
}
|
|
214
|
-
),
|
|
215
|
-
/* @__PURE__ */ jsx("span", { children: successMessage })
|
|
216
|
-
]
|
|
217
|
-
}
|
|
218
|
-
) : renderButtonContent()
|
|
219
|
-
}
|
|
220
|
-
) });
|
|
221
|
-
};
|
|
222
|
-
var LinkNodeButton_default = LinkNodeButton;
|
|
223
|
-
export {
|
|
224
|
-
LinkNodeButton_default as default
|
|
225
|
-
};
|
|
@@ -1,173 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
"use client";
|
|
4
|
-
import {
|
|
5
|
-
ServiceClient_default
|
|
6
|
-
} from "./chunk-WEV5U33G.mjs";
|
|
7
|
-
import {
|
|
8
|
-
Button_default,
|
|
9
|
-
ToastService_default
|
|
10
|
-
} from "./chunk-JKP4XOZB.mjs";
|
|
11
|
-
import "./chunk-IMNQO57B.mjs";
|
|
12
|
-
|
|
13
|
-
// src/components/pageRenderingEngine/nodes/LinkNodeButton.tsx
|
|
14
|
-
import { useCallback, useState } from "react";
|
|
15
|
-
import { jsx } from "react/jsx-runtime";
|
|
16
|
-
var LinkNodeButton = (props) => {
|
|
17
|
-
const { node, dataitem, children, linkText, linkType, linkUrl } = props;
|
|
18
|
-
const [isLoading, setIsLoading] = useState(false);
|
|
19
|
-
const extractFieldNames = useCallback((template) => {
|
|
20
|
-
if (!template) return [];
|
|
21
|
-
const regex = /\{(\{\})?([a-zA-Z_$][a-zA-Z0-9_$]*)(?:\}\})?\}/g;
|
|
22
|
-
const matches = Array.from(template.matchAll(regex));
|
|
23
|
-
const fieldNames = matches.map((match) => match[2] || match[1]).filter((name, index, self) => self.indexOf(name) === index);
|
|
24
|
-
return fieldNames;
|
|
25
|
-
}, []);
|
|
26
|
-
const replaceTemplateVariables = useCallback((template, responseData) => {
|
|
27
|
-
if (!template) return template;
|
|
28
|
-
let result = template;
|
|
29
|
-
const fieldNames = extractFieldNames(template);
|
|
30
|
-
if (responseData) {
|
|
31
|
-
fieldNames.forEach((fieldName) => {
|
|
32
|
-
const value = getNestedValue(responseData, fieldName);
|
|
33
|
-
if (value !== void 0) {
|
|
34
|
-
const regex1 = new RegExp(`\\{${fieldName}\\}`, "g");
|
|
35
|
-
const regex2 = new RegExp(`\\{\\{${fieldName}\\}\\}`, "g");
|
|
36
|
-
result = result.replace(regex1, String(value));
|
|
37
|
-
result = result.replace(regex2, String(value));
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
}
|
|
41
|
-
if (props.routeParameters) {
|
|
42
|
-
Object.entries(props.routeParameters).forEach(([key, value]) => {
|
|
43
|
-
const regex = new RegExp(`\\{\\{${key}\\}\\}`, "g");
|
|
44
|
-
result = result.replace(regex, String(value));
|
|
45
|
-
});
|
|
46
|
-
}
|
|
47
|
-
if (dataitem) {
|
|
48
|
-
Object.entries(dataitem).forEach(([key, value]) => {
|
|
49
|
-
const regex = new RegExp(`\\{\\{${key}\\}\\}`, "g");
|
|
50
|
-
result = result.replace(regex, String(value));
|
|
51
|
-
});
|
|
52
|
-
}
|
|
53
|
-
return result;
|
|
54
|
-
}, [props.routeParameters, dataitem, extractFieldNames]);
|
|
55
|
-
const getNestedValue = useCallback((obj, path) => {
|
|
56
|
-
if (!obj || !path) return void 0;
|
|
57
|
-
if (obj[path] !== void 0) {
|
|
58
|
-
return obj[path];
|
|
59
|
-
}
|
|
60
|
-
const keys = path.split(".");
|
|
61
|
-
let current = obj;
|
|
62
|
-
for (const key of keys) {
|
|
63
|
-
if (current[key] === void 0) {
|
|
64
|
-
return void 0;
|
|
65
|
-
}
|
|
66
|
-
current = current[key];
|
|
67
|
-
}
|
|
68
|
-
return current;
|
|
69
|
-
}, []);
|
|
70
|
-
const onClick = useCallback(async () => {
|
|
71
|
-
if (!node.postUrl) {
|
|
72
|
-
return { isSuccessful: false, message: "No POST URL configured for this button" };
|
|
73
|
-
}
|
|
74
|
-
setIsLoading(true);
|
|
75
|
-
try {
|
|
76
|
-
const resolvedPostUrl = replaceTemplateVariables(node.postUrl);
|
|
77
|
-
let parsedPayload = {};
|
|
78
|
-
if (node.payload) {
|
|
79
|
-
try {
|
|
80
|
-
const payloadStr = replaceTemplateVariables(node.payload);
|
|
81
|
-
parsedPayload = JSON.parse(payloadStr);
|
|
82
|
-
console.log("Parsed payload:", parsedPayload);
|
|
83
|
-
} catch (err) {
|
|
84
|
-
console.error("Failed to parse payload JSON:", err);
|
|
85
|
-
parsedPayload = { error: "Invalid payload JSON" };
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
const serviceClient = new ServiceClient_default(props.apiBaseUrl, props.session);
|
|
89
|
-
const response = await serviceClient.post(resolvedPostUrl, parsedPayload);
|
|
90
|
-
console.log("API Response:", response);
|
|
91
|
-
if (response && !response.isSuccessful) {
|
|
92
|
-
const errorMessage = response.message || "API request failed";
|
|
93
|
-
setIsLoading(false);
|
|
94
|
-
return { isSuccessful: false, message: errorMessage };
|
|
95
|
-
}
|
|
96
|
-
if (response?.message) {
|
|
97
|
-
ToastService_default.showSuccess(response.message);
|
|
98
|
-
}
|
|
99
|
-
if (response && node.redirectUrl) {
|
|
100
|
-
const fieldNames = extractFieldNames(node.redirectUrl);
|
|
101
|
-
console.log("Field names in redirect URL:", fieldNames);
|
|
102
|
-
const fieldValueMap = {};
|
|
103
|
-
fieldNames.forEach((fieldName) => {
|
|
104
|
-
const value = getNestedValue(response, fieldName);
|
|
105
|
-
if (value !== void 0) {
|
|
106
|
-
fieldValueMap[fieldName] = String(value);
|
|
107
|
-
} else {
|
|
108
|
-
const resultValue = getNestedValue(response, `result.${fieldName}`);
|
|
109
|
-
if (resultValue !== void 0) {
|
|
110
|
-
fieldValueMap[fieldName] = String(resultValue);
|
|
111
|
-
} else {
|
|
112
|
-
const dataValue = getNestedValue(response, `data.${fieldName}`);
|
|
113
|
-
if (dataValue !== void 0) {
|
|
114
|
-
fieldValueMap[fieldName] = String(dataValue);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
});
|
|
119
|
-
console.log("Field value map:", fieldValueMap);
|
|
120
|
-
const missingFields = fieldNames.filter((fieldName) => !fieldValueMap[fieldName]);
|
|
121
|
-
if (missingFields.length > 0) {
|
|
122
|
-
console.warn(`Missing field values for: ${missingFields.join(", ")}`);
|
|
123
|
-
}
|
|
124
|
-
let resolvedRedirectUrl = node.redirectUrl;
|
|
125
|
-
Object.entries(fieldValueMap).forEach(([fieldName, value]) => {
|
|
126
|
-
const regex1 = new RegExp(`\\{${fieldName}\\}`, "g");
|
|
127
|
-
const regex2 = new RegExp(`\\{\\{${fieldName}\\}\\}`, "g");
|
|
128
|
-
resolvedRedirectUrl = resolvedRedirectUrl.replace(regex1, value);
|
|
129
|
-
resolvedRedirectUrl = resolvedRedirectUrl.replace(regex2, value);
|
|
130
|
-
});
|
|
131
|
-
resolvedRedirectUrl = replaceTemplateVariables(resolvedRedirectUrl, response);
|
|
132
|
-
console.log("Final redirect URL:", resolvedRedirectUrl);
|
|
133
|
-
if (resolvedRedirectUrl && !resolvedRedirectUrl.includes("{")) {
|
|
134
|
-
window.location.href = resolvedRedirectUrl;
|
|
135
|
-
}
|
|
136
|
-
} else if (!response) {
|
|
137
|
-
const errorMessage = "No response from server";
|
|
138
|
-
setIsLoading(false);
|
|
139
|
-
return { isSuccessful: false, message: errorMessage };
|
|
140
|
-
}
|
|
141
|
-
setIsLoading(false);
|
|
142
|
-
return { isSuccessful: true, message: response?.message, result: response };
|
|
143
|
-
} catch (err) {
|
|
144
|
-
console.error("Button API call failed:", err);
|
|
145
|
-
const errorMessage = err.message || "An unexpected error occurred";
|
|
146
|
-
setIsLoading(false);
|
|
147
|
-
return { isSuccessful: false, message: errorMessage };
|
|
148
|
-
}
|
|
149
|
-
}, [node.postUrl, node.payload, node.redirectUrl, replaceTemplateVariables, extractFieldNames, getNestedValue, props.apiBaseUrl, props.session]);
|
|
150
|
-
const renderButtonContent = () => {
|
|
151
|
-
if (children) {
|
|
152
|
-
return children;
|
|
153
|
-
}
|
|
154
|
-
if (linkText) {
|
|
155
|
-
return /* @__PURE__ */ jsx("span", { children: linkText });
|
|
156
|
-
}
|
|
157
|
-
return node.title || "Button";
|
|
158
|
-
};
|
|
159
|
-
return /* @__PURE__ */ jsx("div", { className: "link-button-wrapper", children: /* @__PURE__ */ jsx(
|
|
160
|
-
Button_default,
|
|
161
|
-
{
|
|
162
|
-
ButtonType: linkType,
|
|
163
|
-
onClick,
|
|
164
|
-
disabled: isLoading,
|
|
165
|
-
className: "w-full",
|
|
166
|
-
children: renderButtonContent()
|
|
167
|
-
}
|
|
168
|
-
) });
|
|
169
|
-
};
|
|
170
|
-
var LinkNodeButton_default = LinkNodeButton;
|
|
171
|
-
export {
|
|
172
|
-
LinkNodeButton_default as default
|
|
173
|
-
};
|
|
@@ -1,181 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import {
|
|
3
|
-
OdataBuilder
|
|
4
|
-
} from "./chunk-UFKPTMM7.mjs";
|
|
5
|
-
import {
|
|
6
|
-
Constants,
|
|
7
|
-
Hyperlink,
|
|
8
|
-
Icon_default
|
|
9
|
-
} from "./chunk-DBHUCH4B.mjs";
|
|
10
|
-
import "./chunk-56HSDML5.mjs";
|
|
11
|
-
|
|
12
|
-
// src/components/Pagination.tsx
|
|
13
|
-
import { useMemo } from "react";
|
|
14
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
15
|
-
var Pagination = (props) => {
|
|
16
|
-
const { dataset, path, query, showPageSizeSelector = false, showJumpToPage = false } = props;
|
|
17
|
-
const builder = useMemo(() => {
|
|
18
|
-
const b = new OdataBuilder(path);
|
|
19
|
-
if (query) b.setQuery(query);
|
|
20
|
-
return b;
|
|
21
|
-
}, [path, query]);
|
|
22
|
-
const activePageNumber = builder.getPageNumber(Constants.pagesize);
|
|
23
|
-
const totalItems = dataset?.count || 0;
|
|
24
|
-
const itemsPerPage = parseInt(builder.top || Constants.pagesize.toString());
|
|
25
|
-
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
|
26
|
-
const startItem = totalItems > 0 ? (activePageNumber - 1) * itemsPerPage + 1 : 0;
|
|
27
|
-
const endItem = Math.min(activePageNumber * itemsPerPage, totalItems);
|
|
28
|
-
const getPaginationRange = () => {
|
|
29
|
-
const delta = 1;
|
|
30
|
-
const range = [];
|
|
31
|
-
if (totalPages <= 7) {
|
|
32
|
-
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
33
|
-
}
|
|
34
|
-
range.push(1);
|
|
35
|
-
let start = Math.max(2, activePageNumber - delta);
|
|
36
|
-
let end = Math.min(totalPages - 1, activePageNumber + delta);
|
|
37
|
-
if (activePageNumber - delta <= 2) {
|
|
38
|
-
end = Math.min(totalPages - 1, 4);
|
|
39
|
-
}
|
|
40
|
-
if (activePageNumber + delta >= totalPages - 1) {
|
|
41
|
-
start = Math.max(2, totalPages - 4);
|
|
42
|
-
}
|
|
43
|
-
if (start > 2) {
|
|
44
|
-
range.push("...");
|
|
45
|
-
}
|
|
46
|
-
for (let i = start; i <= end; i++) {
|
|
47
|
-
range.push(i);
|
|
48
|
-
}
|
|
49
|
-
if (end < totalPages - 1) {
|
|
50
|
-
range.push("...");
|
|
51
|
-
}
|
|
52
|
-
if (totalPages > 1) {
|
|
53
|
-
range.push(totalPages);
|
|
54
|
-
}
|
|
55
|
-
return range;
|
|
56
|
-
};
|
|
57
|
-
const paginationRange = getPaginationRange();
|
|
58
|
-
const PageButton = ({ page, children }) => /* @__PURE__ */ jsx(
|
|
59
|
-
Hyperlink,
|
|
60
|
-
{
|
|
61
|
-
linkType: "Link" /* Link */,
|
|
62
|
-
className: `
|
|
63
|
-
min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center px-2.5 md:px-3
|
|
64
|
-
border text-sm font-medium transition-colors duration-150
|
|
65
|
-
${activePageNumber === page ? "bg-primary-base font-semibold" : ""}
|
|
66
|
-
`,
|
|
67
|
-
href: builder.getNewPageUrl(page),
|
|
68
|
-
children
|
|
69
|
-
}
|
|
70
|
-
);
|
|
71
|
-
const NavigationButton = ({ page, disabled, children }) => {
|
|
72
|
-
if (disabled) {
|
|
73
|
-
return /* @__PURE__ */ jsx("span", { className: "min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center px-2 md:px-3 border bg-neutral-base cursor-not-allowed", children });
|
|
74
|
-
}
|
|
75
|
-
return /* @__PURE__ */ jsx(
|
|
76
|
-
Hyperlink,
|
|
77
|
-
{
|
|
78
|
-
className: "min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center px-2 md:px-3 border transition-colors duration-150",
|
|
79
|
-
href: builder.getNewPageUrl(page),
|
|
80
|
-
children
|
|
81
|
-
}
|
|
82
|
-
);
|
|
83
|
-
};
|
|
84
|
-
if (totalPages <= 1 && totalItems === 0) return null;
|
|
85
|
-
return /* @__PURE__ */ jsxs("div", { className: "py-6 border-t bg-default", children: [
|
|
86
|
-
/* @__PURE__ */ jsxs("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4", children: [
|
|
87
|
-
/* @__PURE__ */ jsxs("div", { className: "text-sm", children: [
|
|
88
|
-
"Showing ",
|
|
89
|
-
/* @__PURE__ */ jsxs("span", { className: "font-semibold", children: [
|
|
90
|
-
startItem,
|
|
91
|
-
"-",
|
|
92
|
-
endItem
|
|
93
|
-
] }),
|
|
94
|
-
" ",
|
|
95
|
-
"out of ",
|
|
96
|
-
/* @__PURE__ */ jsx("span", { className: "font-semibold", children: totalItems.toLocaleString() }),
|
|
97
|
-
" results"
|
|
98
|
-
] }),
|
|
99
|
-
totalPages > 1 && /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-1", children: [
|
|
100
|
-
/* @__PURE__ */ jsxs(
|
|
101
|
-
NavigationButton,
|
|
102
|
-
{
|
|
103
|
-
page: activePageNumber - 1,
|
|
104
|
-
disabled: activePageNumber === 1,
|
|
105
|
-
children: [
|
|
106
|
-
/* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(Icon_default, { name: "chevronLeft", className: "w-4 h-4 mr-1" }) }),
|
|
107
|
-
/* @__PURE__ */ jsx("span", { className: "text-sm", children: "Prev" })
|
|
108
|
-
]
|
|
109
|
-
}
|
|
110
|
-
),
|
|
111
|
-
paginationRange.map((item, index) => {
|
|
112
|
-
if (item === "...") {
|
|
113
|
-
return /* @__PURE__ */ jsx(
|
|
114
|
-
"span",
|
|
115
|
-
{
|
|
116
|
-
className: "min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center text-gray-500",
|
|
117
|
-
children: "..."
|
|
118
|
-
},
|
|
119
|
-
`ellipsis-${index}`
|
|
120
|
-
);
|
|
121
|
-
}
|
|
122
|
-
const page = item;
|
|
123
|
-
return /* @__PURE__ */ jsx(PageButton, { page, children: page }, page);
|
|
124
|
-
}),
|
|
125
|
-
/* @__PURE__ */ jsxs(
|
|
126
|
-
NavigationButton,
|
|
127
|
-
{
|
|
128
|
-
page: activePageNumber + 1,
|
|
129
|
-
disabled: activePageNumber === totalPages,
|
|
130
|
-
children: [
|
|
131
|
-
/* @__PURE__ */ jsx("span", { className: "text-sm", children: "Next" }),
|
|
132
|
-
/* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(Icon_default, { name: "chevronRight", className: "w-4 h-4 ml-1" }) })
|
|
133
|
-
]
|
|
134
|
-
}
|
|
135
|
-
)
|
|
136
|
-
] }),
|
|
137
|
-
showJumpToPage && totalPages > 5 && /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
|
|
138
|
-
/* @__PURE__ */ jsx("span", { className: "text-sm", children: "Go to:" }),
|
|
139
|
-
/* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
|
|
140
|
-
"input",
|
|
141
|
-
{
|
|
142
|
-
type: "number",
|
|
143
|
-
min: "1",
|
|
144
|
-
max: totalPages,
|
|
145
|
-
defaultValue: activePageNumber,
|
|
146
|
-
className: "w-20 h-10 px-3 border rounded text-sm focus:outline-none focus:ring-2 focus:border-transparent",
|
|
147
|
-
onKeyDown: (e) => {
|
|
148
|
-
if (e.key === "Enter") {
|
|
149
|
-
const input = e.target;
|
|
150
|
-
const page = parseInt(input.value);
|
|
151
|
-
if (page >= 1 && page <= totalPages && page !== activePageNumber) {
|
|
152
|
-
window.location.href = builder.getNewPageUrl(page);
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
}
|
|
157
|
-
) })
|
|
158
|
-
] })
|
|
159
|
-
] }),
|
|
160
|
-
showPageSizeSelector && /* @__PURE__ */ jsx("div", { className: "mt-4 pt-4 border-t bg-default", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center space-x-2", children: [
|
|
161
|
-
/* @__PURE__ */ jsx("span", { className: "text-sm", children: "Show:" }),
|
|
162
|
-
/* @__PURE__ */ jsx("div", { className: "flex space-x-1", children: [10, 25, 50, 100].map((size) => /* @__PURE__ */ jsx(
|
|
163
|
-
Hyperlink,
|
|
164
|
-
{
|
|
165
|
-
className: `
|
|
166
|
-
px-3 py-1 text-sm rounded border transition-colors duration-150
|
|
167
|
-
${itemsPerPage === size ? "bg-primary-base font-medium" : "bg-neutral-weak"}
|
|
168
|
-
`,
|
|
169
|
-
href: builder.getNewPageSizeUrl(size),
|
|
170
|
-
children: size
|
|
171
|
-
},
|
|
172
|
-
size
|
|
173
|
-
)) }),
|
|
174
|
-
/* @__PURE__ */ jsx("span", { className: "text-sm", children: "per page" })
|
|
175
|
-
] }) })
|
|
176
|
-
] });
|
|
177
|
-
};
|
|
178
|
-
var Pagination_default = Pagination;
|
|
179
|
-
export {
|
|
180
|
-
Pagination_default as default
|
|
181
|
-
};
|