@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260324095329 → 0.8.1-dev.20260324114714
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/index.d.mts +6 -3
- package/dist/index.d.ts +6 -3
- package/dist/index.js +84 -62
- package/dist/index.mjs +56 -36
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { ComponentType } from 'react';
|
|
2
2
|
|
|
3
3
|
interface ViewControlProps {
|
|
4
4
|
value?: unknown;
|
|
@@ -205,8 +205,11 @@ interface PageBodyRendererProps {
|
|
|
205
205
|
donotApplyContainerLargeClass?: boolean;
|
|
206
206
|
serviceClient?: ServiceClientInterface;
|
|
207
207
|
assetBaseUrl?: string;
|
|
208
|
-
widgetRegistry?: Record<string, React.ComponentType<any>>;
|
|
209
208
|
}
|
|
210
209
|
declare const PageBodyRenderer: React.FC<PageBodyRendererProps>;
|
|
211
210
|
|
|
212
|
-
|
|
211
|
+
type WidgetRegistryType = Record<string, ComponentType<any>>;
|
|
212
|
+
declare const registerWidgets: (widgets: WidgetRegistryType) => void;
|
|
213
|
+
declare const getWidget: (code: string) => ComponentType<any> | undefined;
|
|
214
|
+
|
|
215
|
+
export { type ActionResponse, DataList, InputControl, type InputControlProps, InputControlType, PageBodyRenderer, ViewControl, type ViewControlProps, ViewControlTypes, getWidget, registerWidgets };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { ComponentType } from 'react';
|
|
2
2
|
|
|
3
3
|
interface ViewControlProps {
|
|
4
4
|
value?: unknown;
|
|
@@ -205,8 +205,11 @@ interface PageBodyRendererProps {
|
|
|
205
205
|
donotApplyContainerLargeClass?: boolean;
|
|
206
206
|
serviceClient?: ServiceClientInterface;
|
|
207
207
|
assetBaseUrl?: string;
|
|
208
|
-
widgetRegistry?: Record<string, React.ComponentType<any>>;
|
|
209
208
|
}
|
|
210
209
|
declare const PageBodyRenderer: React.FC<PageBodyRendererProps>;
|
|
211
210
|
|
|
212
|
-
|
|
211
|
+
type WidgetRegistryType = Record<string, ComponentType<any>>;
|
|
212
|
+
declare const registerWidgets: (widgets: WidgetRegistryType) => void;
|
|
213
|
+
declare const getWidget: (code: string) => ComponentType<any> | undefined;
|
|
214
|
+
|
|
215
|
+
export { type ActionResponse, DataList, InputControl, type InputControlProps, InputControlType, PageBodyRenderer, ViewControl, type ViewControlProps, ViewControlTypes, getWidget, registerWidgets };
|
package/dist/index.js
CHANGED
|
@@ -37,7 +37,9 @@ __export(index_exports, {
|
|
|
37
37
|
InputControlType: () => InputControlType_default,
|
|
38
38
|
PageBodyRenderer: () => PageBodyRenderer_default,
|
|
39
39
|
ViewControl: () => ViewControl_default,
|
|
40
|
-
ViewControlTypes: () => ViewControlTypes_default
|
|
40
|
+
ViewControlTypes: () => ViewControlTypes_default,
|
|
41
|
+
getWidget: () => getWidget,
|
|
42
|
+
registerWidgets: () => registerWidgets
|
|
41
43
|
});
|
|
42
44
|
module.exports = __toCommonJS(index_exports);
|
|
43
45
|
|
|
@@ -2547,7 +2549,7 @@ var DataList = (props) => {
|
|
|
2547
2549
|
var DataList_default = DataList;
|
|
2548
2550
|
|
|
2549
2551
|
// src/components/pageRenderingEngine/PageBodyRenderer.tsx
|
|
2550
|
-
var
|
|
2552
|
+
var import_react50 = __toESM(require("react"));
|
|
2551
2553
|
|
|
2552
2554
|
// src/components/pageRenderingEngine/nodes/ParagraphNode.tsx
|
|
2553
2555
|
var import_react36 = __toESM(require("react"));
|
|
@@ -3088,8 +3090,16 @@ var ImageNode = (props) => {
|
|
|
3088
3090
|
};
|
|
3089
3091
|
var ImageNode_default = ImageNode;
|
|
3090
3092
|
|
|
3093
|
+
// src/components/pageRenderingEngine/nodes/WidgetRegistry.tsx
|
|
3094
|
+
var registry = {};
|
|
3095
|
+
var registerWidgets = (widgets) => {
|
|
3096
|
+
Object.assign(registry, widgets);
|
|
3097
|
+
};
|
|
3098
|
+
var getWidget = (code) => {
|
|
3099
|
+
return registry[code];
|
|
3100
|
+
};
|
|
3101
|
+
|
|
3091
3102
|
// src/components/pageRenderingEngine/nodes/WidgetNode.tsx
|
|
3092
|
-
var import_react43 = __toESM(require("react"));
|
|
3093
3103
|
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
3094
3104
|
var WidgetNode = (props) => {
|
|
3095
3105
|
const getWidgetParameters = () => {
|
|
@@ -3145,28 +3155,40 @@ var WidgetNode = (props) => {
|
|
|
3145
3155
|
widgetInputParameters["widgetTitle"] = props.node.widgetTitle;
|
|
3146
3156
|
return widgetInputParameters;
|
|
3147
3157
|
};
|
|
3148
|
-
const widgetCode = props.node
|
|
3149
|
-
|
|
3158
|
+
const widgetCode = props.node?.widgetCode;
|
|
3159
|
+
if (!widgetCode) {
|
|
3160
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_jsx_runtime56.Fragment, { children: "Invalid widget" });
|
|
3161
|
+
}
|
|
3162
|
+
const SelectedWidget = getWidget(widgetCode);
|
|
3150
3163
|
if (!SelectedWidget) {
|
|
3151
|
-
|
|
3164
|
+
if (process.env.NODE_ENV !== "production") {
|
|
3165
|
+
console.warn("Widget not found:", widgetCode);
|
|
3166
|
+
}
|
|
3152
3167
|
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
|
|
3153
3168
|
"Widget not found: ",
|
|
3154
3169
|
widgetCode
|
|
3155
3170
|
] });
|
|
3156
3171
|
}
|
|
3157
|
-
|
|
3158
|
-
|
|
3159
|
-
|
|
3160
|
-
|
|
3161
|
-
|
|
3162
|
-
|
|
3163
|
-
|
|
3164
|
-
|
|
3172
|
+
const widgetParams = getWidgetParameters();
|
|
3173
|
+
return (
|
|
3174
|
+
// eslint-disable-next-line react-hooks/static-components
|
|
3175
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
3176
|
+
SelectedWidget,
|
|
3177
|
+
{
|
|
3178
|
+
params: widgetParams,
|
|
3179
|
+
query: props.query,
|
|
3180
|
+
session: props.session,
|
|
3181
|
+
host: props.host,
|
|
3182
|
+
path: props.path,
|
|
3183
|
+
apiBaseUrl: props.apiBaseUrl
|
|
3184
|
+
}
|
|
3185
|
+
)
|
|
3186
|
+
);
|
|
3165
3187
|
};
|
|
3166
3188
|
var WidgetNode_default = WidgetNode;
|
|
3167
3189
|
|
|
3168
3190
|
// src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
|
|
3169
|
-
var
|
|
3191
|
+
var import_react43 = __toESM(require("react"));
|
|
3170
3192
|
|
|
3171
3193
|
// src/components/pageRenderingEngine/nodes/InputControlNode.tsx
|
|
3172
3194
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
@@ -3411,16 +3433,16 @@ var FormContainerNode = (props) => {
|
|
|
3411
3433
|
["input-control"]: InputControlNode_default
|
|
3412
3434
|
};
|
|
3413
3435
|
const { node } = props;
|
|
3414
|
-
const formRef = (0,
|
|
3436
|
+
const formRef = (0, import_react43.useRef)(null);
|
|
3415
3437
|
const initialState = {
|
|
3416
3438
|
inputValues: {},
|
|
3417
3439
|
lastPropertyChanged: ""
|
|
3418
3440
|
};
|
|
3419
|
-
const [formState, dispatch] = (0,
|
|
3420
|
-
const handleInputChange = (0,
|
|
3441
|
+
const [formState, dispatch] = (0, import_react43.useReducer)(FormReducer_default, initialState);
|
|
3442
|
+
const handleInputChange = (0, import_react43.useCallback)((updatedValues) => {
|
|
3421
3443
|
dispatch({ type: FORM_INPUT_UPDATE, name: updatedValues.name, value: updatedValues.value });
|
|
3422
3444
|
}, [dispatch]);
|
|
3423
|
-
(0,
|
|
3445
|
+
(0, import_react43.useEffect)(() => {
|
|
3424
3446
|
const fetchInitialData = async () => {
|
|
3425
3447
|
const client = new ServiceClient_default(props.apiBaseUrl, props.session);
|
|
3426
3448
|
const response = await client.getSingle(props.node.dataFetchApi, props.routeParameters);
|
|
@@ -3440,7 +3462,7 @@ var FormContainerNode = (props) => {
|
|
|
3440
3462
|
{
|
|
3441
3463
|
}
|
|
3442
3464
|
const SelectedNode = NodeTypes2[node2.type];
|
|
3443
|
-
return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
3465
|
+
return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react43.default.Fragment, { children: SelectedNode && node2.type == "input-control" && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
3444
3466
|
InputControlNode_default,
|
|
3445
3467
|
{
|
|
3446
3468
|
value: formState.inputValues[node2.name],
|
|
@@ -3455,16 +3477,16 @@ var FormContainerNode = (props) => {
|
|
|
3455
3477
|
var FormContainerNode_default = FormContainerNode;
|
|
3456
3478
|
|
|
3457
3479
|
// src/components/pageRenderingEngine/nodes/DivContainer.tsx
|
|
3458
|
-
var
|
|
3480
|
+
var import_react49 = __toESM(require("react"));
|
|
3459
3481
|
|
|
3460
3482
|
// src/components/pageRenderingEngine/nodes/IframeClient.tsx
|
|
3461
|
-
var
|
|
3483
|
+
var import_react45 = __toESM(require("react"));
|
|
3462
3484
|
|
|
3463
3485
|
// src/components/IFrameLoaderView.tsx
|
|
3464
|
-
var
|
|
3486
|
+
var import_react44 = __toESM(require("react"));
|
|
3465
3487
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
3466
3488
|
var IFrameLoaderView = (props) => {
|
|
3467
|
-
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
|
|
3489
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_react44.default.Fragment, { children: [
|
|
3468
3490
|
props.isDataFound == null && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "mt-4 bg-gray-200 rounded-md p-4 animate-pulse", children: [
|
|
3469
3491
|
/* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex items-center mb-4", children: [
|
|
3470
3492
|
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "bg-gray-300 h-8 w-8 rounded-full animate-pulse" }),
|
|
@@ -3505,10 +3527,10 @@ var IFrameLoaderView_default = IFrameLoaderView;
|
|
|
3505
3527
|
// src/components/pageRenderingEngine/nodes/IframeClient.tsx
|
|
3506
3528
|
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
3507
3529
|
var IframeClient = ({ src }) => {
|
|
3508
|
-
const iframeRef = (0,
|
|
3509
|
-
const [iframeHeight, setIframeHeight] = (0,
|
|
3510
|
-
const [isDataFound, setIsDataFound] = (0,
|
|
3511
|
-
(0,
|
|
3530
|
+
const iframeRef = (0, import_react45.useRef)(null);
|
|
3531
|
+
const [iframeHeight, setIframeHeight] = (0, import_react45.useState)("100%");
|
|
3532
|
+
const [isDataFound, setIsDataFound] = (0, import_react45.useState)(null);
|
|
3533
|
+
(0, import_react45.useEffect)(() => {
|
|
3512
3534
|
const handleReceiveMessage = (event) => {
|
|
3513
3535
|
const eventName = event?.data?.eventName;
|
|
3514
3536
|
const payload = event?.data?.payload;
|
|
@@ -3523,7 +3545,7 @@ var IframeClient = ({ src }) => {
|
|
|
3523
3545
|
window.addEventListener("message", handleReceiveMessage);
|
|
3524
3546
|
return () => window.removeEventListener("message", handleReceiveMessage);
|
|
3525
3547
|
}, []);
|
|
3526
|
-
(0,
|
|
3548
|
+
(0, import_react45.useEffect)(() => {
|
|
3527
3549
|
const handleResize = () => {
|
|
3528
3550
|
if (iframeRef.current) {
|
|
3529
3551
|
iframeRef.current.contentWindow?.postMessage({ eventName: "RESIZE" }, "*");
|
|
@@ -3535,7 +3557,7 @@ var IframeClient = ({ src }) => {
|
|
|
3535
3557
|
const handleIframeLoad = () => {
|
|
3536
3558
|
setIsDataFound(true);
|
|
3537
3559
|
};
|
|
3538
|
-
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
3560
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react45.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(IFrameLoaderView_default, { isDataFound, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
3539
3561
|
"iframe",
|
|
3540
3562
|
{
|
|
3541
3563
|
ref: iframeRef,
|
|
@@ -3578,7 +3600,7 @@ var AssetUtility = class {
|
|
|
3578
3600
|
var AssetUtility_default = AssetUtility;
|
|
3579
3601
|
|
|
3580
3602
|
// src/components/Slider.tsx
|
|
3581
|
-
var
|
|
3603
|
+
var import_react46 = __toESM(require("react"));
|
|
3582
3604
|
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
3583
3605
|
var Slider = ({
|
|
3584
3606
|
children,
|
|
@@ -3597,13 +3619,13 @@ var Slider = ({
|
|
|
3597
3619
|
pillStyle = "cumulative",
|
|
3598
3620
|
progressPosition = "bottom"
|
|
3599
3621
|
}) => {
|
|
3600
|
-
const [currentSlide, setCurrentSlide] = (0,
|
|
3601
|
-
const [transition, setTransition] = (0,
|
|
3602
|
-
const [slidesToShowState, setSlidesToShowState] = (0,
|
|
3622
|
+
const [currentSlide, setCurrentSlide] = (0, import_react46.useState)(0);
|
|
3623
|
+
const [transition, setTransition] = (0, import_react46.useState)(true);
|
|
3624
|
+
const [slidesToShowState, setSlidesToShowState] = (0, import_react46.useState)(
|
|
3603
3625
|
typeof slidesToShow === "number" ? slidesToShow : slidesToShow.large
|
|
3604
3626
|
);
|
|
3605
|
-
const [isPlaying, setIsPlaying] = (0,
|
|
3606
|
-
(0,
|
|
3627
|
+
const [isPlaying, setIsPlaying] = (0, import_react46.useState)(autoplay);
|
|
3628
|
+
(0, import_react46.useEffect)(() => {
|
|
3607
3629
|
if (typeof slidesToShow === "number") return;
|
|
3608
3630
|
const handleResize = () => {
|
|
3609
3631
|
if (window.innerWidth >= 1024) {
|
|
@@ -3618,7 +3640,7 @@ var Slider = ({
|
|
|
3618
3640
|
window.addEventListener("resize", handleResize);
|
|
3619
3641
|
return () => window.removeEventListener("resize", handleResize);
|
|
3620
3642
|
}, [slidesToShow]);
|
|
3621
|
-
(0,
|
|
3643
|
+
(0, import_react46.useEffect)(() => {
|
|
3622
3644
|
if (!autoplay) return;
|
|
3623
3645
|
const timer = setInterval(() => {
|
|
3624
3646
|
if (isPlaying) {
|
|
@@ -3627,7 +3649,7 @@ var Slider = ({
|
|
|
3627
3649
|
}, autoplay_speed);
|
|
3628
3650
|
return () => clearInterval(timer);
|
|
3629
3651
|
}, [autoplay, autoplay_speed, currentSlide, isPlaying]);
|
|
3630
|
-
const totalSlides =
|
|
3652
|
+
const totalSlides = import_react46.Children.count(children);
|
|
3631
3653
|
const maxSlide = totalSlides - slidesToShowState;
|
|
3632
3654
|
const nextSlide = () => {
|
|
3633
3655
|
if (currentSlide >= maxSlide) {
|
|
@@ -3672,8 +3694,8 @@ var Slider = ({
|
|
|
3672
3694
|
}
|
|
3673
3695
|
};
|
|
3674
3696
|
const translateX = -currentSlide * (100 / slidesToShowState);
|
|
3675
|
-
const slides =
|
|
3676
|
-
if (!
|
|
3697
|
+
const slides = import_react46.Children.map(children, (child, index) => {
|
|
3698
|
+
if (!import_react46.default.isValidElement(child)) return null;
|
|
3677
3699
|
const childProps = child.props;
|
|
3678
3700
|
const mergedClassName = `${childProps.className ?? ""} w-full`.trim();
|
|
3679
3701
|
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
@@ -3681,7 +3703,7 @@ var Slider = ({
|
|
|
3681
3703
|
{
|
|
3682
3704
|
className: `flex-none ${scaleOnHover ? "group hover:z-50" : ""} relative`,
|
|
3683
3705
|
style: { width: `calc(${100 / slidesToShowState}%)`, paddingRight: gap },
|
|
3684
|
-
children: (0,
|
|
3706
|
+
children: (0, import_react46.cloneElement)(child, {
|
|
3685
3707
|
className: mergedClassName
|
|
3686
3708
|
})
|
|
3687
3709
|
},
|
|
@@ -3794,13 +3816,13 @@ var ProgressPill = ({
|
|
|
3794
3816
|
currentSlide,
|
|
3795
3817
|
totalSlides
|
|
3796
3818
|
}) => {
|
|
3797
|
-
const [progress, setProgress] = (0,
|
|
3798
|
-
(0,
|
|
3819
|
+
const [progress, setProgress] = (0, import_react46.useState)(0);
|
|
3820
|
+
(0, import_react46.useEffect)(() => {
|
|
3799
3821
|
if (active) {
|
|
3800
3822
|
setProgress(0);
|
|
3801
3823
|
}
|
|
3802
3824
|
}, [active, index]);
|
|
3803
|
-
(0,
|
|
3825
|
+
(0, import_react46.useEffect)(() => {
|
|
3804
3826
|
if (!active || !isPlaying) {
|
|
3805
3827
|
if (!active) {
|
|
3806
3828
|
setProgress(0);
|
|
@@ -4002,11 +4024,11 @@ var AnimationUtility = class {
|
|
|
4002
4024
|
var AnimationUtility_default = AnimationUtility;
|
|
4003
4025
|
|
|
4004
4026
|
// src/components/pageRenderingEngine/nodes/EnterAnimationClient.tsx
|
|
4005
|
-
var
|
|
4027
|
+
var import_react47 = __toESM(require("react"));
|
|
4006
4028
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
4007
4029
|
function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
4008
|
-
const ref = (0,
|
|
4009
|
-
(0,
|
|
4030
|
+
const ref = (0, import_react47.useRef)(null);
|
|
4031
|
+
(0, import_react47.useEffect)(() => {
|
|
4010
4032
|
if (!hasEnterAnimation || !ref.current) return;
|
|
4011
4033
|
const observer = new IntersectionObserver(
|
|
4012
4034
|
(entries) => {
|
|
@@ -4024,7 +4046,7 @@ function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
|
4024
4046
|
}, [hasEnterAnimation]);
|
|
4025
4047
|
return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_jsx_runtime63.Fragment, { children: children && // enforce passing the ref to Wrapper
|
|
4026
4048
|
//@ts-ignore
|
|
4027
|
-
|
|
4049
|
+
import_react47.default.cloneElement(children, { ref }) });
|
|
4028
4050
|
}
|
|
4029
4051
|
|
|
4030
4052
|
// src/components/utilities/PathUtility.tsx
|
|
@@ -4108,11 +4130,11 @@ var NoDataFound = () => {
|
|
|
4108
4130
|
var NoDataFound_default = NoDataFound;
|
|
4109
4131
|
|
|
4110
4132
|
// src/components/Pagination.tsx
|
|
4111
|
-
var
|
|
4133
|
+
var import_react48 = require("react");
|
|
4112
4134
|
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
4113
4135
|
var Pagination = (props) => {
|
|
4114
4136
|
const { dataset, path, query, showPageSizeSelector = false, showJumpToPage = false } = props;
|
|
4115
|
-
const builder = (0,
|
|
4137
|
+
const builder = (0, import_react48.useMemo)(() => {
|
|
4116
4138
|
const b = new OdataBuilder(path);
|
|
4117
4139
|
if (query) b.setQuery(query);
|
|
4118
4140
|
return b;
|
|
@@ -4470,7 +4492,7 @@ var DivContainer = async (props) => {
|
|
|
4470
4492
|
}
|
|
4471
4493
|
const SelectedNode = NodeTypes2[node.type];
|
|
4472
4494
|
if (!SelectedNode) return null;
|
|
4473
|
-
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
4495
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react49.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
4474
4496
|
SelectedNode,
|
|
4475
4497
|
{
|
|
4476
4498
|
node,
|
|
@@ -4569,9 +4591,9 @@ var DivContainer = async (props) => {
|
|
|
4569
4591
|
props.node.autoFormat && "auto-format",
|
|
4570
4592
|
props.node.bgClass
|
|
4571
4593
|
].filter(Boolean).join(" ");
|
|
4572
|
-
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
4594
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_react49.default.Fragment, { children: [
|
|
4573
4595
|
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("style", { dangerouslySetInnerHTML: { __html: cssResult.css + animationCSS } }),
|
|
4574
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(EnterAnimationClient, { hasEnterAnimation: !!props.node.enterAnimation, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
4596
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(EnterAnimationClient, { hasEnterAnimation: !!props.node.enterAnimation, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react49.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
4575
4597
|
Wrapper,
|
|
4576
4598
|
{
|
|
4577
4599
|
id: guid,
|
|
@@ -4580,7 +4602,7 @@ var DivContainer = async (props) => {
|
|
|
4580
4602
|
...wrapperProps,
|
|
4581
4603
|
children: dataToRender.map(
|
|
4582
4604
|
(item, idx) => item?.links?.view && renderLink ? renderChildren(props.node.children, props, item, idx, props.href ? void 0 : item?.links?.view)?.map(
|
|
4583
|
-
(child, i) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
4605
|
+
(child, i) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react49.default.Fragment, { children: child }, i)
|
|
4584
4606
|
) : renderChildren(props.node.children, props, item, idx)
|
|
4585
4607
|
)
|
|
4586
4608
|
}
|
|
@@ -4618,11 +4640,11 @@ var PageBodyRenderer = (props) => {
|
|
|
4618
4640
|
if (pageBodyTree && pageBodyTree.root) {
|
|
4619
4641
|
rootNode = pageBodyTree.root;
|
|
4620
4642
|
}
|
|
4621
|
-
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
4643
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react50.default.Fragment, { children: rootNode && rootNode?.children?.map((node, index) => {
|
|
4622
4644
|
{
|
|
4623
4645
|
}
|
|
4624
4646
|
const SelectedNode = NodeTypes[node.type];
|
|
4625
|
-
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
4647
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react50.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react50.default.Fragment, { children: node.type == "layout-container" ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react50.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
4626
4648
|
SelectedNode,
|
|
4627
4649
|
{
|
|
4628
4650
|
node,
|
|
@@ -4634,10 +4656,9 @@ var PageBodyRenderer = (props) => {
|
|
|
4634
4656
|
path: props.path,
|
|
4635
4657
|
apiBaseUrl: props.apiBaseUrl,
|
|
4636
4658
|
serviceClient: props.serviceClient,
|
|
4637
|
-
assetBaseUrl: props.assetBaseUrl
|
|
4638
|
-
widgetRegistry: props.widgetRegistry
|
|
4659
|
+
assetBaseUrl: props.assetBaseUrl
|
|
4639
4660
|
}
|
|
4640
|
-
) }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
4661
|
+
) }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react50.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
4641
4662
|
SelectedNode,
|
|
4642
4663
|
{
|
|
4643
4664
|
node,
|
|
@@ -4648,8 +4669,7 @@ var PageBodyRenderer = (props) => {
|
|
|
4648
4669
|
path: props.path,
|
|
4649
4670
|
apiBaseUrl: props.apiBaseUrl,
|
|
4650
4671
|
serviceClient: props.serviceClient,
|
|
4651
|
-
assetBaseUrl: props.assetBaseUrl
|
|
4652
|
-
widgetRegistry: props.widgetRegistry
|
|
4672
|
+
assetBaseUrl: props.assetBaseUrl
|
|
4653
4673
|
}
|
|
4654
4674
|
) }) }) }, index);
|
|
4655
4675
|
}) });
|
|
@@ -4662,5 +4682,7 @@ var PageBodyRenderer_default = PageBodyRenderer;
|
|
|
4662
4682
|
InputControlType,
|
|
4663
4683
|
PageBodyRenderer,
|
|
4664
4684
|
ViewControl,
|
|
4665
|
-
ViewControlTypes
|
|
4685
|
+
ViewControlTypes,
|
|
4686
|
+
getWidget,
|
|
4687
|
+
registerWidgets
|
|
4666
4688
|
});
|
package/dist/index.mjs
CHANGED
|
@@ -2515,7 +2515,7 @@ var DataList = (props) => {
|
|
|
2515
2515
|
var DataList_default = DataList;
|
|
2516
2516
|
|
|
2517
2517
|
// src/components/pageRenderingEngine/PageBodyRenderer.tsx
|
|
2518
|
-
import
|
|
2518
|
+
import React49 from "react";
|
|
2519
2519
|
|
|
2520
2520
|
// src/components/pageRenderingEngine/nodes/ParagraphNode.tsx
|
|
2521
2521
|
import React36 from "react";
|
|
@@ -3056,8 +3056,16 @@ var ImageNode = (props) => {
|
|
|
3056
3056
|
};
|
|
3057
3057
|
var ImageNode_default = ImageNode;
|
|
3058
3058
|
|
|
3059
|
+
// src/components/pageRenderingEngine/nodes/WidgetRegistry.tsx
|
|
3060
|
+
var registry = {};
|
|
3061
|
+
var registerWidgets = (widgets) => {
|
|
3062
|
+
Object.assign(registry, widgets);
|
|
3063
|
+
};
|
|
3064
|
+
var getWidget = (code) => {
|
|
3065
|
+
return registry[code];
|
|
3066
|
+
};
|
|
3067
|
+
|
|
3059
3068
|
// src/components/pageRenderingEngine/nodes/WidgetNode.tsx
|
|
3060
|
-
import React42, { Suspense } from "react";
|
|
3061
3069
|
import { Fragment as Fragment7, jsx as jsx56, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3062
3070
|
var WidgetNode = (props) => {
|
|
3063
3071
|
const getWidgetParameters = () => {
|
|
@@ -3113,28 +3121,40 @@ var WidgetNode = (props) => {
|
|
|
3113
3121
|
widgetInputParameters["widgetTitle"] = props.node.widgetTitle;
|
|
3114
3122
|
return widgetInputParameters;
|
|
3115
3123
|
};
|
|
3116
|
-
const widgetCode = props.node
|
|
3117
|
-
|
|
3124
|
+
const widgetCode = props.node?.widgetCode;
|
|
3125
|
+
if (!widgetCode) {
|
|
3126
|
+
return /* @__PURE__ */ jsx56(Fragment7, { children: "Invalid widget" });
|
|
3127
|
+
}
|
|
3128
|
+
const SelectedWidget = getWidget(widgetCode);
|
|
3118
3129
|
if (!SelectedWidget) {
|
|
3119
|
-
|
|
3130
|
+
if (process.env.NODE_ENV !== "production") {
|
|
3131
|
+
console.warn("Widget not found:", widgetCode);
|
|
3132
|
+
}
|
|
3120
3133
|
return /* @__PURE__ */ jsxs27(Fragment7, { children: [
|
|
3121
3134
|
"Widget not found: ",
|
|
3122
3135
|
widgetCode
|
|
3123
3136
|
] });
|
|
3124
3137
|
}
|
|
3125
|
-
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
|
-
|
|
3131
|
-
|
|
3132
|
-
|
|
3138
|
+
const widgetParams = getWidgetParameters();
|
|
3139
|
+
return (
|
|
3140
|
+
// eslint-disable-next-line react-hooks/static-components
|
|
3141
|
+
/* @__PURE__ */ jsx56(
|
|
3142
|
+
SelectedWidget,
|
|
3143
|
+
{
|
|
3144
|
+
params: widgetParams,
|
|
3145
|
+
query: props.query,
|
|
3146
|
+
session: props.session,
|
|
3147
|
+
host: props.host,
|
|
3148
|
+
path: props.path,
|
|
3149
|
+
apiBaseUrl: props.apiBaseUrl
|
|
3150
|
+
}
|
|
3151
|
+
)
|
|
3152
|
+
);
|
|
3133
3153
|
};
|
|
3134
3154
|
var WidgetNode_default = WidgetNode;
|
|
3135
3155
|
|
|
3136
3156
|
// src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
|
|
3137
|
-
import
|
|
3157
|
+
import React42, { useRef as useRef4, useReducer as useReducer2, useCallback as useCallback3, useEffect as useEffect8 } from "react";
|
|
3138
3158
|
|
|
3139
3159
|
// src/components/pageRenderingEngine/nodes/InputControlNode.tsx
|
|
3140
3160
|
import { jsx as jsx57 } from "react/jsx-runtime";
|
|
@@ -3408,7 +3428,7 @@ var FormContainerNode = (props) => {
|
|
|
3408
3428
|
{
|
|
3409
3429
|
}
|
|
3410
3430
|
const SelectedNode = NodeTypes2[node2.type];
|
|
3411
|
-
return /* @__PURE__ */ jsx58(
|
|
3431
|
+
return /* @__PURE__ */ jsx58(React42.Fragment, { children: SelectedNode && node2.type == "input-control" && /* @__PURE__ */ jsx58(
|
|
3412
3432
|
InputControlNode_default,
|
|
3413
3433
|
{
|
|
3414
3434
|
value: formState.inputValues[node2.name],
|
|
@@ -3423,16 +3443,16 @@ var FormContainerNode = (props) => {
|
|
|
3423
3443
|
var FormContainerNode_default = FormContainerNode;
|
|
3424
3444
|
|
|
3425
3445
|
// src/components/pageRenderingEngine/nodes/DivContainer.tsx
|
|
3426
|
-
import
|
|
3446
|
+
import React48 from "react";
|
|
3427
3447
|
|
|
3428
3448
|
// src/components/pageRenderingEngine/nodes/IframeClient.tsx
|
|
3429
|
-
import
|
|
3449
|
+
import React44, { useEffect as useEffect9, useRef as useRef5, useState as useState9 } from "react";
|
|
3430
3450
|
|
|
3431
3451
|
// src/components/IFrameLoaderView.tsx
|
|
3432
|
-
import
|
|
3452
|
+
import React43 from "react";
|
|
3433
3453
|
import { jsx as jsx59, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3434
3454
|
var IFrameLoaderView = (props) => {
|
|
3435
|
-
return /* @__PURE__ */ jsxs29(
|
|
3455
|
+
return /* @__PURE__ */ jsxs29(React43.Fragment, { children: [
|
|
3436
3456
|
props.isDataFound == null && /* @__PURE__ */ jsx59("div", { className: "", children: /* @__PURE__ */ jsxs29("div", { className: "mt-4 bg-gray-200 rounded-md p-4 animate-pulse", children: [
|
|
3437
3457
|
/* @__PURE__ */ jsxs29("div", { className: "flex items-center mb-4", children: [
|
|
3438
3458
|
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 h-8 w-8 rounded-full animate-pulse" }),
|
|
@@ -3503,7 +3523,7 @@ var IframeClient = ({ src }) => {
|
|
|
3503
3523
|
const handleIframeLoad = () => {
|
|
3504
3524
|
setIsDataFound(true);
|
|
3505
3525
|
};
|
|
3506
|
-
return /* @__PURE__ */ jsx60(
|
|
3526
|
+
return /* @__PURE__ */ jsx60(React44.Fragment, { children: /* @__PURE__ */ jsx60(IFrameLoaderView_default, { isDataFound, children: /* @__PURE__ */ jsx60(
|
|
3507
3527
|
"iframe",
|
|
3508
3528
|
{
|
|
3509
3529
|
ref: iframeRef,
|
|
@@ -3546,7 +3566,7 @@ var AssetUtility = class {
|
|
|
3546
3566
|
var AssetUtility_default = AssetUtility;
|
|
3547
3567
|
|
|
3548
3568
|
// src/components/Slider.tsx
|
|
3549
|
-
import
|
|
3569
|
+
import React45, { useState as useState10, useEffect as useEffect10, Children, cloneElement } from "react";
|
|
3550
3570
|
import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3551
3571
|
var Slider = ({
|
|
3552
3572
|
children,
|
|
@@ -3641,7 +3661,7 @@ var Slider = ({
|
|
|
3641
3661
|
};
|
|
3642
3662
|
const translateX = -currentSlide * (100 / slidesToShowState);
|
|
3643
3663
|
const slides = Children.map(children, (child, index) => {
|
|
3644
|
-
if (!
|
|
3664
|
+
if (!React45.isValidElement(child)) return null;
|
|
3645
3665
|
const childProps = child.props;
|
|
3646
3666
|
const mergedClassName = `${childProps.className ?? ""} w-full`.trim();
|
|
3647
3667
|
return /* @__PURE__ */ jsx62(
|
|
@@ -3970,7 +3990,7 @@ var AnimationUtility = class {
|
|
|
3970
3990
|
var AnimationUtility_default = AnimationUtility;
|
|
3971
3991
|
|
|
3972
3992
|
// src/components/pageRenderingEngine/nodes/EnterAnimationClient.tsx
|
|
3973
|
-
import
|
|
3993
|
+
import React46, { useEffect as useEffect11, useRef as useRef6 } from "react";
|
|
3974
3994
|
import { Fragment as Fragment9, jsx as jsx63 } from "react/jsx-runtime";
|
|
3975
3995
|
function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
3976
3996
|
const ref = useRef6(null);
|
|
@@ -3992,7 +4012,7 @@ function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
|
3992
4012
|
}, [hasEnterAnimation]);
|
|
3993
4013
|
return /* @__PURE__ */ jsx63(Fragment9, { children: children && // enforce passing the ref to Wrapper
|
|
3994
4014
|
//@ts-ignore
|
|
3995
|
-
|
|
4015
|
+
React46.cloneElement(children, { ref }) });
|
|
3996
4016
|
}
|
|
3997
4017
|
|
|
3998
4018
|
// src/components/utilities/PathUtility.tsx
|
|
@@ -4438,7 +4458,7 @@ var DivContainer = async (props) => {
|
|
|
4438
4458
|
}
|
|
4439
4459
|
const SelectedNode = NodeTypes2[node.type];
|
|
4440
4460
|
if (!SelectedNode) return null;
|
|
4441
|
-
return /* @__PURE__ */ jsx66(
|
|
4461
|
+
return /* @__PURE__ */ jsx66(React48.Fragment, { children: /* @__PURE__ */ jsx66(
|
|
4442
4462
|
SelectedNode,
|
|
4443
4463
|
{
|
|
4444
4464
|
node,
|
|
@@ -4537,9 +4557,9 @@ var DivContainer = async (props) => {
|
|
|
4537
4557
|
props.node.autoFormat && "auto-format",
|
|
4538
4558
|
props.node.bgClass
|
|
4539
4559
|
].filter(Boolean).join(" ");
|
|
4540
|
-
return /* @__PURE__ */ jsxs33(
|
|
4560
|
+
return /* @__PURE__ */ jsxs33(React48.Fragment, { children: [
|
|
4541
4561
|
/* @__PURE__ */ jsx66("style", { dangerouslySetInnerHTML: { __html: cssResult.css + animationCSS } }),
|
|
4542
|
-
/* @__PURE__ */ jsx66(EnterAnimationClient, { hasEnterAnimation: !!props.node.enterAnimation, children: /* @__PURE__ */ jsx66(
|
|
4562
|
+
/* @__PURE__ */ jsx66(EnterAnimationClient, { hasEnterAnimation: !!props.node.enterAnimation, children: /* @__PURE__ */ jsx66(React48.Fragment, { children: /* @__PURE__ */ jsx66(
|
|
4543
4563
|
Wrapper,
|
|
4544
4564
|
{
|
|
4545
4565
|
id: guid,
|
|
@@ -4548,7 +4568,7 @@ var DivContainer = async (props) => {
|
|
|
4548
4568
|
...wrapperProps,
|
|
4549
4569
|
children: dataToRender.map(
|
|
4550
4570
|
(item, idx) => item?.links?.view && renderLink ? renderChildren(props.node.children, props, item, idx, props.href ? void 0 : item?.links?.view)?.map(
|
|
4551
|
-
(child, i) => /* @__PURE__ */ jsx66(
|
|
4571
|
+
(child, i) => /* @__PURE__ */ jsx66(React48.Fragment, { children: child }, i)
|
|
4552
4572
|
) : renderChildren(props.node.children, props, item, idx)
|
|
4553
4573
|
)
|
|
4554
4574
|
}
|
|
@@ -4586,11 +4606,11 @@ var PageBodyRenderer = (props) => {
|
|
|
4586
4606
|
if (pageBodyTree && pageBodyTree.root) {
|
|
4587
4607
|
rootNode = pageBodyTree.root;
|
|
4588
4608
|
}
|
|
4589
|
-
return /* @__PURE__ */ jsx67(
|
|
4609
|
+
return /* @__PURE__ */ jsx67(React49.Fragment, { children: rootNode && rootNode?.children?.map((node, index) => {
|
|
4590
4610
|
{
|
|
4591
4611
|
}
|
|
4592
4612
|
const SelectedNode = NodeTypes[node.type];
|
|
4593
|
-
return /* @__PURE__ */ jsx67(
|
|
4613
|
+
return /* @__PURE__ */ jsx67(React49.Fragment, { children: SelectedNode && /* @__PURE__ */ jsx67(React49.Fragment, { children: node.type == "layout-container" ? /* @__PURE__ */ jsx67(React49.Fragment, { children: /* @__PURE__ */ jsx67(
|
|
4594
4614
|
SelectedNode,
|
|
4595
4615
|
{
|
|
4596
4616
|
node,
|
|
@@ -4602,10 +4622,9 @@ var PageBodyRenderer = (props) => {
|
|
|
4602
4622
|
path: props.path,
|
|
4603
4623
|
apiBaseUrl: props.apiBaseUrl,
|
|
4604
4624
|
serviceClient: props.serviceClient,
|
|
4605
|
-
assetBaseUrl: props.assetBaseUrl
|
|
4606
|
-
widgetRegistry: props.widgetRegistry
|
|
4625
|
+
assetBaseUrl: props.assetBaseUrl
|
|
4607
4626
|
}
|
|
4608
|
-
) }) : /* @__PURE__ */ jsx67(
|
|
4627
|
+
) }) : /* @__PURE__ */ jsx67(React49.Fragment, { children: /* @__PURE__ */ jsx67(
|
|
4609
4628
|
SelectedNode,
|
|
4610
4629
|
{
|
|
4611
4630
|
node,
|
|
@@ -4616,8 +4635,7 @@ var PageBodyRenderer = (props) => {
|
|
|
4616
4635
|
path: props.path,
|
|
4617
4636
|
apiBaseUrl: props.apiBaseUrl,
|
|
4618
4637
|
serviceClient: props.serviceClient,
|
|
4619
|
-
assetBaseUrl: props.assetBaseUrl
|
|
4620
|
-
widgetRegistry: props.widgetRegistry
|
|
4638
|
+
assetBaseUrl: props.assetBaseUrl
|
|
4621
4639
|
}
|
|
4622
4640
|
) }) }) }, index);
|
|
4623
4641
|
}) });
|
|
@@ -4629,5 +4647,7 @@ export {
|
|
|
4629
4647
|
InputControlType_default as InputControlType,
|
|
4630
4648
|
PageBodyRenderer_default as PageBodyRenderer,
|
|
4631
4649
|
ViewControl_default as ViewControl,
|
|
4632
|
-
ViewControlTypes_default as ViewControlTypes
|
|
4650
|
+
ViewControlTypes_default as ViewControlTypes,
|
|
4651
|
+
getWidget,
|
|
4652
|
+
registerWidgets
|
|
4633
4653
|
};
|
package/package.json
CHANGED