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