@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260721133206 → 0.8.1-dev.20260722070133
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/{InputControlClient-VUPWEYGB.mjs → InputControlClient-5RK7QDZZ.mjs} +1 -1
- package/dist/{InputControlClient-WW2T4W77.mjs → InputControlClient-7FJWGZDN.mjs} +1 -1
- package/dist/{LinkNodeButton-LX3KKGZY.mjs → LinkNodeButton-AOEDCCL7.mjs} +92 -38
- package/dist/{LinkNodeButton-XA7Z5IDR.mjs → LinkNodeButton-BIZA2NPE.mjs} +92 -38
- package/dist/{chunk-JKP4XOZB.mjs → chunk-23WJE3YB.mjs} +48 -9
- package/dist/{chunk-YL6E76X2.mjs → chunk-RHVNJMS4.mjs} +48 -9
- package/dist/index.js +137 -44
- package/dist/index.mjs +3 -3
- package/package.json +2 -2
- package/dist/EnterAnimationClient-4OKXLKSA.mjs +0 -45
- package/dist/EnterAnimationClient-ZN3NLFNO.mjs +0 -47
- package/dist/InputControlClient-AZRPSTUZ.mjs +0 -677
- package/dist/InputControlClient-HIZOJLKW.mjs +0 -677
- package/dist/InputControlClient-P4RA7DQN.mjs +0 -677
- package/dist/LinkNodeButton-U7T2NP22.mjs +0 -374
- package/dist/Pagination-6OFACRMQ.mjs +0 -229
- package/dist/Pagination-OQT7Q2XO.mjs +0 -183
- package/dist/chunk-3R4VVVNK.mjs +0 -903
- package/dist/chunk-FI2KJBK2.mjs +0 -110
- package/dist/chunk-OGGIS4AN.mjs +0 -201
- package/dist/chunk-TVL6KVD5.mjs +0 -229
- package/dist/server.d.mts +0 -113
- package/dist/server.d.ts +0 -113
- package/dist/server.js +0 -5225
- package/dist/server.mjs +0 -2782
package/dist/index.js
CHANGED
|
@@ -1871,7 +1871,9 @@ var init_Button = __esm({
|
|
|
1871
1871
|
event.preventDefault();
|
|
1872
1872
|
event.stopPropagation();
|
|
1873
1873
|
if (props.confirm) {
|
|
1874
|
-
const confirmed = await showConfirmation(
|
|
1874
|
+
const confirmed = await showConfirmation(
|
|
1875
|
+
"Are you sure you want to delete this item?"
|
|
1876
|
+
);
|
|
1875
1877
|
setShowModal(null);
|
|
1876
1878
|
if (!confirmed) {
|
|
1877
1879
|
return;
|
|
@@ -1886,7 +1888,9 @@ var init_Button = __esm({
|
|
|
1886
1888
|
isValid = await props.onValidate();
|
|
1887
1889
|
if (!isValid) {
|
|
1888
1890
|
setInProgress(false);
|
|
1889
|
-
ToastService_default.showError(
|
|
1891
|
+
ToastService_default.showError(
|
|
1892
|
+
"There are errors in the form. Please fix them before proceeding."
|
|
1893
|
+
);
|
|
1890
1894
|
return;
|
|
1891
1895
|
}
|
|
1892
1896
|
}
|
|
@@ -1910,7 +1914,16 @@ var init_Button = __esm({
|
|
|
1910
1914
|
return new Promise((resolve) => {
|
|
1911
1915
|
const onConfirm = () => resolve(true);
|
|
1912
1916
|
const onCancel = () => resolve(false);
|
|
1913
|
-
setShowModal(
|
|
1917
|
+
setShowModal(
|
|
1918
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1919
|
+
Confirm_default,
|
|
1920
|
+
{
|
|
1921
|
+
message: props.confirmationMessage,
|
|
1922
|
+
onConfirm,
|
|
1923
|
+
onCancel
|
|
1924
|
+
}
|
|
1925
|
+
)
|
|
1926
|
+
);
|
|
1914
1927
|
});
|
|
1915
1928
|
};
|
|
1916
1929
|
let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
|
|
@@ -1924,13 +1937,39 @@ var init_Button = __esm({
|
|
|
1924
1937
|
onClick: execute,
|
|
1925
1938
|
disabled: props.disabled,
|
|
1926
1939
|
title: isDisabled ? "The button is disabled to prevent any action" : "",
|
|
1927
|
-
className: buttonClass
|
|
1940
|
+
className: `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`,
|
|
1928
1941
|
children: [
|
|
1929
1942
|
isActionPerformed && props.oneTimeAction && responseMessage ? responseMessage : props.children,
|
|
1930
|
-
inProgress && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1931
|
-
|
|
1932
|
-
|
|
1933
|
-
|
|
1943
|
+
inProgress && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, { children: props.hideProgressIndicator ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "absolute bottom-0 left-0 h-0.5 bg-gray-400 rounded animate-progress" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
1944
|
+
"svg",
|
|
1945
|
+
{
|
|
1946
|
+
className: `animate-spin h-5 w-5 flex-shrink-0 ${progressClass}`,
|
|
1947
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1948
|
+
fill: "none",
|
|
1949
|
+
viewBox: "0 0 24 24",
|
|
1950
|
+
children: [
|
|
1951
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1952
|
+
"circle",
|
|
1953
|
+
{
|
|
1954
|
+
className: "opacity-25",
|
|
1955
|
+
cx: "12",
|
|
1956
|
+
cy: "12",
|
|
1957
|
+
r: "10",
|
|
1958
|
+
stroke: "currentColor",
|
|
1959
|
+
strokeWidth: "4"
|
|
1960
|
+
}
|
|
1961
|
+
),
|
|
1962
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1963
|
+
"path",
|
|
1964
|
+
{
|
|
1965
|
+
className: "opacity-75",
|
|
1966
|
+
fill: "currentColor",
|
|
1967
|
+
d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
|
1968
|
+
}
|
|
1969
|
+
)
|
|
1970
|
+
]
|
|
1971
|
+
}
|
|
1972
|
+
) })
|
|
1934
1973
|
]
|
|
1935
1974
|
}
|
|
1936
1975
|
),
|
|
@@ -3092,6 +3131,8 @@ var init_LinkNodeButton = __esm({
|
|
|
3092
3131
|
LinkNodeButton = (props) => {
|
|
3093
3132
|
const { node, dataitem, children, linkText, linkType, linkUrl } = props;
|
|
3094
3133
|
const [isLoading, setIsLoading] = (0, import_react38.useState)(false);
|
|
3134
|
+
const [successMessage, setSuccessMessage] = (0, import_react38.useState)(null);
|
|
3135
|
+
console.log("LinkNodeButton props:", props);
|
|
3095
3136
|
const extractFieldNames = (0, import_react38.useCallback)((template) => {
|
|
3096
3137
|
if (!template) return [];
|
|
3097
3138
|
const regex = /\{(\{\})?([a-zA-Z_$][a-zA-Z0-9_$]*)(?:\}\})?\}/g;
|
|
@@ -3099,35 +3140,38 @@ var init_LinkNodeButton = __esm({
|
|
|
3099
3140
|
const fieldNames = matches.map((match) => match[2] || match[1]).filter((name, index, self) => self.indexOf(name) === index);
|
|
3100
3141
|
return fieldNames;
|
|
3101
3142
|
}, []);
|
|
3102
|
-
const replaceTemplateVariables = (0, import_react38.useCallback)(
|
|
3103
|
-
|
|
3104
|
-
|
|
3105
|
-
|
|
3106
|
-
|
|
3107
|
-
|
|
3108
|
-
|
|
3109
|
-
|
|
3110
|
-
|
|
3111
|
-
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
|
|
3120
|
-
|
|
3121
|
-
|
|
3122
|
-
|
|
3123
|
-
|
|
3124
|
-
|
|
3125
|
-
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
|
-
|
|
3143
|
+
const replaceTemplateVariables = (0, import_react38.useCallback)(
|
|
3144
|
+
(template, responseData) => {
|
|
3145
|
+
if (!template) return template;
|
|
3146
|
+
let result = template;
|
|
3147
|
+
const fieldNames = extractFieldNames(template);
|
|
3148
|
+
if (responseData) {
|
|
3149
|
+
fieldNames.forEach((fieldName) => {
|
|
3150
|
+
const value = getNestedValue7(responseData, fieldName);
|
|
3151
|
+
if (value !== void 0) {
|
|
3152
|
+
const regex1 = new RegExp(`\\{${fieldName}\\}`, "g");
|
|
3153
|
+
const regex2 = new RegExp(`\\{\\{${fieldName}\\}\\}`, "g");
|
|
3154
|
+
result = result.replace(regex1, String(value));
|
|
3155
|
+
result = result.replace(regex2, String(value));
|
|
3156
|
+
}
|
|
3157
|
+
});
|
|
3158
|
+
}
|
|
3159
|
+
if (props.routeParameters) {
|
|
3160
|
+
Object.entries(props.routeParameters).forEach(([key, value]) => {
|
|
3161
|
+
const regex = new RegExp(`\\{\\{${key}\\}\\}`, "g");
|
|
3162
|
+
result = result.replace(regex, String(value));
|
|
3163
|
+
});
|
|
3164
|
+
}
|
|
3165
|
+
if (dataitem) {
|
|
3166
|
+
Object.entries(dataitem).forEach(([key, value]) => {
|
|
3167
|
+
const regex = new RegExp(`\\{\\{${key}\\}\\}`, "g");
|
|
3168
|
+
result = result.replace(regex, String(value));
|
|
3169
|
+
});
|
|
3170
|
+
}
|
|
3171
|
+
return result;
|
|
3172
|
+
},
|
|
3173
|
+
[props.routeParameters, dataitem, extractFieldNames]
|
|
3174
|
+
);
|
|
3131
3175
|
const getNestedValue7 = (0, import_react38.useCallback)((obj, path) => {
|
|
3132
3176
|
if (!obj || !path) return void 0;
|
|
3133
3177
|
if (obj[path] !== void 0) {
|
|
@@ -3145,7 +3189,10 @@ var init_LinkNodeButton = __esm({
|
|
|
3145
3189
|
}, []);
|
|
3146
3190
|
const onClick = (0, import_react38.useCallback)(async () => {
|
|
3147
3191
|
if (!node.postUrl) {
|
|
3148
|
-
return {
|
|
3192
|
+
return {
|
|
3193
|
+
isSuccessful: false,
|
|
3194
|
+
message: "No POST URL configured for this button"
|
|
3195
|
+
};
|
|
3149
3196
|
}
|
|
3150
3197
|
setIsLoading(true);
|
|
3151
3198
|
try {
|
|
@@ -3171,6 +3218,7 @@ var init_LinkNodeButton = __esm({
|
|
|
3171
3218
|
}
|
|
3172
3219
|
if (response?.message) {
|
|
3173
3220
|
ToastService_default.showSuccess(response.message);
|
|
3221
|
+
setSuccessMessage(response.message);
|
|
3174
3222
|
}
|
|
3175
3223
|
if (response && node.redirectUrl) {
|
|
3176
3224
|
const fieldNames = extractFieldNames(node.redirectUrl);
|
|
@@ -3193,7 +3241,9 @@ var init_LinkNodeButton = __esm({
|
|
|
3193
3241
|
}
|
|
3194
3242
|
});
|
|
3195
3243
|
console.log("Field value map:", fieldValueMap);
|
|
3196
|
-
const missingFields = fieldNames.filter(
|
|
3244
|
+
const missingFields = fieldNames.filter(
|
|
3245
|
+
(fieldName) => !fieldValueMap[fieldName]
|
|
3246
|
+
);
|
|
3197
3247
|
if (missingFields.length > 0) {
|
|
3198
3248
|
console.warn(`Missing field values for: ${missingFields.join(", ")}`);
|
|
3199
3249
|
}
|
|
@@ -3204,7 +3254,10 @@ var init_LinkNodeButton = __esm({
|
|
|
3204
3254
|
resolvedRedirectUrl = resolvedRedirectUrl.replace(regex1, value);
|
|
3205
3255
|
resolvedRedirectUrl = resolvedRedirectUrl.replace(regex2, value);
|
|
3206
3256
|
});
|
|
3207
|
-
resolvedRedirectUrl = replaceTemplateVariables(
|
|
3257
|
+
resolvedRedirectUrl = replaceTemplateVariables(
|
|
3258
|
+
resolvedRedirectUrl,
|
|
3259
|
+
response
|
|
3260
|
+
);
|
|
3208
3261
|
console.log("Final redirect URL:", resolvedRedirectUrl);
|
|
3209
3262
|
if (resolvedRedirectUrl && !resolvedRedirectUrl.includes("{")) {
|
|
3210
3263
|
window.location.href = resolvedRedirectUrl;
|
|
@@ -3215,14 +3268,27 @@ var init_LinkNodeButton = __esm({
|
|
|
3215
3268
|
return { isSuccessful: false, message: errorMessage };
|
|
3216
3269
|
}
|
|
3217
3270
|
setIsLoading(false);
|
|
3218
|
-
return {
|
|
3271
|
+
return {
|
|
3272
|
+
isSuccessful: true,
|
|
3273
|
+
message: response?.message,
|
|
3274
|
+
result: response
|
|
3275
|
+
};
|
|
3219
3276
|
} catch (err) {
|
|
3220
3277
|
console.error("Button API call failed:", err);
|
|
3221
3278
|
const errorMessage = err.message || "An unexpected error occurred";
|
|
3222
3279
|
setIsLoading(false);
|
|
3223
3280
|
return { isSuccessful: false, message: errorMessage };
|
|
3224
3281
|
}
|
|
3225
|
-
}, [
|
|
3282
|
+
}, [
|
|
3283
|
+
node.postUrl,
|
|
3284
|
+
node.payload,
|
|
3285
|
+
node.redirectUrl,
|
|
3286
|
+
replaceTemplateVariables,
|
|
3287
|
+
extractFieldNames,
|
|
3288
|
+
getNestedValue7,
|
|
3289
|
+
props.apiBaseUrl,
|
|
3290
|
+
props.session
|
|
3291
|
+
]);
|
|
3226
3292
|
const renderButtonContent = () => {
|
|
3227
3293
|
if (children) {
|
|
3228
3294
|
return children;
|
|
@@ -3232,14 +3298,41 @@ var init_LinkNodeButton = __esm({
|
|
|
3232
3298
|
}
|
|
3233
3299
|
return node.title || "Button";
|
|
3234
3300
|
};
|
|
3301
|
+
const fontSize = node.children?.[0]?.style?.match(/font-size:\s*([^;]+)/)?.[1];
|
|
3235
3302
|
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "link-button-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
3236
3303
|
Button_default,
|
|
3237
3304
|
{
|
|
3238
3305
|
ButtonType: linkType,
|
|
3239
3306
|
onClick,
|
|
3240
|
-
disabled: isLoading,
|
|
3307
|
+
disabled: isLoading || !!successMessage,
|
|
3241
3308
|
className: "w-full",
|
|
3242
|
-
children:
|
|
3309
|
+
children: successMessage ? /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
3310
|
+
"span",
|
|
3311
|
+
{
|
|
3312
|
+
style: fontSize ? { fontSize } : void 0,
|
|
3313
|
+
className: "inline-flex items-center gap-2",
|
|
3314
|
+
children: [
|
|
3315
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
3316
|
+
"svg",
|
|
3317
|
+
{
|
|
3318
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3319
|
+
viewBox: "0 0 20 20",
|
|
3320
|
+
fill: "currentColor",
|
|
3321
|
+
className: "w-5 h-5",
|
|
3322
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
3323
|
+
"path",
|
|
3324
|
+
{
|
|
3325
|
+
fillRule: "evenodd",
|
|
3326
|
+
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",
|
|
3327
|
+
clipRule: "evenodd"
|
|
3328
|
+
}
|
|
3329
|
+
)
|
|
3330
|
+
}
|
|
3331
|
+
),
|
|
3332
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { children: successMessage })
|
|
3333
|
+
]
|
|
3334
|
+
}
|
|
3335
|
+
) : renderButtonContent()
|
|
3243
3336
|
}
|
|
3244
3337
|
) });
|
|
3245
3338
|
};
|
package/dist/index.mjs
CHANGED
|
@@ -31,7 +31,7 @@ import {
|
|
|
31
31
|
Button_default,
|
|
32
32
|
ClientButton_default,
|
|
33
33
|
ToastService_default
|
|
34
|
-
} from "./chunk-
|
|
34
|
+
} from "./chunk-RHVNJMS4.mjs";
|
|
35
35
|
import "./chunk-56HSDML5.mjs";
|
|
36
36
|
|
|
37
37
|
// src/components/controls/view/ViewControl.tsx
|
|
@@ -407,7 +407,7 @@ var ViewControl_default = ViewControl;
|
|
|
407
407
|
|
|
408
408
|
// src/components/controls/edit/InputControl.tsx
|
|
409
409
|
import dynamic4 from "next/dynamic";
|
|
410
|
-
var InputControl = dynamic4(() => import("./InputControlClient-
|
|
410
|
+
var InputControl = dynamic4(() => import("./InputControlClient-5RK7QDZZ.mjs"), {
|
|
411
411
|
ssr: false
|
|
412
412
|
});
|
|
413
413
|
var InputControl_default = InputControl;
|
|
@@ -611,7 +611,7 @@ var ImageNode_default = ImageNode;
|
|
|
611
611
|
// src/components/pageRenderingEngine/nodes/LinkNode.tsx
|
|
612
612
|
import dynamic6 from "next/dynamic";
|
|
613
613
|
import { Fragment, jsx as jsx18, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
614
|
-
var LinkNodeButton = dynamic6(() => import("./LinkNodeButton-
|
|
614
|
+
var LinkNodeButton = dynamic6(() => import("./LinkNodeButton-BIZA2NPE.mjs"), {
|
|
615
615
|
ssr: false
|
|
616
616
|
});
|
|
617
617
|
function getNestedValue2(obj, path) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@acoustte-digital-services/digitalstore-controls-dev",
|
|
3
|
-
"version": "0.8.1-dev.
|
|
3
|
+
"version": "0.8.1-dev.20260722070133",
|
|
4
4
|
"description": "Reusable React components",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.mjs",
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
"mlly": "^1.8.0",
|
|
66
66
|
"ms": "^2.1.3",
|
|
67
67
|
"mz": "^2.7.0",
|
|
68
|
-
"next": "^15.5.
|
|
68
|
+
"next": "^15.5.21",
|
|
69
69
|
"object-assign": "^4.1.1",
|
|
70
70
|
"pathe": "^2.0.3",
|
|
71
71
|
"picocolors": "^1.1.1",
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
// src/components/pageRenderingEngine/nodes/EnterAnimationClient.tsx
|
|
4
|
-
import React, { useEffect, useRef } from "react";
|
|
5
|
-
import { Fragment, jsx } from "react/jsx-runtime";
|
|
6
|
-
function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
7
|
-
const ref = useRef(null);
|
|
8
|
-
console.log("render");
|
|
9
|
-
useEffect(() => {
|
|
10
|
-
console.log("effect");
|
|
11
|
-
console.log("ref", ref.current);
|
|
12
|
-
if (!hasEnterAnimation) {
|
|
13
|
-
console.log("no animation");
|
|
14
|
-
return;
|
|
15
|
-
}
|
|
16
|
-
if (!ref.current) {
|
|
17
|
-
console.log("no ref");
|
|
18
|
-
return;
|
|
19
|
-
}
|
|
20
|
-
console.log("observer started");
|
|
21
|
-
}, []);
|
|
22
|
-
useEffect(() => {
|
|
23
|
-
if (!hasEnterAnimation || !ref.current) return;
|
|
24
|
-
const observer = new IntersectionObserver(
|
|
25
|
-
(entries) => {
|
|
26
|
-
entries.forEach((entry) => {
|
|
27
|
-
if (entry.isIntersecting) {
|
|
28
|
-
entry.target.classList.add("visible");
|
|
29
|
-
observer.unobserve(entry.target);
|
|
30
|
-
}
|
|
31
|
-
});
|
|
32
|
-
},
|
|
33
|
-
{ threshold: 0.1 }
|
|
34
|
-
);
|
|
35
|
-
observer.observe(ref.current);
|
|
36
|
-
return () => observer.disconnect();
|
|
37
|
-
}, [hasEnterAnimation]);
|
|
38
|
-
if (!children) return null;
|
|
39
|
-
return /* @__PURE__ */ jsx(Fragment, { children: children && // enforce passing the ref to Wrapper
|
|
40
|
-
//@ts-ignore
|
|
41
|
-
React.cloneElement(children, { ref }) });
|
|
42
|
-
}
|
|
43
|
-
export {
|
|
44
|
-
EnterAnimationClient as default
|
|
45
|
-
};
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
"use client";
|
|
4
|
-
|
|
5
|
-
// src/components/pageRenderingEngine/nodes/EnterAnimationClient.tsx
|
|
6
|
-
import React, { useEffect, useRef } from "react";
|
|
7
|
-
import { Fragment, jsx } from "react/jsx-runtime";
|
|
8
|
-
function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
9
|
-
const ref = useRef(null);
|
|
10
|
-
console.log("render");
|
|
11
|
-
useEffect(() => {
|
|
12
|
-
console.log("effect");
|
|
13
|
-
console.log("ref", ref.current);
|
|
14
|
-
if (!hasEnterAnimation) {
|
|
15
|
-
console.log("no animation");
|
|
16
|
-
return;
|
|
17
|
-
}
|
|
18
|
-
if (!ref.current) {
|
|
19
|
-
console.log("no ref");
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
console.log("observer started");
|
|
23
|
-
}, []);
|
|
24
|
-
useEffect(() => {
|
|
25
|
-
if (!hasEnterAnimation || !ref.current) return;
|
|
26
|
-
const observer = new IntersectionObserver(
|
|
27
|
-
(entries) => {
|
|
28
|
-
entries.forEach((entry) => {
|
|
29
|
-
if (entry.isIntersecting) {
|
|
30
|
-
entry.target.classList.add("visible");
|
|
31
|
-
observer.unobserve(entry.target);
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
},
|
|
35
|
-
{ threshold: 0.1 }
|
|
36
|
-
);
|
|
37
|
-
observer.observe(ref.current);
|
|
38
|
-
return () => observer.disconnect();
|
|
39
|
-
}, [hasEnterAnimation]);
|
|
40
|
-
if (!children) return null;
|
|
41
|
-
return /* @__PURE__ */ jsx(Fragment, { children: children && // enforce passing the ref to Wrapper
|
|
42
|
-
//@ts-ignore
|
|
43
|
-
React.cloneElement(children, { ref }) });
|
|
44
|
-
}
|
|
45
|
-
export {
|
|
46
|
-
EnterAnimationClient as default
|
|
47
|
-
};
|