@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260323130039 → 0.8.1-dev.20260324072940
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 -6
- package/dist/index.d.ts +4 -6
- package/dist/index.js +910 -871
- package/dist/index.mjs +905 -866
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -39,6 +39,8 @@ var DateView = (props) => {
|
|
|
39
39
|
let timezone;
|
|
40
40
|
try {
|
|
41
41
|
const val = props.value && props.value.toString().includes("Z") ? props.value : props.value + "Z";
|
|
42
|
+
{
|
|
43
|
+
}
|
|
42
44
|
const parsedDate = new Date(val);
|
|
43
45
|
const timezoneOffset = parsedDate.getTimezoneOffset();
|
|
44
46
|
timezone = moment.tz.zone(moment.tz.guess())?.abbr(timezoneOffset);
|
|
@@ -156,6 +158,8 @@ var StatusView_default = Status;
|
|
|
156
158
|
import React8 from "react";
|
|
157
159
|
import { jsx as jsx8, jsxs } from "react/jsx-runtime";
|
|
158
160
|
var Money = (props) => {
|
|
161
|
+
{
|
|
162
|
+
}
|
|
159
163
|
const parsedNumber = parseFloat(props.value);
|
|
160
164
|
return /* @__PURE__ */ jsx8(React8.Fragment, { children: !Number.isNaN(parsedNumber) && /* @__PURE__ */ jsxs("span", { className: parsedNumber < 0 ? "text-alert" : "", children: [
|
|
161
165
|
/* @__PURE__ */ jsx8("span", { className: "mr-0.5", children: "\u20B9" }),
|
|
@@ -168,6 +172,8 @@ var MoneyView_default = Money;
|
|
|
168
172
|
import React9 from "react";
|
|
169
173
|
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
170
174
|
var MultilineTextBullets = (props) => {
|
|
175
|
+
{
|
|
176
|
+
}
|
|
171
177
|
const lines = props.value?.split("\\n");
|
|
172
178
|
return /* @__PURE__ */ jsx9(React9.Fragment, { children: /* @__PURE__ */ jsx9("ul", { className: "list-disc", children: lines && lines.map((line, index) => {
|
|
173
179
|
return /* @__PURE__ */ jsx9("li", { children: line }, index);
|
|
@@ -200,7 +206,7 @@ var ViewControl = React11.forwardRef(
|
|
|
200
206
|
[ViewControlTypes_default.booleanView]: BooleanView_default
|
|
201
207
|
// [ViewControlTypes.booleanView]: BooleanView
|
|
202
208
|
};
|
|
203
|
-
const SelectedControlComponent = ControlComponents[props.controlType];
|
|
209
|
+
const SelectedControlComponent = props.controlType ? ControlComponents[props.controlType] : void 0;
|
|
204
210
|
return /* @__PURE__ */ jsx11(React11.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx11(SelectedControlComponent, { ...props }) : "Control not found" });
|
|
205
211
|
}
|
|
206
212
|
);
|
|
@@ -2509,7 +2515,7 @@ var DataList = (props) => {
|
|
|
2509
2515
|
var DataList_default = DataList;
|
|
2510
2516
|
|
|
2511
2517
|
// src/components/pageRenderingEngine/PageBodyRenderer.tsx
|
|
2512
|
-
import
|
|
2518
|
+
import React50 from "react";
|
|
2513
2519
|
|
|
2514
2520
|
// src/components/pageRenderingEngine/nodes/ParagraphNode.tsx
|
|
2515
2521
|
import React36 from "react";
|
|
@@ -2517,9 +2523,6 @@ import React36 from "react";
|
|
|
2517
2523
|
// src/components/pageRenderingEngine/nodes/TextNode.tsx
|
|
2518
2524
|
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
2519
2525
|
var TextNode = (props) => {
|
|
2520
|
-
const NodeTypes2 = {
|
|
2521
|
-
["text"]: TextNode
|
|
2522
|
-
};
|
|
2523
2526
|
function cssStringToJson(cssString) {
|
|
2524
2527
|
const styleObject = {};
|
|
2525
2528
|
const matches = cssString?.match(/([\w-]+)\s*:\s*([^;]+)\s*;/g);
|
|
@@ -2567,18 +2570,25 @@ var TextNode = (props) => {
|
|
|
2567
2570
|
}
|
|
2568
2571
|
const styles = convertKeysToCamelCase2(cssStringToJson(props.node.style));
|
|
2569
2572
|
function replacePlaceholders(template, dataItem) {
|
|
2573
|
+
{
|
|
2574
|
+
}
|
|
2570
2575
|
return template.replace(/{(\w+)}/g, (_, key) => {
|
|
2576
|
+
{
|
|
2577
|
+
}
|
|
2571
2578
|
return key in dataItem ? dataItem[key] : `{${key}}`;
|
|
2572
2579
|
});
|
|
2573
2580
|
}
|
|
2574
2581
|
const displayText = props.linkText ? props.linkText : props.node.text;
|
|
2575
|
-
return
|
|
2582
|
+
return (
|
|
2583
|
+
// @ts-expect-error custom code
|
|
2584
|
+
/* @__PURE__ */ jsx41("span", { style: { ...styles }, className: getFormatClass(props.node.format), children: props.dataitem && props.linkText ? displayText : props.dataitem ? replacePlaceholders(props.node.text, props.dataitem) : props.node.text })
|
|
2585
|
+
);
|
|
2576
2586
|
};
|
|
2577
2587
|
var TextNode_default = TextNode;
|
|
2578
2588
|
|
|
2579
2589
|
// src/components/pageRenderingEngine/nodes/LineBreakNode.tsx
|
|
2580
2590
|
import { jsx as jsx42 } from "react/jsx-runtime";
|
|
2581
|
-
var LineBreakNode = (
|
|
2591
|
+
var LineBreakNode = () => {
|
|
2582
2592
|
return /* @__PURE__ */ jsx42("div", { className: "py-0.5 lg:py-1.5" });
|
|
2583
2593
|
};
|
|
2584
2594
|
var LineBreakNode_default = LineBreakNode;
|
|
@@ -2663,12 +2673,18 @@ import { jsx as jsx46 } from "react/jsx-runtime";
|
|
|
2663
2673
|
function getNestedProperty(obj, path) {
|
|
2664
2674
|
if (!obj || !path) return null;
|
|
2665
2675
|
if (path.includes(".")) {
|
|
2666
|
-
return path.split(".").reduce((prev, curr) =>
|
|
2667
|
-
|
|
2668
|
-
|
|
2669
|
-
|
|
2670
|
-
|
|
2676
|
+
return path.split(".").reduce((prev, curr) => {
|
|
2677
|
+
if (prev && typeof prev === "object") {
|
|
2678
|
+
return prev[curr];
|
|
2679
|
+
}
|
|
2680
|
+
return null;
|
|
2681
|
+
}, obj);
|
|
2671
2682
|
}
|
|
2683
|
+
const value = obj[path];
|
|
2684
|
+
if (Array.isArray(value)) {
|
|
2685
|
+
return value.map((item, index) => /* @__PURE__ */ jsx46("div", { children: String(item) }, index));
|
|
2686
|
+
}
|
|
2687
|
+
return value;
|
|
2672
2688
|
}
|
|
2673
2689
|
var DatafieldNode = (props) => {
|
|
2674
2690
|
function cssStringToJson(cssString) {
|
|
@@ -2678,9 +2694,7 @@ var DatafieldNode = (props) => {
|
|
|
2678
2694
|
matches.forEach((match) => {
|
|
2679
2695
|
const parts = match.match(/([\w-]+)\s*:\s*([^;]+)\s*;/);
|
|
2680
2696
|
if (parts && parts.length === 3) {
|
|
2681
|
-
|
|
2682
|
-
const value2 = parts[2].trim();
|
|
2683
|
-
styleObject[property] = value2;
|
|
2697
|
+
styleObject[parts[1].trim()] = parts[2].trim();
|
|
2684
2698
|
}
|
|
2685
2699
|
});
|
|
2686
2700
|
}
|
|
@@ -2690,9 +2704,11 @@ var DatafieldNode = (props) => {
|
|
|
2690
2704
|
return str.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
|
|
2691
2705
|
}
|
|
2692
2706
|
function convertKeysToCamelCase2(obj) {
|
|
2693
|
-
if (!obj || typeof obj !== "object") return obj;
|
|
2694
2707
|
return Object.fromEntries(
|
|
2695
|
-
Object.entries(obj).map(([key, value2]) => [
|
|
2708
|
+
Object.entries(obj).map(([key, value2]) => [
|
|
2709
|
+
toCamelCase2(key),
|
|
2710
|
+
value2
|
|
2711
|
+
])
|
|
2696
2712
|
);
|
|
2697
2713
|
}
|
|
2698
2714
|
const Formats = [
|
|
@@ -2709,11 +2725,12 @@ var DatafieldNode = (props) => {
|
|
|
2709
2725
|
"italic underline",
|
|
2710
2726
|
"italic underline font-medium"
|
|
2711
2727
|
];
|
|
2712
|
-
const styles = convertKeysToCamelCase2(
|
|
2713
|
-
|
|
2728
|
+
const styles = convertKeysToCamelCase2(
|
|
2729
|
+
cssStringToJson(props.node.style)
|
|
2730
|
+
);
|
|
2731
|
+
const fieldName = props.node.fieldName ?? "";
|
|
2714
2732
|
const value = props.dataitem ? getNestedProperty(props.dataitem, fieldName) : null;
|
|
2715
|
-
|
|
2716
|
-
const isEmptyValue = value === null || value === void 0 || value === "" || Array.isArray(value) && value.length === 0 || typeof value === "object" && Object.keys(value).length === 0;
|
|
2733
|
+
const isEmptyValue = value === null || value === void 0 || value === "" || Array.isArray(value) && value.length === 0 || typeof value === "object" && value !== null && Object.keys(value).length === 0;
|
|
2717
2734
|
const maxLines = props.node.maxLines;
|
|
2718
2735
|
if (maxLines && Number(maxLines) > 0) {
|
|
2719
2736
|
Object.assign(styles, {
|
|
@@ -2724,14 +2741,12 @@ var DatafieldNode = (props) => {
|
|
|
2724
2741
|
});
|
|
2725
2742
|
}
|
|
2726
2743
|
const dataType = props.node.dataType;
|
|
2727
|
-
if (isEmptyValue)
|
|
2728
|
-
|
|
2729
|
-
}
|
|
2730
|
-
if (dataType == "rawContent") {
|
|
2744
|
+
if (isEmptyValue) return null;
|
|
2745
|
+
if (dataType === "rawContent") {
|
|
2731
2746
|
return /* @__PURE__ */ jsx46(
|
|
2732
2747
|
PageBodyRenderer_default,
|
|
2733
2748
|
{
|
|
2734
|
-
rawBody: value ?? `@databound[${fieldName}]
|
|
2749
|
+
rawBody: String(value ?? `@databound[${fieldName}]`),
|
|
2735
2750
|
routeParameters: props.routeParameters,
|
|
2736
2751
|
query: props.query,
|
|
2737
2752
|
session: props.session,
|
|
@@ -2748,7 +2763,13 @@ var DatafieldNode = (props) => {
|
|
|
2748
2763
|
{
|
|
2749
2764
|
className: `datafield-node ${props.node.format < Formats.length ? Formats[props.node.format] : ""}`,
|
|
2750
2765
|
style: styles,
|
|
2751
|
-
children:
|
|
2766
|
+
children: /* @__PURE__ */ jsx46(
|
|
2767
|
+
ViewControl_default,
|
|
2768
|
+
{
|
|
2769
|
+
controlType: dataType,
|
|
2770
|
+
value: value ?? `@databound[${fieldName}]`
|
|
2771
|
+
}
|
|
2772
|
+
)
|
|
2752
2773
|
}
|
|
2753
2774
|
);
|
|
2754
2775
|
};
|
|
@@ -2771,7 +2792,7 @@ var ParagraphNode = (props) => {
|
|
|
2771
2792
|
};
|
|
2772
2793
|
{
|
|
2773
2794
|
}
|
|
2774
|
-
|
|
2795
|
+
const formatClasses = FormatClass[props.node.format] || "";
|
|
2775
2796
|
const isInlineOnlyParent = props.parentTag === "summary";
|
|
2776
2797
|
const hasChildren = props.node.children && props.node.children.length > 0;
|
|
2777
2798
|
if (isInlineOnlyParent) {
|
|
@@ -2816,7 +2837,6 @@ var HeadingNode = (props) => {
|
|
|
2816
2837
|
["text"]: TextNode_default,
|
|
2817
2838
|
["link"]: LinkNode_default,
|
|
2818
2839
|
["svg-icon"]: SVGIconNode_default,
|
|
2819
|
-
// ["linebreak"]: LineBreakNodeNew,
|
|
2820
2840
|
["datafield"]: DatafieldNode_default
|
|
2821
2841
|
};
|
|
2822
2842
|
const HeadingTag = `${props.node.tag}`;
|
|
@@ -2825,7 +2845,7 @@ var HeadingNode = (props) => {
|
|
|
2825
2845
|
};
|
|
2826
2846
|
{
|
|
2827
2847
|
}
|
|
2828
|
-
|
|
2848
|
+
const formatClasses = FormatClass[props.node.format] || "";
|
|
2829
2849
|
return /* @__PURE__ */ jsx48(Fragment5, { children: React37.createElement(
|
|
2830
2850
|
HeadingTag,
|
|
2831
2851
|
{ className: formatClasses },
|
|
@@ -2969,8 +2989,10 @@ function CopyButton({ text }) {
|
|
|
2969
2989
|
import { jsx as jsx53, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2970
2990
|
var CodeNode = (props) => {
|
|
2971
2991
|
const NodeTypes2 = {
|
|
2992
|
+
// @ts-expect-error custom code
|
|
2972
2993
|
["text"]: TextNode_default,
|
|
2973
2994
|
["linebreak"]: LineBreakNode_default,
|
|
2995
|
+
// @ts-expect-error custom code
|
|
2974
2996
|
["link"]: LinkNode_default
|
|
2975
2997
|
};
|
|
2976
2998
|
const textContent = props.node?.children?.map((node) => {
|
|
@@ -2994,14 +3016,11 @@ var CodeNode_default = CodeNode;
|
|
|
2994
3016
|
|
|
2995
3017
|
// src/components/pageRenderingEngine/nodes/HorizontalRuleNode.tsx
|
|
2996
3018
|
import { jsx as jsx54 } from "react/jsx-runtime";
|
|
2997
|
-
var HorizontalRuleNode = (
|
|
3019
|
+
var HorizontalRuleNode = () => {
|
|
2998
3020
|
return /* @__PURE__ */ jsx54("hr", {});
|
|
2999
3021
|
};
|
|
3000
3022
|
var HorizontalRuleNode_default = HorizontalRuleNode;
|
|
3001
3023
|
|
|
3002
|
-
// src/components/pageRenderingEngine/nodes/LayoutItemNode.tsx
|
|
3003
|
-
import React46 from "react";
|
|
3004
|
-
|
|
3005
3024
|
// src/components/pageRenderingEngine/nodes/ImageNode.tsx
|
|
3006
3025
|
import { Fragment as Fragment6, jsx as jsx55 } from "react/jsx-runtime";
|
|
3007
3026
|
var ImageNode = (props) => {
|
|
@@ -3038,21 +3057,37 @@ var ImageNode = (props) => {
|
|
|
3038
3057
|
var ImageNode_default = ImageNode;
|
|
3039
3058
|
|
|
3040
3059
|
// src/components/pageRenderingEngine/nodes/WidgetNode.tsx
|
|
3041
|
-
import { Suspense } from "react";
|
|
3060
|
+
import React42, { Suspense } from "react";
|
|
3061
|
+
|
|
3062
|
+
// src/components/pageRenderingEngine/nodes/WidgetRegistry.tsx
|
|
3063
|
+
var registry = {};
|
|
3064
|
+
var getWidget = (code) => {
|
|
3065
|
+
return registry[code];
|
|
3066
|
+
};
|
|
3067
|
+
|
|
3068
|
+
// src/components/pageRenderingEngine/nodes/WidgetNode.tsx
|
|
3042
3069
|
import { Fragment as Fragment7, jsx as jsx56, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3070
|
+
function resolveWidget(code) {
|
|
3071
|
+
return getWidget(code);
|
|
3072
|
+
}
|
|
3043
3073
|
var WidgetNode = (props) => {
|
|
3044
3074
|
const getWidgetParameters = () => {
|
|
3045
|
-
const widgetInputParameters = {
|
|
3046
|
-
|
|
3075
|
+
const widgetInputParameters = {
|
|
3076
|
+
...props.routeParameters ?? {}
|
|
3077
|
+
};
|
|
3078
|
+
const rawWidgetParams = props.node.widgetParameters ?? props.node.widgetParams;
|
|
3047
3079
|
let widgetParameters = {};
|
|
3048
3080
|
const isJSON = (str) => {
|
|
3049
|
-
|
|
3050
|
-
|
|
3051
|
-
return str.startsWith("{") && str.endsWith("}") || str.startsWith("[") && str.endsWith("]");
|
|
3081
|
+
const s = str.trim();
|
|
3082
|
+
return s.startsWith("{") && s.endsWith("}") || s.startsWith("[") && s.endsWith("]");
|
|
3052
3083
|
};
|
|
3053
3084
|
if (rawWidgetParams) {
|
|
3054
3085
|
if (typeof rawWidgetParams === "string" && isJSON(rawWidgetParams)) {
|
|
3055
|
-
|
|
3086
|
+
try {
|
|
3087
|
+
widgetParameters = JSON.parse(rawWidgetParams);
|
|
3088
|
+
} catch {
|
|
3089
|
+
widgetParameters = {};
|
|
3090
|
+
}
|
|
3056
3091
|
} else if (typeof rawWidgetParams === "object") {
|
|
3057
3092
|
widgetParameters = rawWidgetParams;
|
|
3058
3093
|
}
|
|
@@ -3065,9 +3100,11 @@ var WidgetNode = (props) => {
|
|
|
3065
3100
|
return props.routeParameters?.[actualKey] ?? val;
|
|
3066
3101
|
}
|
|
3067
3102
|
return val;
|
|
3068
|
-
}
|
|
3103
|
+
}
|
|
3104
|
+
if (Array.isArray(val)) {
|
|
3069
3105
|
return val.map(resolveValue);
|
|
3070
|
-
}
|
|
3106
|
+
}
|
|
3107
|
+
if (val && typeof val === "object") {
|
|
3071
3108
|
const out = {};
|
|
3072
3109
|
for (const k of Object.keys(val)) {
|
|
3073
3110
|
out[k] = resolveValue(val[k]);
|
|
@@ -3076,80 +3113,366 @@ var WidgetNode = (props) => {
|
|
|
3076
3113
|
}
|
|
3077
3114
|
return val;
|
|
3078
3115
|
};
|
|
3079
|
-
Object.keys(widgetParameters)
|
|
3116
|
+
for (const key of Object.keys(widgetParameters)) {
|
|
3080
3117
|
const rawVal = widgetParameters[key];
|
|
3081
3118
|
if (rawVal === "route") {
|
|
3082
|
-
|
|
3083
|
-
widgetInputParameters[key] = props.path;
|
|
3084
|
-
} else {
|
|
3085
|
-
widgetInputParameters[key] = widgetInputParameters[key] ?? null;
|
|
3086
|
-
}
|
|
3119
|
+
widgetInputParameters[key] = key === "itemPath" ? props.path : widgetInputParameters[key] ?? null;
|
|
3087
3120
|
} else {
|
|
3088
3121
|
widgetInputParameters[key] = resolveValue(rawVal);
|
|
3089
3122
|
}
|
|
3090
|
-
}
|
|
3091
|
-
widgetInputParameters["widgetTitle"] = props.node
|
|
3123
|
+
}
|
|
3124
|
+
widgetInputParameters["widgetTitle"] = props.node.widgetTitle;
|
|
3092
3125
|
return widgetInputParameters;
|
|
3093
3126
|
};
|
|
3094
|
-
const
|
|
3127
|
+
const widgetCode = props.node.widgetCode;
|
|
3128
|
+
const SelectedWidget = resolveWidget(widgetCode);
|
|
3095
3129
|
if (!SelectedWidget) {
|
|
3096
|
-
console.warn("Widget not found:",
|
|
3130
|
+
console.warn("Widget not found:", widgetCode);
|
|
3097
3131
|
return /* @__PURE__ */ jsxs27(Fragment7, { children: [
|
|
3098
3132
|
"Widget not found: ",
|
|
3099
|
-
|
|
3133
|
+
widgetCode
|
|
3100
3134
|
] });
|
|
3101
3135
|
}
|
|
3102
|
-
return /* @__PURE__ */ jsx56(Suspense, { fallback: /* @__PURE__ */ jsx56("div", { className: "container mt-2", children: "..." }), children:
|
|
3103
|
-
|
|
3136
|
+
return /* @__PURE__ */ jsx56(Suspense, { fallback: /* @__PURE__ */ jsx56("div", { className: "container mt-2", children: "..." }), children: React42.createElement(SelectedWidget, {
|
|
3137
|
+
params: getWidgetParameters(),
|
|
3138
|
+
query: props.query,
|
|
3139
|
+
session: props.session,
|
|
3140
|
+
host: props.host,
|
|
3141
|
+
path: props.path,
|
|
3142
|
+
apiBaseUrl: props.apiBaseUrl
|
|
3143
|
+
}) });
|
|
3144
|
+
};
|
|
3145
|
+
var WidgetNode_default = WidgetNode;
|
|
3146
|
+
|
|
3147
|
+
// src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
|
|
3148
|
+
import React43, { useRef as useRef4, useReducer as useReducer2, useCallback as useCallback3, useEffect as useEffect8 } from "react";
|
|
3149
|
+
|
|
3150
|
+
// src/components/pageRenderingEngine/nodes/InputControlNode.tsx
|
|
3151
|
+
import { jsx as jsx57 } from "react/jsx-runtime";
|
|
3152
|
+
var InputControlNode = (props) => {
|
|
3153
|
+
return /* @__PURE__ */ jsx57("div", { children: /* @__PURE__ */ jsx57(
|
|
3154
|
+
InputControl_default,
|
|
3104
3155
|
{
|
|
3105
|
-
|
|
3106
|
-
|
|
3107
|
-
|
|
3108
|
-
|
|
3109
|
-
|
|
3110
|
-
|
|
3156
|
+
name: props.node.name,
|
|
3157
|
+
controlType: "lineTextInput",
|
|
3158
|
+
value: props.value,
|
|
3159
|
+
callback: props.callback,
|
|
3160
|
+
attributes: {
|
|
3161
|
+
pattern: props.node.pattern,
|
|
3162
|
+
maxLength: props.node.maxLength,
|
|
3163
|
+
minLength: props.node.minLength,
|
|
3164
|
+
//maxValue:props.node.maxV,
|
|
3165
|
+
//minValue?: number,
|
|
3166
|
+
readOnly: props.node.readOnly,
|
|
3167
|
+
label: "name",
|
|
3168
|
+
//props.node.label,
|
|
3169
|
+
hintText: props.node.hintText,
|
|
3170
|
+
placeholder: props.node.placeholder,
|
|
3171
|
+
required: props.node.required,
|
|
3172
|
+
errorMessage: props.node.errorMessage,
|
|
3173
|
+
helpText: props.node.helpText,
|
|
3174
|
+
autoFocus: props.node.autoFocus
|
|
3175
|
+
}
|
|
3111
3176
|
}
|
|
3112
3177
|
) });
|
|
3113
3178
|
};
|
|
3114
|
-
var
|
|
3179
|
+
var InputControlNode_default = InputControlNode;
|
|
3180
|
+
|
|
3181
|
+
// src/clients/CacheManage.tsx
|
|
3182
|
+
import NodeCache from "node-cache";
|
|
3183
|
+
var CacheManager = class _CacheManager {
|
|
3184
|
+
constructor() {
|
|
3185
|
+
this.maxCacheSize = 1e3;
|
|
3186
|
+
this.cache = new NodeCache({ stdTTL: 0, checkperiod: 300 });
|
|
3187
|
+
}
|
|
3188
|
+
static getInstance() {
|
|
3189
|
+
if (!_CacheManager.instance) {
|
|
3190
|
+
_CacheManager.instance = new _CacheManager();
|
|
3191
|
+
}
|
|
3192
|
+
return _CacheManager.instance;
|
|
3193
|
+
}
|
|
3194
|
+
get(key) {
|
|
3195
|
+
return null;
|
|
3196
|
+
}
|
|
3197
|
+
set(key, data, ttl) {
|
|
3198
|
+
}
|
|
3199
|
+
clear() {
|
|
3200
|
+
this.cache.flushAll();
|
|
3201
|
+
}
|
|
3202
|
+
size() {
|
|
3203
|
+
return this.cache.keys().length;
|
|
3204
|
+
}
|
|
3205
|
+
destroy() {
|
|
3206
|
+
this.cache.close();
|
|
3207
|
+
}
|
|
3208
|
+
};
|
|
3209
|
+
|
|
3210
|
+
// src/clients/ServiceClient.tsx
|
|
3211
|
+
var ServerApiError = class extends Error {
|
|
3212
|
+
constructor(data, status) {
|
|
3213
|
+
super(data.message || "---");
|
|
3214
|
+
this.status = status;
|
|
3215
|
+
this.data = data;
|
|
3216
|
+
this.data.isSuccessful = false;
|
|
3217
|
+
}
|
|
3218
|
+
};
|
|
3219
|
+
var ServiceClient = class {
|
|
3220
|
+
constructor(apiBaseUrl, session) {
|
|
3221
|
+
this.cacheManager = CacheManager.getInstance();
|
|
3222
|
+
this.baseUrl = apiBaseUrl;
|
|
3223
|
+
this.session = session;
|
|
3224
|
+
}
|
|
3225
|
+
buildFullPath(path, params) {
|
|
3226
|
+
let updatedPath = path;
|
|
3227
|
+
if (params) {
|
|
3228
|
+
Object.keys(params).forEach((key) => {
|
|
3229
|
+
updatedPath = updatedPath.replace(
|
|
3230
|
+
`{${key}}`,
|
|
3231
|
+
String(params[key])
|
|
3232
|
+
);
|
|
3233
|
+
});
|
|
3234
|
+
}
|
|
3235
|
+
return this.baseUrl + updatedPath;
|
|
3236
|
+
}
|
|
3237
|
+
getConfig() {
|
|
3238
|
+
const config = { headers: {} };
|
|
3239
|
+
if (this.session) {
|
|
3240
|
+
if (this.session.oAuthToken) {
|
|
3241
|
+
config.headers["Authorization"] = "Bearer " + this.session.oAuthToken;
|
|
3242
|
+
}
|
|
3243
|
+
config.headers["cid"] = this.session.cid || "";
|
|
3244
|
+
config.headers["UserCurrencyCode"] = this.session.userCurrencyCode || "INR";
|
|
3245
|
+
config.headers["MarketCode"] = this.session?.marketCode || "IND";
|
|
3246
|
+
}
|
|
3247
|
+
return config;
|
|
3248
|
+
}
|
|
3249
|
+
handleFetchError(error) {
|
|
3250
|
+
console.log(error);
|
|
3251
|
+
const serverApiError = error;
|
|
3252
|
+
if (serverApiError) {
|
|
3253
|
+
return serverApiError.data;
|
|
3254
|
+
}
|
|
3255
|
+
return {
|
|
3256
|
+
message: "There is some error. Please try after sometime.",
|
|
3257
|
+
isSuccessful: false
|
|
3258
|
+
};
|
|
3259
|
+
}
|
|
3260
|
+
async fetchJsonWithCache(fullPath, config) {
|
|
3261
|
+
const cacheKey = fullPath + "--" + (this.session?.marketCode || "IND");
|
|
3262
|
+
const cachedData = this.cacheManager.get(cacheKey);
|
|
3263
|
+
if (cachedData) {
|
|
3264
|
+
return cachedData;
|
|
3265
|
+
}
|
|
3266
|
+
console.log("*****************CALLING API:", cacheKey, (/* @__PURE__ */ new Date()).toISOString());
|
|
3267
|
+
const response = await fetch(fullPath, { headers: config.headers });
|
|
3268
|
+
if (!response.ok) {
|
|
3269
|
+
const apiErrorData = await response.json();
|
|
3270
|
+
throw new ServerApiError(apiErrorData, response.status);
|
|
3271
|
+
}
|
|
3272
|
+
const cacheControl = response.headers.get("Cache-Control");
|
|
3273
|
+
let revalidate = null;
|
|
3274
|
+
if (cacheControl) {
|
|
3275
|
+
const maxAgeMatch = cacheControl.match(/max-age=(\d+)/);
|
|
3276
|
+
if (maxAgeMatch && maxAgeMatch[1]) {
|
|
3277
|
+
const maxAge = parseInt(maxAgeMatch[1], 10);
|
|
3278
|
+
revalidate = maxAge * 1e3;
|
|
3279
|
+
}
|
|
3280
|
+
}
|
|
3281
|
+
const data = await response.json();
|
|
3282
|
+
data.isSuccessful = true;
|
|
3283
|
+
if (revalidate !== null && revalidate > 0) {
|
|
3284
|
+
console.log("revalidate............I am caching:" + revalidate);
|
|
3285
|
+
this.cacheManager.set(cacheKey, data, revalidate);
|
|
3286
|
+
}
|
|
3287
|
+
return data;
|
|
3288
|
+
}
|
|
3289
|
+
// private async refreshToken(): Promise<void> {
|
|
3290
|
+
// console.log("*******************calling refresh token***********************");
|
|
3291
|
+
// try {
|
|
3292
|
+
// const response = await fetch(this.baseUrl + "/auth/storefront/login/refreshToken", {
|
|
3293
|
+
// method: 'POST',
|
|
3294
|
+
// headers: {
|
|
3295
|
+
// 'Content-Type': 'application/json'
|
|
3296
|
+
// },
|
|
3297
|
+
// body: JSON.stringify({ refreshToken: this.session.refreshToken })
|
|
3298
|
+
// });
|
|
3299
|
+
// if (!response.ok) {
|
|
3300
|
+
// throw new Error("Failed to refresh token");
|
|
3301
|
+
// }
|
|
3302
|
+
// const responseData = await response.json();
|
|
3303
|
+
// this.session.oAuthToken = responseData.result.accessToken;
|
|
3304
|
+
// if (typeof window === "undefined") {
|
|
3305
|
+
// // Running on the server
|
|
3306
|
+
// } else {
|
|
3307
|
+
// await fetch("/api/login", {
|
|
3308
|
+
// method: "post",
|
|
3309
|
+
// headers: {
|
|
3310
|
+
// "Content-Type": "application/json",
|
|
3311
|
+
// },
|
|
3312
|
+
// body: JSON.stringify({ session: this.session }),
|
|
3313
|
+
// });
|
|
3314
|
+
// }
|
|
3315
|
+
// } catch (error: any) {
|
|
3316
|
+
// throw new Error("Failed to refresh token");
|
|
3317
|
+
// }
|
|
3318
|
+
// }
|
|
3319
|
+
async handleRequest(request) {
|
|
3320
|
+
try {
|
|
3321
|
+
return await request();
|
|
3322
|
+
} catch (error) {
|
|
3323
|
+
throw error;
|
|
3324
|
+
}
|
|
3325
|
+
}
|
|
3326
|
+
async post(path, data) {
|
|
3327
|
+
const request = async () => {
|
|
3328
|
+
const fullPath = this.baseUrl + path;
|
|
3329
|
+
const config = this.getConfig();
|
|
3330
|
+
const response = await fetch(fullPath, {
|
|
3331
|
+
method: "POST",
|
|
3332
|
+
headers: {
|
|
3333
|
+
...config.headers,
|
|
3334
|
+
"Content-Type": "application/json"
|
|
3335
|
+
},
|
|
3336
|
+
body: JSON.stringify(data)
|
|
3337
|
+
});
|
|
3338
|
+
if (!response.ok) {
|
|
3339
|
+
const apiErrorData = await response.json();
|
|
3340
|
+
throw new ServerApiError(apiErrorData, response.status);
|
|
3341
|
+
}
|
|
3342
|
+
const responseData = await response.json();
|
|
3343
|
+
responseData.isSuccessful = true;
|
|
3344
|
+
return responseData;
|
|
3345
|
+
};
|
|
3346
|
+
try {
|
|
3347
|
+
return await this.handleRequest(request);
|
|
3348
|
+
} catch (error) {
|
|
3349
|
+
return this.handleFetchError(error);
|
|
3350
|
+
}
|
|
3351
|
+
}
|
|
3352
|
+
async getSingle(path, params) {
|
|
3353
|
+
const request = async () => {
|
|
3354
|
+
const sanitizedParams = params ? Object.fromEntries(
|
|
3355
|
+
Object.entries(params).map(([k, v]) => [k, String(v)])
|
|
3356
|
+
) : void 0;
|
|
3357
|
+
const fullPath = this.buildFullPath(path, sanitizedParams);
|
|
3358
|
+
const config = this.getConfig();
|
|
3359
|
+
return await this.fetchJsonWithCache(fullPath, config);
|
|
3360
|
+
};
|
|
3361
|
+
try {
|
|
3362
|
+
return await this.handleRequest(request);
|
|
3363
|
+
} catch (error) {
|
|
3364
|
+
return this.handleFetchError(error);
|
|
3365
|
+
}
|
|
3366
|
+
}
|
|
3367
|
+
async get(path, params) {
|
|
3368
|
+
const request = async () => {
|
|
3369
|
+
const sanitizedParams = params ? Object.fromEntries(
|
|
3370
|
+
Object.entries(params).map(([k, v]) => [k, String(v)])
|
|
3371
|
+
) : void 0;
|
|
3372
|
+
const fullPath = this.buildFullPath(path, sanitizedParams);
|
|
3373
|
+
const config = this.getConfig();
|
|
3374
|
+
console.log(fullPath);
|
|
3375
|
+
return await this.fetchJsonWithCache(fullPath, config);
|
|
3376
|
+
};
|
|
3377
|
+
try {
|
|
3378
|
+
return await this.handleRequest(request);
|
|
3379
|
+
} catch (error) {
|
|
3380
|
+
return this.handleFetchError(error);
|
|
3381
|
+
}
|
|
3382
|
+
}
|
|
3383
|
+
};
|
|
3384
|
+
var ServiceClient_default = ServiceClient;
|
|
3385
|
+
|
|
3386
|
+
// src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
|
|
3387
|
+
import { jsx as jsx58, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3388
|
+
var FormContainerNode = (props) => {
|
|
3389
|
+
const NodeTypes2 = {
|
|
3390
|
+
["input-control"]: InputControlNode_default
|
|
3391
|
+
};
|
|
3392
|
+
const { node } = props;
|
|
3393
|
+
const formRef = useRef4(null);
|
|
3394
|
+
const initialState = {
|
|
3395
|
+
inputValues: {},
|
|
3396
|
+
lastPropertyChanged: ""
|
|
3397
|
+
};
|
|
3398
|
+
const [formState, dispatch] = useReducer2(FormReducer_default, initialState);
|
|
3399
|
+
const handleInputChange = useCallback3((updatedValues) => {
|
|
3400
|
+
dispatch({ type: FORM_INPUT_UPDATE, name: updatedValues.name, value: updatedValues.value });
|
|
3401
|
+
}, [dispatch]);
|
|
3402
|
+
useEffect8(() => {
|
|
3403
|
+
const fetchInitialData = async () => {
|
|
3404
|
+
const client = new ServiceClient_default(props.apiBaseUrl, props.session);
|
|
3405
|
+
const response = await client.getSingle(props.node.dataFetchApi, props.routeParameters);
|
|
3406
|
+
if (response.isSuccessful) {
|
|
3407
|
+
dispatch({
|
|
3408
|
+
type: FORM_INITIAL_UPDATE,
|
|
3409
|
+
values: response.result,
|
|
3410
|
+
// @ts-expect-error custom code
|
|
3411
|
+
name: "all"
|
|
3412
|
+
});
|
|
3413
|
+
}
|
|
3414
|
+
};
|
|
3415
|
+
fetchInitialData();
|
|
3416
|
+
}, [props.apiBaseUrl, props.node, props.session, props.routeParameters]);
|
|
3417
|
+
return /* @__PURE__ */ jsxs28("form", { className: "group space-y-6 pb-6 overflow-y-auto", noValidate: true, ref: formRef, children: [
|
|
3418
|
+
node.children && node.children.map((node2, index) => {
|
|
3419
|
+
{
|
|
3420
|
+
}
|
|
3421
|
+
const SelectedNode = NodeTypes2[node2.type];
|
|
3422
|
+
return /* @__PURE__ */ jsx58(React43.Fragment, { children: SelectedNode && node2.type == "input-control" && /* @__PURE__ */ jsx58(
|
|
3423
|
+
InputControlNode_default,
|
|
3424
|
+
{
|
|
3425
|
+
value: formState.inputValues[node2.name],
|
|
3426
|
+
callback: handleInputChange,
|
|
3427
|
+
node: node2
|
|
3428
|
+
}
|
|
3429
|
+
) }, index);
|
|
3430
|
+
}),
|
|
3431
|
+
node.children.length == 0 && /* @__PURE__ */ jsx58("div", { className: "py-0.5 lg:py-1.5" })
|
|
3432
|
+
] });
|
|
3433
|
+
};
|
|
3434
|
+
var FormContainerNode_default = FormContainerNode;
|
|
3435
|
+
|
|
3436
|
+
// src/components/pageRenderingEngine/nodes/DivContainer.tsx
|
|
3437
|
+
import React49 from "react";
|
|
3115
3438
|
|
|
3116
3439
|
// src/components/pageRenderingEngine/nodes/IframeClient.tsx
|
|
3117
|
-
import
|
|
3440
|
+
import React45, { useEffect as useEffect9, useRef as useRef5, useState as useState9 } from "react";
|
|
3118
3441
|
|
|
3119
3442
|
// src/components/IFrameLoaderView.tsx
|
|
3120
|
-
import
|
|
3121
|
-
import { jsx as
|
|
3443
|
+
import React44 from "react";
|
|
3444
|
+
import { jsx as jsx59, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3122
3445
|
var IFrameLoaderView = (props) => {
|
|
3123
|
-
return /* @__PURE__ */
|
|
3124
|
-
props.isDataFound == null && /* @__PURE__ */
|
|
3125
|
-
/* @__PURE__ */
|
|
3126
|
-
/* @__PURE__ */
|
|
3127
|
-
/* @__PURE__ */
|
|
3128
|
-
/* @__PURE__ */
|
|
3129
|
-
/* @__PURE__ */
|
|
3446
|
+
return /* @__PURE__ */ jsxs29(React44.Fragment, { children: [
|
|
3447
|
+
props.isDataFound == null && /* @__PURE__ */ jsx59("div", { className: "", children: /* @__PURE__ */ jsxs29("div", { className: "mt-4 bg-gray-200 rounded-md p-4 animate-pulse", children: [
|
|
3448
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center mb-4", children: [
|
|
3449
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 h-8 w-8 rounded-full animate-pulse" }),
|
|
3450
|
+
/* @__PURE__ */ jsxs29("div", { className: "ml-2", children: [
|
|
3451
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 h-3 w-16 animate-pulse" }),
|
|
3452
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 h-2 w-12 animate-pulse" })
|
|
3130
3453
|
] })
|
|
3131
3454
|
] }),
|
|
3132
|
-
/* @__PURE__ */
|
|
3133
|
-
/* @__PURE__ */
|
|
3134
|
-
/* @__PURE__ */
|
|
3135
|
-
/* @__PURE__ */
|
|
3136
|
-
/* @__PURE__ */
|
|
3137
|
-
/* @__PURE__ */
|
|
3138
|
-
/* @__PURE__ */
|
|
3455
|
+
/* @__PURE__ */ jsxs29("div", { className: "grid grid-cols-3 gap-4 mt-6", children: [
|
|
3456
|
+
/* @__PURE__ */ jsxs29("div", { className: "animate-pulse", children: [
|
|
3457
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
|
|
3458
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
|
|
3459
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
|
|
3460
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
|
|
3461
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
|
|
3139
3462
|
] }),
|
|
3140
|
-
/* @__PURE__ */
|
|
3141
|
-
/* @__PURE__ */
|
|
3142
|
-
/* @__PURE__ */
|
|
3143
|
-
/* @__PURE__ */
|
|
3144
|
-
/* @__PURE__ */
|
|
3145
|
-
/* @__PURE__ */
|
|
3463
|
+
/* @__PURE__ */ jsxs29("div", { className: "animate-pulse", children: [
|
|
3464
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
|
|
3465
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
|
|
3466
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
|
|
3467
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
|
|
3468
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
|
|
3146
3469
|
] }),
|
|
3147
|
-
/* @__PURE__ */
|
|
3148
|
-
/* @__PURE__ */
|
|
3149
|
-
/* @__PURE__ */
|
|
3150
|
-
/* @__PURE__ */
|
|
3151
|
-
/* @__PURE__ */
|
|
3152
|
-
/* @__PURE__ */
|
|
3470
|
+
/* @__PURE__ */ jsxs29("div", { className: "animate-pulse", children: [
|
|
3471
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
|
|
3472
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
|
|
3473
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
|
|
3474
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
|
|
3475
|
+
/* @__PURE__ */ jsx59("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
|
|
3153
3476
|
] })
|
|
3154
3477
|
] })
|
|
3155
3478
|
] }) }),
|
|
@@ -3159,12 +3482,12 @@ var IFrameLoaderView = (props) => {
|
|
|
3159
3482
|
var IFrameLoaderView_default = IFrameLoaderView;
|
|
3160
3483
|
|
|
3161
3484
|
// src/components/pageRenderingEngine/nodes/IframeClient.tsx
|
|
3162
|
-
import { jsx as
|
|
3485
|
+
import { jsx as jsx60 } from "react/jsx-runtime";
|
|
3163
3486
|
var IframeClient = ({ src }) => {
|
|
3164
|
-
const iframeRef =
|
|
3487
|
+
const iframeRef = useRef5(null);
|
|
3165
3488
|
const [iframeHeight, setIframeHeight] = useState9("100%");
|
|
3166
3489
|
const [isDataFound, setIsDataFound] = useState9(null);
|
|
3167
|
-
|
|
3490
|
+
useEffect9(() => {
|
|
3168
3491
|
const handleReceiveMessage = (event) => {
|
|
3169
3492
|
const eventName = event?.data?.eventName;
|
|
3170
3493
|
const payload = event?.data?.payload;
|
|
@@ -3179,7 +3502,7 @@ var IframeClient = ({ src }) => {
|
|
|
3179
3502
|
window.addEventListener("message", handleReceiveMessage);
|
|
3180
3503
|
return () => window.removeEventListener("message", handleReceiveMessage);
|
|
3181
3504
|
}, []);
|
|
3182
|
-
|
|
3505
|
+
useEffect9(() => {
|
|
3183
3506
|
const handleResize = () => {
|
|
3184
3507
|
if (iframeRef.current) {
|
|
3185
3508
|
iframeRef.current.contentWindow?.postMessage({ eventName: "RESIZE" }, "*");
|
|
@@ -3191,13 +3514,14 @@ var IframeClient = ({ src }) => {
|
|
|
3191
3514
|
const handleIframeLoad = () => {
|
|
3192
3515
|
setIsDataFound(true);
|
|
3193
3516
|
};
|
|
3194
|
-
return /* @__PURE__ */
|
|
3517
|
+
return /* @__PURE__ */ jsx60(React45.Fragment, { children: /* @__PURE__ */ jsx60(IFrameLoaderView_default, { isDataFound, children: /* @__PURE__ */ jsx60(
|
|
3195
3518
|
"iframe",
|
|
3196
3519
|
{
|
|
3197
3520
|
ref: iframeRef,
|
|
3198
3521
|
src,
|
|
3199
3522
|
className: "w-full h-full border-none",
|
|
3200
3523
|
scrolling: "no",
|
|
3524
|
+
style: { height: iframeHeight },
|
|
3201
3525
|
onLoad: handleIframeLoad
|
|
3202
3526
|
}
|
|
3203
3527
|
) }) });
|
|
@@ -3205,7 +3529,7 @@ var IframeClient = ({ src }) => {
|
|
|
3205
3529
|
var IframeClient_default = IframeClient;
|
|
3206
3530
|
|
|
3207
3531
|
// src/components/pageRenderingEngine/nodes/EmbedNode.tsx
|
|
3208
|
-
import { jsx as
|
|
3532
|
+
import { jsx as jsx61 } from "react/jsx-runtime";
|
|
3209
3533
|
var EmbedNode = (props) => {
|
|
3210
3534
|
let src;
|
|
3211
3535
|
if (props.node.provider == "youtube") {
|
|
@@ -3215,106 +3539,10 @@ var EmbedNode = (props) => {
|
|
|
3215
3539
|
} else {
|
|
3216
3540
|
src = props.node.embedSrc;
|
|
3217
3541
|
}
|
|
3218
|
-
return /* @__PURE__ */
|
|
3542
|
+
return /* @__PURE__ */ jsx61("div", { className: "aspect-video", children: src && /* @__PURE__ */ jsx61(IframeClient_default, { src }) });
|
|
3219
3543
|
};
|
|
3220
3544
|
var EmbedNode_default = EmbedNode;
|
|
3221
3545
|
|
|
3222
|
-
// src/components/pageRenderingEngine/nodes/VideoNode.tsx
|
|
3223
|
-
import React45 from "react";
|
|
3224
|
-
import { jsx as jsx60 } from "react/jsx-runtime";
|
|
3225
|
-
var VideoNode = (props) => {
|
|
3226
|
-
let src;
|
|
3227
|
-
if (props.node.provider == "youtube") {
|
|
3228
|
-
src = `https://www.youtube-nocookie.com/embed/${props.node.videoId}`;
|
|
3229
|
-
} else if (props.node.provider == "bunny") {
|
|
3230
|
-
src = `https://iframe.mediadelivery.net/embed/${props.node.videoId}?autoplay=false&loop=false&muted=false&preload=true&responsive=true`;
|
|
3231
|
-
}
|
|
3232
|
-
return /* @__PURE__ */ jsx60(React45.Fragment, { children: src && /* @__PURE__ */ jsx60("iframe", { className: "w-full aspect-video rounded", src, loading: "lazy", allow: "accelerometer;gyroscope;autoplay;encrypted-media;picture-in-picture;", allowFullScreen: true }) });
|
|
3233
|
-
};
|
|
3234
|
-
var VideoNode_default = VideoNode;
|
|
3235
|
-
|
|
3236
|
-
// src/components/pageRenderingEngine/nodes/LayoutItemNode.tsx
|
|
3237
|
-
import { jsx as jsx61 } from "react/jsx-runtime";
|
|
3238
|
-
var LayoutItemNode = (props) => {
|
|
3239
|
-
const NodeTypes2 = {
|
|
3240
|
-
["paragraph"]: ParagraphNode_default,
|
|
3241
|
-
["heading"]: HeadingNode_default,
|
|
3242
|
-
["list"]: ListNode_default,
|
|
3243
|
-
["quote"]: QuoteNode_default,
|
|
3244
|
-
["code"]: CodeNode_default,
|
|
3245
|
-
["horizontalrule"]: HorizontalRuleNode_default,
|
|
3246
|
-
["image"]: ImageNode_default,
|
|
3247
|
-
["layout-container"]: LayoutContainerNode_default,
|
|
3248
|
-
["link"]: LinkNode_default,
|
|
3249
|
-
["widget"]: WidgetNode_default,
|
|
3250
|
-
["youtube"]: VideoNode_default,
|
|
3251
|
-
["video"]: VideoNode_default,
|
|
3252
|
-
["embed"]: EmbedNode_default
|
|
3253
|
-
};
|
|
3254
|
-
let cssClasses = "";
|
|
3255
|
-
if (props.order) {
|
|
3256
|
-
cssClasses = "order-" + props.order + " lg:order-1";
|
|
3257
|
-
}
|
|
3258
|
-
if (props.node.itemBoxShadow) {
|
|
3259
|
-
{
|
|
3260
|
-
}
|
|
3261
|
-
cssClasses = cssClasses + " " + (props.node.itemBoxShadow || "");
|
|
3262
|
-
}
|
|
3263
|
-
const styles = {};
|
|
3264
|
-
if (props.node.itemBorderWidth) {
|
|
3265
|
-
styles.borderWidth = props.node.itemBorderWidth;
|
|
3266
|
-
cssClasses = cssClasses + " px-4 py-2";
|
|
3267
|
-
}
|
|
3268
|
-
if (props.node.itemBorderRadius) {
|
|
3269
|
-
styles.borderRadius = props.node.itemBorderRadius;
|
|
3270
|
-
styles.overflow = "hidden";
|
|
3271
|
-
}
|
|
3272
|
-
function removeParagraphsAtStartAndEnd(layoutItem) {
|
|
3273
|
-
let startIndex = 0;
|
|
3274
|
-
{
|
|
3275
|
-
}
|
|
3276
|
-
while (startIndex < layoutItem.children.length && layoutItem.children[startIndex].type === "paragraph" && layoutItem.children[startIndex].children.filter((x) => x.type == "linebreak").length == layoutItem.children[startIndex].children.length) {
|
|
3277
|
-
startIndex++;
|
|
3278
|
-
}
|
|
3279
|
-
let endIndex = layoutItem.children.length - 1;
|
|
3280
|
-
{
|
|
3281
|
-
}
|
|
3282
|
-
while (endIndex >= 0 && layoutItem.children[endIndex].type === "paragraph" && layoutItem.children[endIndex].children.filter((x) => x.type == "linebreak").length == layoutItem.children[endIndex].children.length) {
|
|
3283
|
-
endIndex--;
|
|
3284
|
-
}
|
|
3285
|
-
if (startIndex <= endIndex) {
|
|
3286
|
-
layoutItem.children = layoutItem.children.slice(startIndex, endIndex + 1);
|
|
3287
|
-
} else {
|
|
3288
|
-
layoutItem.children = [];
|
|
3289
|
-
}
|
|
3290
|
-
return layoutItem;
|
|
3291
|
-
}
|
|
3292
|
-
let updatedLayout = props.node;
|
|
3293
|
-
if (props.node.itemBoxShadow || props.node.itemBorderWidth) {
|
|
3294
|
-
updatedLayout = props.node;
|
|
3295
|
-
} else {
|
|
3296
|
-
updatedLayout = removeParagraphsAtStartAndEnd(props.node);
|
|
3297
|
-
}
|
|
3298
|
-
return /* @__PURE__ */ jsx61(React46.Fragment, { children: /* @__PURE__ */ jsx61("div", { className: "layout-item " + cssClasses, style: { ...styles }, children: updatedLayout.children.map((node, index) => {
|
|
3299
|
-
{
|
|
3300
|
-
}
|
|
3301
|
-
const SelectedNode = NodeTypes2[node.type];
|
|
3302
|
-
return /* @__PURE__ */ jsx61(React46.Fragment, { children: SelectedNode && /* @__PURE__ */ jsx61(
|
|
3303
|
-
SelectedNode,
|
|
3304
|
-
{
|
|
3305
|
-
node,
|
|
3306
|
-
routeParameters: props.routeParameters,
|
|
3307
|
-
query: props.query,
|
|
3308
|
-
session: props.session,
|
|
3309
|
-
host: props.host,
|
|
3310
|
-
path: props.path,
|
|
3311
|
-
apiBaseUrl: props.apiBaseUrl
|
|
3312
|
-
}
|
|
3313
|
-
) }, index);
|
|
3314
|
-
}) }) });
|
|
3315
|
-
};
|
|
3316
|
-
var LayoutItemNode_default = LayoutItemNode;
|
|
3317
|
-
|
|
3318
3546
|
// src/components/utilities/AssetUtility.tsx
|
|
3319
3547
|
var AssetUtility = class {
|
|
3320
3548
|
constructor() {
|
|
@@ -3328,573 +3556,9 @@ var AssetUtility = class {
|
|
|
3328
3556
|
};
|
|
3329
3557
|
var AssetUtility_default = AssetUtility;
|
|
3330
3558
|
|
|
3331
|
-
// src/components/pageRenderingEngine/nodes/LayoutContainerNode.tsx
|
|
3332
|
-
import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3333
|
-
var LayoutContainerNode = (props) => {
|
|
3334
|
-
const VERTICAL_ALIGNMENT_CLASSES = {
|
|
3335
|
-
start: "items-start",
|
|
3336
|
-
center: "items-center place-content-center",
|
|
3337
|
-
end: "items-end",
|
|
3338
|
-
stretch: "items-stretch",
|
|
3339
|
-
baseline: "items-baseline"
|
|
3340
|
-
};
|
|
3341
|
-
const LAYOUTGRID_COLS_CLASSES = {
|
|
3342
|
-
"1fr": "layout-grid-col-1",
|
|
3343
|
-
"1fr 1fr": "layout-grid-col-2-equal",
|
|
3344
|
-
"1fr 2fr": "layout-grid-col-2-widths-33-67",
|
|
3345
|
-
"2fr 1fr": "layout-grid-col-2-widths-67-33",
|
|
3346
|
-
"3fr 2fr": "layout-grid-col-2-widths-60-40",
|
|
3347
|
-
"3fr 1fr": "layout-grid-col-2-widths-75-25",
|
|
3348
|
-
"1fr 1fr 1fr": "layout-grid-col-3-equal",
|
|
3349
|
-
"1fr 2fr 1fr": "layout-grid-col-3-widths-25-50-25",
|
|
3350
|
-
"1fr 6fr 1fr": "layout-grid-col-3-widths-15-70-15",
|
|
3351
|
-
"1fr 1fr 1fr 1fr": "layout-grid-col-4-equal"
|
|
3352
|
-
};
|
|
3353
|
-
const sectionWidth = props.node.sectionWidth || "fixed";
|
|
3354
|
-
let gridCssClasses = LAYOUTGRID_COLS_CLASSES[props.node.templateColumns] || "";
|
|
3355
|
-
if (props.node.contentVerticalAlignment) {
|
|
3356
|
-
gridCssClasses += " " + (VERTICAL_ALIGNMENT_CLASSES[props.node.contentVerticalAlignment] || "");
|
|
3357
|
-
}
|
|
3358
|
-
const columnGap = props.node.columnGap || "0.5rem";
|
|
3359
|
-
const styles = {};
|
|
3360
|
-
let cssClasses = "layout_grid";
|
|
3361
|
-
let addPadding = false;
|
|
3362
|
-
if (props.node.backgroundColor) {
|
|
3363
|
-
styles.backgroundColor = props.node.backgroundColor;
|
|
3364
|
-
}
|
|
3365
|
-
if (props.node.borderWidth) {
|
|
3366
|
-
styles.borderWidth = props.node.borderWidth;
|
|
3367
|
-
addPadding = true;
|
|
3368
|
-
}
|
|
3369
|
-
if (props.node.borderRadius) {
|
|
3370
|
-
styles.borderRadius = props.node.borderRadius;
|
|
3371
|
-
}
|
|
3372
|
-
if (props.node.boxShadow && props.node.boxShadow !== "shadow-none") {
|
|
3373
|
-
cssClasses += " " + props.node.boxShadow;
|
|
3374
|
-
addPadding = true;
|
|
3375
|
-
}
|
|
3376
|
-
const backgroundLayers = [];
|
|
3377
|
-
if (props.node.backgroundImage) {
|
|
3378
|
-
const resolved = AssetUtility_default.resolveUrl(
|
|
3379
|
-
props.apiBaseUrl,
|
|
3380
|
-
props.node.backgroundImage
|
|
3381
|
-
);
|
|
3382
|
-
if (resolved) {
|
|
3383
|
-
backgroundLayers.push(`url('${resolved}')`);
|
|
3384
|
-
addPadding = true;
|
|
3385
|
-
}
|
|
3386
|
-
}
|
|
3387
|
-
if (props.node.gradientColor1 && props.node.gradientColor2) {
|
|
3388
|
-
backgroundLayers.push(
|
|
3389
|
-
`linear-gradient(to bottom, ${props.node.gradientColor1}, ${props.node.gradientColor2})`
|
|
3390
|
-
);
|
|
3391
|
-
addPadding = true;
|
|
3392
|
-
} else if (props.node.gradientColor1) {
|
|
3393
|
-
backgroundLayers.push(props.node.gradientColor1);
|
|
3394
|
-
addPadding = true;
|
|
3395
|
-
} else if (props.node.gradientColor2) {
|
|
3396
|
-
backgroundLayers.push(props.node.gradientColor2);
|
|
3397
|
-
addPadding = true;
|
|
3398
|
-
}
|
|
3399
|
-
if (backgroundLayers.length) {
|
|
3400
|
-
styles.background = backgroundLayers.join(", ");
|
|
3401
|
-
}
|
|
3402
|
-
const renderChildren = () => props.node.children?.map((node, index) => /* @__PURE__ */ jsx62(
|
|
3403
|
-
LayoutItemNode_default,
|
|
3404
|
-
{
|
|
3405
|
-
node,
|
|
3406
|
-
order: props.node.smOrder === "reverse" ? props.node.children.length - index : index,
|
|
3407
|
-
routeParameters: props.routeParameters,
|
|
3408
|
-
query: props.query,
|
|
3409
|
-
session: props.session,
|
|
3410
|
-
host: props.host,
|
|
3411
|
-
path: props.path,
|
|
3412
|
-
apiBaseUrl: props.apiBaseUrl
|
|
3413
|
-
},
|
|
3414
|
-
index
|
|
3415
|
-
));
|
|
3416
|
-
return /* @__PURE__ */ jsxs29(Fragment8, { children: [
|
|
3417
|
-
sectionWidth === "mixed" && /* @__PURE__ */ jsx62("div", { className: cssClasses, style: styles, children: /* @__PURE__ */ jsx62("div", { className: "container", children: /* @__PURE__ */ jsx62(
|
|
3418
|
-
"div",
|
|
3419
|
-
{
|
|
3420
|
-
className: `grid gap-y-4 lg:gap-y-0 ${gridCssClasses} ${addPadding ? "py-8 lg:py-6" : ""}`,
|
|
3421
|
-
style: { columnGap, minHeight: props.node.height },
|
|
3422
|
-
children: renderChildren()
|
|
3423
|
-
}
|
|
3424
|
-
) }) }),
|
|
3425
|
-
sectionWidth === "full" && /* @__PURE__ */ jsx62(
|
|
3426
|
-
"div",
|
|
3427
|
-
{
|
|
3428
|
-
className: `grid gap-y-4 lg:gap-y-0 ${cssClasses} ${gridCssClasses} ${addPadding ? "p-8 lg:p-0" : ""}`,
|
|
3429
|
-
style: { columnGap, ...styles },
|
|
3430
|
-
children: renderChildren()
|
|
3431
|
-
}
|
|
3432
|
-
),
|
|
3433
|
-
sectionWidth === "fixed" && /* @__PURE__ */ jsx62("div", { className: "container", children: /* @__PURE__ */ jsx62(
|
|
3434
|
-
"div",
|
|
3435
|
-
{
|
|
3436
|
-
className: `grid gap-y-4 lg:gap-y-0 ${cssClasses} ${gridCssClasses} ${addPadding ? "px-8 py-6 lg:px-6 lg:py-6" : ""}`,
|
|
3437
|
-
style: { columnGap, ...styles },
|
|
3438
|
-
children: renderChildren()
|
|
3439
|
-
}
|
|
3440
|
-
) })
|
|
3441
|
-
] });
|
|
3442
|
-
};
|
|
3443
|
-
var LayoutContainerNode_default = LayoutContainerNode;
|
|
3444
|
-
|
|
3445
|
-
// src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
|
|
3446
|
-
import React47, { useRef as useRef5, useReducer as useReducer2, useCallback as useCallback3, useEffect as useEffect9 } from "react";
|
|
3447
|
-
|
|
3448
|
-
// src/components/pageRenderingEngine/nodes/InputControlNode.tsx
|
|
3449
|
-
import { jsx as jsx63 } from "react/jsx-runtime";
|
|
3450
|
-
var InputControlNode = (props) => {
|
|
3451
|
-
return /* @__PURE__ */ jsx63("div", { children: /* @__PURE__ */ jsx63(
|
|
3452
|
-
InputControl_default,
|
|
3453
|
-
{
|
|
3454
|
-
name: props.node.name,
|
|
3455
|
-
controlType: "lineTextInput",
|
|
3456
|
-
value: props.value,
|
|
3457
|
-
callback: props.callback,
|
|
3458
|
-
attributes: {
|
|
3459
|
-
pattern: props.node.pattern,
|
|
3460
|
-
maxLength: props.node.maxLength,
|
|
3461
|
-
minLength: props.node.minLength,
|
|
3462
|
-
//maxValue:props.node.maxV,
|
|
3463
|
-
//minValue?: number,
|
|
3464
|
-
readOnly: props.node.readOnly,
|
|
3465
|
-
label: "name",
|
|
3466
|
-
//props.node.label,
|
|
3467
|
-
hintText: props.node.hintText,
|
|
3468
|
-
placeholder: props.node.placeholder,
|
|
3469
|
-
required: props.node.required,
|
|
3470
|
-
errorMessage: props.node.errorMessage,
|
|
3471
|
-
helpText: props.node.helpText,
|
|
3472
|
-
autoFocus: props.node.autoFocus
|
|
3473
|
-
}
|
|
3474
|
-
}
|
|
3475
|
-
) });
|
|
3476
|
-
};
|
|
3477
|
-
var InputControlNode_default = InputControlNode;
|
|
3478
|
-
|
|
3479
|
-
// src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
|
|
3480
|
-
import { jsx as jsx64, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3481
|
-
var FormContainerNode = (props) => {
|
|
3482
|
-
const NodeTypes2 = {
|
|
3483
|
-
["input-control"]: InputControlNode_default
|
|
3484
|
-
};
|
|
3485
|
-
const { node } = props;
|
|
3486
|
-
const formRef = useRef5(null);
|
|
3487
|
-
const initialState = {
|
|
3488
|
-
inputValues: {},
|
|
3489
|
-
lastPropertyChanged: ""
|
|
3490
|
-
};
|
|
3491
|
-
const [formState, dispatch] = useReducer2(FormReducer_default, initialState);
|
|
3492
|
-
const handleInputChange = useCallback3((updatedValues) => {
|
|
3493
|
-
dispatch({ type: FORM_INPUT_UPDATE, name: updatedValues.name, value: updatedValues.value });
|
|
3494
|
-
}, [dispatch]);
|
|
3495
|
-
const onValidate = async () => {
|
|
3496
|
-
if (formRef.current && !formRef.current.checkValidity()) {
|
|
3497
|
-
formRef.current.classList.add("validated");
|
|
3498
|
-
return false;
|
|
3499
|
-
} else {
|
|
3500
|
-
return true;
|
|
3501
|
-
}
|
|
3502
|
-
};
|
|
3503
|
-
useEffect9(() => {
|
|
3504
|
-
const fetchInitialData = async () => {
|
|
3505
|
-
if (!props.fetchData || !node.dataFetchApi) return;
|
|
3506
|
-
const response = await props.fetchData(
|
|
3507
|
-
node.dataFetchApi,
|
|
3508
|
-
props.routeParameters
|
|
3509
|
-
);
|
|
3510
|
-
if (response?.isSuccessful) {
|
|
3511
|
-
dispatch({
|
|
3512
|
-
type: FORM_INITIAL_UPDATE,
|
|
3513
|
-
values: response.result,
|
|
3514
|
-
name: "all"
|
|
3515
|
-
});
|
|
3516
|
-
}
|
|
3517
|
-
};
|
|
3518
|
-
fetchInitialData();
|
|
3519
|
-
}, [props.fetchData, node.dataFetchApi, props.routeParameters]);
|
|
3520
|
-
return /* @__PURE__ */ jsxs30("form", { className: "group space-y-6 pb-6 overflow-y-auto", noValidate: true, ref: formRef, children: [
|
|
3521
|
-
node.children && node.children.map((node2, index) => {
|
|
3522
|
-
{
|
|
3523
|
-
}
|
|
3524
|
-
const SelectedNode = NodeTypes2[node2.type];
|
|
3525
|
-
return /* @__PURE__ */ jsx64(React47.Fragment, { children: SelectedNode && node2.type == "input-control" && /* @__PURE__ */ jsx64(
|
|
3526
|
-
InputControlNode_default,
|
|
3527
|
-
{
|
|
3528
|
-
value: formState.inputValues[node2.name],
|
|
3529
|
-
callback: handleInputChange,
|
|
3530
|
-
node: node2
|
|
3531
|
-
}
|
|
3532
|
-
) }, index);
|
|
3533
|
-
}),
|
|
3534
|
-
node.children.length == 0 && /* @__PURE__ */ jsx64("div", { className: "py-0.5 lg:py-1.5" })
|
|
3535
|
-
] });
|
|
3536
|
-
};
|
|
3537
|
-
var FormContainerNode_default = FormContainerNode;
|
|
3538
|
-
|
|
3539
|
-
// src/components/pageRenderingEngine/nodes/DivContainer.tsx
|
|
3540
|
-
import React51 from "react";
|
|
3541
|
-
|
|
3542
|
-
// src/components/utilities/AnimationUtility.tsx
|
|
3543
|
-
var AnimationUtility = class {
|
|
3544
|
-
static generateAnimationCSS(config, guid) {
|
|
3545
|
-
const {
|
|
3546
|
-
duration = 700,
|
|
3547
|
-
delay = 0,
|
|
3548
|
-
easing = "ease-out",
|
|
3549
|
-
distance = 30,
|
|
3550
|
-
scaleStart = 1,
|
|
3551
|
-
scaleEnd = 1.2,
|
|
3552
|
-
repeat = 1,
|
|
3553
|
-
intensity = 20,
|
|
3554
|
-
speedPerChar = 100,
|
|
3555
|
-
cursor = true,
|
|
3556
|
-
mode = "enter",
|
|
3557
|
-
direction = "left"
|
|
3558
|
-
// Default direction
|
|
3559
|
-
} = config;
|
|
3560
|
-
let base = "", visible = "", keyframes = "";
|
|
3561
|
-
switch (config.animation) {
|
|
3562
|
-
case "Fade":
|
|
3563
|
-
base = `opacity:0; transition:opacity ${duration}ms ${easing} ${delay}ms;`;
|
|
3564
|
-
visible = `opacity:1;`;
|
|
3565
|
-
break;
|
|
3566
|
-
case "FadeInUp":
|
|
3567
|
-
base = `opacity:0; transform:translateY(${distance}px); transition:all ${duration}ms ${easing} ${delay}ms;`;
|
|
3568
|
-
visible = `opacity:1; transform:translateY(0);`;
|
|
3569
|
-
break;
|
|
3570
|
-
case "Slide":
|
|
3571
|
-
const slideTransform = this.getSlideTransform(direction, distance);
|
|
3572
|
-
base = `opacity:0; transform:${slideTransform.start}; transition:all ${duration}ms ${easing} ${delay}ms; will-change: transform, opacity;`;
|
|
3573
|
-
visible = `opacity:1; transform:${slideTransform.end}; will-change: unset;`;
|
|
3574
|
-
break;
|
|
3575
|
-
case "ZoomIn":
|
|
3576
|
-
if (mode === "enter") {
|
|
3577
|
-
base = `opacity:0; transform:scale(${scaleStart}); transition:all ${duration}ms ${easing} ${delay}ms;`;
|
|
3578
|
-
visible = `opacity:1; transform:scale(${scaleEnd});`;
|
|
3579
|
-
} else {
|
|
3580
|
-
base = `transform:scale(${scaleStart}); transition:transform ${duration / 1e3}s ${easing} ${delay / 1e3}s;`;
|
|
3581
|
-
visible = `transform:scale(${scaleEnd});`;
|
|
3582
|
-
}
|
|
3583
|
-
break;
|
|
3584
|
-
case "Bounce":
|
|
3585
|
-
keyframes = `
|
|
3586
|
-
@keyframes bounce {
|
|
3587
|
-
0%,20%,50%,80%,100% { transform: translateY(0); }
|
|
3588
|
-
40% { transform: translateY(-${intensity}px); }
|
|
3589
|
-
60% { transform: translateY(-${intensity / 2}px); }
|
|
3590
|
-
}
|
|
3591
|
-
`;
|
|
3592
|
-
if (mode === "enter") {
|
|
3593
|
-
base = `opacity:0;`;
|
|
3594
|
-
visible = `opacity:1; animation:bounce ${duration}ms ${easing} ${delay}ms ${repeat};`;
|
|
3595
|
-
} else {
|
|
3596
|
-
base = ``;
|
|
3597
|
-
visible = `animation:bounce ${duration / 1e3}s ${easing} ${delay / 1e3}s ${repeat};`;
|
|
3598
|
-
}
|
|
3599
|
-
break;
|
|
3600
|
-
case "Typewriter":
|
|
3601
|
-
keyframes = `
|
|
3602
|
-
@keyframes typewriter { from { width: 0 } to { width: 100% } }
|
|
3603
|
-
@keyframes blink { 50% { border-color: transparent } }
|
|
3604
|
-
`;
|
|
3605
|
-
base = `
|
|
3606
|
-
overflow:hidden;
|
|
3607
|
-
border-right:${cursor ? "2px solid black" : "none"};
|
|
3608
|
-
white-space:nowrap;
|
|
3609
|
-
width:0;
|
|
3610
|
-
margin:0 auto;
|
|
3611
|
-
`;
|
|
3612
|
-
visible = `
|
|
3613
|
-
animation:typewriter ${speedPerChar * 30}ms steps(30,end) ${delay}ms forwards
|
|
3614
|
-
${cursor ? ", blink .75s step-end infinite" : ""};
|
|
3615
|
-
`;
|
|
3616
|
-
break;
|
|
3617
|
-
}
|
|
3618
|
-
if (mode === "hover") {
|
|
3619
|
-
return `
|
|
3620
|
-
${keyframes}
|
|
3621
|
-
${guid} { ${base} }
|
|
3622
|
-
${guid}:hover { ${visible} }
|
|
3623
|
-
`;
|
|
3624
|
-
} else {
|
|
3625
|
-
return `
|
|
3626
|
-
${keyframes}
|
|
3627
|
-
${guid} { ${base} }
|
|
3628
|
-
${guid}.visible { ${visible} }
|
|
3629
|
-
`;
|
|
3630
|
-
}
|
|
3631
|
-
}
|
|
3632
|
-
// Helper method to generate slide transforms based on direction
|
|
3633
|
-
static getSlideTransform(direction, distance) {
|
|
3634
|
-
switch (direction) {
|
|
3635
|
-
case "left":
|
|
3636
|
-
return { start: `translateX(${distance}px)`, end: `translateX(0)` };
|
|
3637
|
-
case "right":
|
|
3638
|
-
return { start: `translateX(-${distance}px)`, end: `translateX(0)` };
|
|
3639
|
-
case "up":
|
|
3640
|
-
return { start: `translateY(${distance}px)`, end: `translateY(0)` };
|
|
3641
|
-
case "down":
|
|
3642
|
-
return { start: `translateY(-${distance}px)`, end: `translateY(0)` };
|
|
3643
|
-
default:
|
|
3644
|
-
return { start: `translateX(${distance}px)`, end: `translateX(0)` };
|
|
3645
|
-
}
|
|
3646
|
-
}
|
|
3647
|
-
};
|
|
3648
|
-
var AnimationUtility_default = AnimationUtility;
|
|
3649
|
-
|
|
3650
|
-
// src/components/Pagination.tsx
|
|
3651
|
-
import { useMemo } from "react";
|
|
3652
|
-
import { jsx as jsx65, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3653
|
-
var Pagination = (props) => {
|
|
3654
|
-
const { dataset, path, query, showPageSizeSelector = false, showJumpToPage = false } = props;
|
|
3655
|
-
const builder = useMemo(() => {
|
|
3656
|
-
const b = new OdataBuilder(path);
|
|
3657
|
-
if (query) b.setQuery(query);
|
|
3658
|
-
return b;
|
|
3659
|
-
}, [path, query]);
|
|
3660
|
-
const activePageNumber = builder.getPageNumber(Constants.pagesize);
|
|
3661
|
-
const totalItems = dataset?.count || 0;
|
|
3662
|
-
const itemsPerPage = parseInt(builder.top || Constants.pagesize.toString());
|
|
3663
|
-
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
|
3664
|
-
const startItem = totalItems > 0 ? (activePageNumber - 1) * itemsPerPage + 1 : 0;
|
|
3665
|
-
const endItem = Math.min(activePageNumber * itemsPerPage, totalItems);
|
|
3666
|
-
const getPaginationRange = () => {
|
|
3667
|
-
const delta = 1;
|
|
3668
|
-
const range = [];
|
|
3669
|
-
if (totalPages <= 7) {
|
|
3670
|
-
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
3671
|
-
}
|
|
3672
|
-
range.push(1);
|
|
3673
|
-
let start = Math.max(2, activePageNumber - delta);
|
|
3674
|
-
let end = Math.min(totalPages - 1, activePageNumber + delta);
|
|
3675
|
-
if (activePageNumber - delta <= 2) {
|
|
3676
|
-
end = Math.min(totalPages - 1, 4);
|
|
3677
|
-
}
|
|
3678
|
-
if (activePageNumber + delta >= totalPages - 1) {
|
|
3679
|
-
start = Math.max(2, totalPages - 4);
|
|
3680
|
-
}
|
|
3681
|
-
if (start > 2) {
|
|
3682
|
-
range.push("...");
|
|
3683
|
-
}
|
|
3684
|
-
for (let i = start; i <= end; i++) {
|
|
3685
|
-
range.push(i);
|
|
3686
|
-
}
|
|
3687
|
-
if (end < totalPages - 1) {
|
|
3688
|
-
range.push("...");
|
|
3689
|
-
}
|
|
3690
|
-
if (totalPages > 1) {
|
|
3691
|
-
range.push(totalPages);
|
|
3692
|
-
}
|
|
3693
|
-
return range;
|
|
3694
|
-
};
|
|
3695
|
-
const paginationRange = getPaginationRange();
|
|
3696
|
-
const PageButton = ({ page, children }) => /* @__PURE__ */ jsx65(
|
|
3697
|
-
Hyperlink,
|
|
3698
|
-
{
|
|
3699
|
-
linkType: "Link" /* Link */,
|
|
3700
|
-
className: `
|
|
3701
|
-
min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center px-2.5 md:px-3
|
|
3702
|
-
border text-sm font-medium transition-colors duration-150
|
|
3703
|
-
${activePageNumber === page ? "bg-primary-base font-semibold" : ""}
|
|
3704
|
-
`,
|
|
3705
|
-
href: builder.getNewPageUrl(page),
|
|
3706
|
-
children
|
|
3707
|
-
}
|
|
3708
|
-
);
|
|
3709
|
-
const NavigationButton = ({ page, disabled, children }) => {
|
|
3710
|
-
if (disabled) {
|
|
3711
|
-
return /* @__PURE__ */ jsx65("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 });
|
|
3712
|
-
}
|
|
3713
|
-
return /* @__PURE__ */ jsx65(
|
|
3714
|
-
Hyperlink,
|
|
3715
|
-
{
|
|
3716
|
-
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",
|
|
3717
|
-
href: builder.getNewPageUrl(page),
|
|
3718
|
-
children
|
|
3719
|
-
}
|
|
3720
|
-
);
|
|
3721
|
-
};
|
|
3722
|
-
if (totalPages <= 1 && totalItems === 0) return null;
|
|
3723
|
-
return /* @__PURE__ */ jsxs31("div", { className: "py-6 border-t bg-default", children: [
|
|
3724
|
-
/* @__PURE__ */ jsxs31("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4", children: [
|
|
3725
|
-
/* @__PURE__ */ jsxs31("div", { className: "text-sm", children: [
|
|
3726
|
-
"Showing ",
|
|
3727
|
-
/* @__PURE__ */ jsxs31("span", { className: "font-semibold", children: [
|
|
3728
|
-
startItem,
|
|
3729
|
-
"-",
|
|
3730
|
-
endItem
|
|
3731
|
-
] }),
|
|
3732
|
-
" ",
|
|
3733
|
-
"out of ",
|
|
3734
|
-
/* @__PURE__ */ jsx65("span", { className: "font-semibold", children: totalItems.toLocaleString() }),
|
|
3735
|
-
" results"
|
|
3736
|
-
] }),
|
|
3737
|
-
totalPages > 1 && /* @__PURE__ */ jsxs31("div", { className: "flex items-center space-x-1", children: [
|
|
3738
|
-
/* @__PURE__ */ jsxs31(
|
|
3739
|
-
NavigationButton,
|
|
3740
|
-
{
|
|
3741
|
-
page: activePageNumber - 1,
|
|
3742
|
-
disabled: activePageNumber === 1,
|
|
3743
|
-
children: [
|
|
3744
|
-
/* @__PURE__ */ jsx65("span", { children: /* @__PURE__ */ jsx65(Icon_default, { name: "chevronLeft", className: "w-4 h-4 mr-1" }) }),
|
|
3745
|
-
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Prev" })
|
|
3746
|
-
]
|
|
3747
|
-
}
|
|
3748
|
-
),
|
|
3749
|
-
paginationRange.map((item, index) => {
|
|
3750
|
-
if (item === "...") {
|
|
3751
|
-
return /* @__PURE__ */ jsx65(
|
|
3752
|
-
"span",
|
|
3753
|
-
{
|
|
3754
|
-
className: "min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center text-gray-500",
|
|
3755
|
-
children: "..."
|
|
3756
|
-
},
|
|
3757
|
-
`ellipsis-${index}`
|
|
3758
|
-
);
|
|
3759
|
-
}
|
|
3760
|
-
const page = item;
|
|
3761
|
-
return /* @__PURE__ */ jsx65(PageButton, { page, children: page }, page);
|
|
3762
|
-
}),
|
|
3763
|
-
/* @__PURE__ */ jsxs31(
|
|
3764
|
-
NavigationButton,
|
|
3765
|
-
{
|
|
3766
|
-
page: activePageNumber + 1,
|
|
3767
|
-
disabled: activePageNumber === totalPages,
|
|
3768
|
-
children: [
|
|
3769
|
-
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Next" }),
|
|
3770
|
-
/* @__PURE__ */ jsx65("span", { children: /* @__PURE__ */ jsx65(Icon_default, { name: "chevronRight", className: "w-4 h-4 ml-1" }) })
|
|
3771
|
-
]
|
|
3772
|
-
}
|
|
3773
|
-
)
|
|
3774
|
-
] }),
|
|
3775
|
-
showJumpToPage && totalPages > 5 && /* @__PURE__ */ jsxs31("div", { className: "flex items-center space-x-2", children: [
|
|
3776
|
-
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Go to:" }),
|
|
3777
|
-
/* @__PURE__ */ jsx65("div", { className: "relative", children: /* @__PURE__ */ jsx65(
|
|
3778
|
-
"input",
|
|
3779
|
-
{
|
|
3780
|
-
type: "number",
|
|
3781
|
-
min: "1",
|
|
3782
|
-
max: totalPages,
|
|
3783
|
-
defaultValue: activePageNumber,
|
|
3784
|
-
className: "w-20 h-10 px-3 border rounded text-sm focus:outline-none focus:ring-2 focus:border-transparent",
|
|
3785
|
-
onKeyDown: (e) => {
|
|
3786
|
-
if (e.key === "Enter") {
|
|
3787
|
-
const input = e.target;
|
|
3788
|
-
const page = parseInt(input.value);
|
|
3789
|
-
if (page >= 1 && page <= totalPages && page !== activePageNumber) {
|
|
3790
|
-
window.location.href = builder.getNewPageUrl(page);
|
|
3791
|
-
}
|
|
3792
|
-
}
|
|
3793
|
-
}
|
|
3794
|
-
}
|
|
3795
|
-
) })
|
|
3796
|
-
] })
|
|
3797
|
-
] }),
|
|
3798
|
-
showPageSizeSelector && /* @__PURE__ */ jsx65("div", { className: "mt-4 pt-4 border-t bg-default", children: /* @__PURE__ */ jsxs31("div", { className: "flex items-center justify-center space-x-2", children: [
|
|
3799
|
-
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Show:" }),
|
|
3800
|
-
/* @__PURE__ */ jsx65("div", { className: "flex space-x-1", children: [10, 25, 50, 100].map((size) => /* @__PURE__ */ jsx65(
|
|
3801
|
-
Hyperlink,
|
|
3802
|
-
{
|
|
3803
|
-
className: `
|
|
3804
|
-
px-3 py-1 text-sm rounded border transition-colors duration-150
|
|
3805
|
-
${itemsPerPage === size ? "bg-primary-base font-medium" : "bg-neutral-weak"}
|
|
3806
|
-
`,
|
|
3807
|
-
href: builder.getNewPageSizeUrl(size),
|
|
3808
|
-
children: size
|
|
3809
|
-
},
|
|
3810
|
-
size
|
|
3811
|
-
)) }),
|
|
3812
|
-
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "per page" })
|
|
3813
|
-
] }) })
|
|
3814
|
-
] });
|
|
3815
|
-
};
|
|
3816
|
-
var Pagination_default = Pagination;
|
|
3817
|
-
|
|
3818
|
-
// src/components/utilities/PathUtility.tsx
|
|
3819
|
-
var PathUtility = class {
|
|
3820
|
-
constructor() {
|
|
3821
|
-
}
|
|
3822
|
-
normalizePath(path) {
|
|
3823
|
-
if (path == null) {
|
|
3824
|
-
return "/";
|
|
3825
|
-
}
|
|
3826
|
-
const trimmedPath = path.replace(/^\/|\/$/g, "");
|
|
3827
|
-
return trimmedPath === "" ? "/" : "/" + trimmedPath + "/";
|
|
3828
|
-
}
|
|
3829
|
-
joinAndNormalizePaths(path1, path2) {
|
|
3830
|
-
path1 = path1.replace(/\/$/, "");
|
|
3831
|
-
path2 = path2.replace(/^\//, "");
|
|
3832
|
-
const joinedPath = `${path1}/${path2}`;
|
|
3833
|
-
const normalizedPath = joinedPath.replace(/\/{2,}/g, "/");
|
|
3834
|
-
return normalizedPath === "" ? "/" : "/" + normalizedPath;
|
|
3835
|
-
}
|
|
3836
|
-
removeLeadingAndTrailingSlashes(path) {
|
|
3837
|
-
if (path == null) {
|
|
3838
|
-
return "/";
|
|
3839
|
-
}
|
|
3840
|
-
const trimmedPath = path.replace(/^\/|\/$/g, "");
|
|
3841
|
-
return trimmedPath;
|
|
3842
|
-
}
|
|
3843
|
-
removeTrailingSlash(path) {
|
|
3844
|
-
if (path == null) {
|
|
3845
|
-
return "/";
|
|
3846
|
-
}
|
|
3847
|
-
const trimmedPath = path.replace(/\/$/, "");
|
|
3848
|
-
return trimmedPath;
|
|
3849
|
-
}
|
|
3850
|
-
joinPaths(path1, path2) {
|
|
3851
|
-
if (!path1.endsWith("/") && !path2.startsWith("/")) {
|
|
3852
|
-
return `${path1}/${path2}`;
|
|
3853
|
-
} else if (path1.endsWith("/") && path2.startsWith("/")) {
|
|
3854
|
-
return `${path1}${path2.substr(1)}`;
|
|
3855
|
-
} else {
|
|
3856
|
-
return `${path1}${path2}`;
|
|
3857
|
-
}
|
|
3858
|
-
}
|
|
3859
|
-
getFirstSegment(path) {
|
|
3860
|
-
if (!path || path === "/") {
|
|
3861
|
-
return "";
|
|
3862
|
-
}
|
|
3863
|
-
const segments = path.split("/").filter(Boolean);
|
|
3864
|
-
return segments.length > 0 ? segments[0] : "";
|
|
3865
|
-
}
|
|
3866
|
-
};
|
|
3867
|
-
var PathUtility_default = new PathUtility();
|
|
3868
|
-
|
|
3869
|
-
// src/components/pageRenderingEngine/nodes/EnterAnimationClient.tsx
|
|
3870
|
-
import React49, { useEffect as useEffect10, useRef as useRef6 } from "react";
|
|
3871
|
-
import { Fragment as Fragment9, jsx as jsx66 } from "react/jsx-runtime";
|
|
3872
|
-
function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
3873
|
-
const ref = useRef6(null);
|
|
3874
|
-
useEffect10(() => {
|
|
3875
|
-
if (!hasEnterAnimation || !ref.current) return;
|
|
3876
|
-
const observer = new IntersectionObserver(
|
|
3877
|
-
(entries) => {
|
|
3878
|
-
entries.forEach((entry) => {
|
|
3879
|
-
if (entry.isIntersecting) {
|
|
3880
|
-
entry.target.classList.add("visible");
|
|
3881
|
-
observer.unobserve(entry.target);
|
|
3882
|
-
}
|
|
3883
|
-
});
|
|
3884
|
-
},
|
|
3885
|
-
{ threshold: 0.1 }
|
|
3886
|
-
);
|
|
3887
|
-
observer.observe(ref.current);
|
|
3888
|
-
return () => observer.disconnect();
|
|
3889
|
-
}, [hasEnterAnimation]);
|
|
3890
|
-
return /* @__PURE__ */ jsx66(Fragment9, { children: children && // enforce passing the ref to Wrapper
|
|
3891
|
-
//@ts-ignore
|
|
3892
|
-
React49.cloneElement(children, { ref }) });
|
|
3893
|
-
}
|
|
3894
|
-
|
|
3895
3559
|
// src/components/Slider.tsx
|
|
3896
|
-
import
|
|
3897
|
-
import { Fragment as
|
|
3560
|
+
import React46, { useState as useState10, useEffect as useEffect10, Children, cloneElement } from "react";
|
|
3561
|
+
import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3898
3562
|
var Slider = ({
|
|
3899
3563
|
children,
|
|
3900
3564
|
slidesToShow = 4,
|
|
@@ -3912,13 +3576,13 @@ var Slider = ({
|
|
|
3912
3576
|
pillStyle = "cumulative",
|
|
3913
3577
|
progressPosition = "bottom"
|
|
3914
3578
|
}) => {
|
|
3915
|
-
const [currentSlide, setCurrentSlide] =
|
|
3916
|
-
const [transition, setTransition] =
|
|
3917
|
-
const [slidesToShowState, setSlidesToShowState] =
|
|
3579
|
+
const [currentSlide, setCurrentSlide] = useState10(0);
|
|
3580
|
+
const [transition, setTransition] = useState10(true);
|
|
3581
|
+
const [slidesToShowState, setSlidesToShowState] = useState10(
|
|
3918
3582
|
typeof slidesToShow === "number" ? slidesToShow : slidesToShow.large
|
|
3919
3583
|
);
|
|
3920
|
-
const [isPlaying, setIsPlaying] =
|
|
3921
|
-
|
|
3584
|
+
const [isPlaying, setIsPlaying] = useState10(autoplay);
|
|
3585
|
+
useEffect10(() => {
|
|
3922
3586
|
if (typeof slidesToShow === "number") return;
|
|
3923
3587
|
const handleResize = () => {
|
|
3924
3588
|
if (window.innerWidth >= 1024) {
|
|
@@ -3933,7 +3597,7 @@ var Slider = ({
|
|
|
3933
3597
|
window.addEventListener("resize", handleResize);
|
|
3934
3598
|
return () => window.removeEventListener("resize", handleResize);
|
|
3935
3599
|
}, [slidesToShow]);
|
|
3936
|
-
|
|
3600
|
+
useEffect10(() => {
|
|
3937
3601
|
if (!autoplay) return;
|
|
3938
3602
|
const timer = setInterval(() => {
|
|
3939
3603
|
if (isPlaying) {
|
|
@@ -3988,10 +3652,10 @@ var Slider = ({
|
|
|
3988
3652
|
};
|
|
3989
3653
|
const translateX = -currentSlide * (100 / slidesToShowState);
|
|
3990
3654
|
const slides = Children.map(children, (child, index) => {
|
|
3991
|
-
if (!
|
|
3655
|
+
if (!React46.isValidElement(child)) return null;
|
|
3992
3656
|
const childProps = child.props;
|
|
3993
3657
|
const mergedClassName = `${childProps.className ?? ""} w-full`.trim();
|
|
3994
|
-
return /* @__PURE__ */
|
|
3658
|
+
return /* @__PURE__ */ jsx62(
|
|
3995
3659
|
"div",
|
|
3996
3660
|
{
|
|
3997
3661
|
className: `flex-none ${scaleOnHover ? "group hover:z-50" : ""} relative`,
|
|
@@ -4014,14 +3678,14 @@ var Slider = ({
|
|
|
4014
3678
|
return "bottom-4";
|
|
4015
3679
|
}
|
|
4016
3680
|
};
|
|
4017
|
-
return /* @__PURE__ */
|
|
3681
|
+
return /* @__PURE__ */ jsxs30(
|
|
4018
3682
|
"div",
|
|
4019
3683
|
{
|
|
4020
3684
|
className: `relative w-full overflow-hidden ${className}`,
|
|
4021
3685
|
onMouseEnter: handleMouseEnter,
|
|
4022
3686
|
onMouseLeave: handleMouseLeave,
|
|
4023
3687
|
children: [
|
|
4024
|
-
/* @__PURE__ */
|
|
3688
|
+
/* @__PURE__ */ jsx62(
|
|
4025
3689
|
"div",
|
|
4026
3690
|
{
|
|
4027
3691
|
className: "flex h-full",
|
|
@@ -4032,18 +3696,18 @@ var Slider = ({
|
|
|
4032
3696
|
children: slides
|
|
4033
3697
|
}
|
|
4034
3698
|
),
|
|
4035
|
-
show_arrows && /* @__PURE__ */
|
|
4036
|
-
/* @__PURE__ */
|
|
3699
|
+
show_arrows && /* @__PURE__ */ jsxs30(Fragment8, { children: [
|
|
3700
|
+
/* @__PURE__ */ jsx62(
|
|
4037
3701
|
ArrowButton,
|
|
4038
3702
|
{
|
|
4039
3703
|
direction: "left",
|
|
4040
3704
|
onClick: prevSlide,
|
|
4041
3705
|
visible: infinite_scroll || currentSlide > 0,
|
|
4042
3706
|
className: arrowClassName,
|
|
4043
|
-
children: /* @__PURE__ */
|
|
3707
|
+
children: /* @__PURE__ */ jsx62("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", className: "w-6 h-6", children: /* @__PURE__ */ jsx62("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 19.5 8.25 12l7.5-7.5" }) })
|
|
4044
3708
|
}
|
|
4045
3709
|
),
|
|
4046
|
-
/* @__PURE__ */
|
|
3710
|
+
/* @__PURE__ */ jsxs30(
|
|
4047
3711
|
ArrowButton,
|
|
4048
3712
|
{
|
|
4049
3713
|
direction: "right",
|
|
@@ -4051,13 +3715,13 @@ var Slider = ({
|
|
|
4051
3715
|
visible: infinite_scroll || currentSlide < maxSlide,
|
|
4052
3716
|
className: arrowClassName,
|
|
4053
3717
|
children: [
|
|
4054
|
-
/* @__PURE__ */
|
|
3718
|
+
/* @__PURE__ */ jsx62("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", className: "w-6 h-6", children: /* @__PURE__ */ jsx62("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "m8.25 4.5 7.5 7.5-7.5 7.5" }) }),
|
|
4055
3719
|
" "
|
|
4056
3720
|
]
|
|
4057
3721
|
}
|
|
4058
3722
|
)
|
|
4059
3723
|
] }),
|
|
4060
|
-
show_dots && /* @__PURE__ */
|
|
3724
|
+
show_dots && /* @__PURE__ */ jsx62("div", { className: `absolute left-1/2 -translate-x-1/2 flex justify-center space-x-1.5 ${getProgressPositionClass()}`, children: Array.from({ length: totalSlides }).map((_, index) => /* @__PURE__ */ jsx62(
|
|
4061
3725
|
ProgressPill,
|
|
4062
3726
|
{
|
|
4063
3727
|
active: index === currentSlide,
|
|
@@ -4083,7 +3747,7 @@ var ArrowButton = ({
|
|
|
4083
3747
|
visible,
|
|
4084
3748
|
children,
|
|
4085
3749
|
className = ""
|
|
4086
|
-
}) => /* @__PURE__ */
|
|
3750
|
+
}) => /* @__PURE__ */ jsx62(
|
|
4087
3751
|
"button",
|
|
4088
3752
|
{
|
|
4089
3753
|
className: `
|
|
@@ -4109,13 +3773,13 @@ var ProgressPill = ({
|
|
|
4109
3773
|
currentSlide,
|
|
4110
3774
|
totalSlides
|
|
4111
3775
|
}) => {
|
|
4112
|
-
const [progress, setProgress] =
|
|
4113
|
-
|
|
3776
|
+
const [progress, setProgress] = useState10(0);
|
|
3777
|
+
useEffect10(() => {
|
|
4114
3778
|
if (active) {
|
|
4115
3779
|
setProgress(0);
|
|
4116
3780
|
}
|
|
4117
3781
|
}, [active, index]);
|
|
4118
|
-
|
|
3782
|
+
useEffect10(() => {
|
|
4119
3783
|
if (!active || !isPlaying) {
|
|
4120
3784
|
if (!active) {
|
|
4121
3785
|
setProgress(0);
|
|
@@ -4166,53 +3830,238 @@ var ProgressPill = ({
|
|
|
4166
3830
|
hover:w-8
|
|
4167
3831
|
`;
|
|
4168
3832
|
}
|
|
4169
|
-
};
|
|
4170
|
-
const renderProgressBar = () => {
|
|
4171
|
-
if (style === "modern" && isActive || style === "cumulative" && shouldShowProgress) {
|
|
4172
|
-
const displayProgress = style === "cumulative" && isFilled ? 100 : progress;
|
|
4173
|
-
return /* @__PURE__ */
|
|
4174
|
-
"div",
|
|
4175
|
-
{
|
|
4176
|
-
className: `absolute top-0 left-0 h-full rounded-full ${style === "cumulative" && isFilled ? activeClassName || "bg-white" : activeClassName || "bg-white"} transition-all duration-50 ease-linear`,
|
|
4177
|
-
style: { width: `${displayProgress}%` }
|
|
4178
|
-
}
|
|
4179
|
-
);
|
|
3833
|
+
};
|
|
3834
|
+
const renderProgressBar = () => {
|
|
3835
|
+
if (style === "modern" && isActive || style === "cumulative" && shouldShowProgress) {
|
|
3836
|
+
const displayProgress = style === "cumulative" && isFilled ? 100 : progress;
|
|
3837
|
+
return /* @__PURE__ */ jsx62(
|
|
3838
|
+
"div",
|
|
3839
|
+
{
|
|
3840
|
+
className: `absolute top-0 left-0 h-full rounded-full ${style === "cumulative" && isFilled ? activeClassName || "bg-white" : activeClassName || "bg-white"} transition-all duration-50 ease-linear`,
|
|
3841
|
+
style: { width: `${displayProgress}%` }
|
|
3842
|
+
}
|
|
3843
|
+
);
|
|
3844
|
+
}
|
|
3845
|
+
return null;
|
|
3846
|
+
};
|
|
3847
|
+
const renderCumulativeFill = () => {
|
|
3848
|
+
if (style === "cumulative" && isFilled && !isActive) {
|
|
3849
|
+
return /* @__PURE__ */ jsx62(
|
|
3850
|
+
"div",
|
|
3851
|
+
{
|
|
3852
|
+
className: `absolute top-0 left-0 h-full rounded-full ${activeClassName || "bg-white"} transition-all duration-300`,
|
|
3853
|
+
style: { width: "100%" }
|
|
3854
|
+
}
|
|
3855
|
+
);
|
|
3856
|
+
}
|
|
3857
|
+
return null;
|
|
3858
|
+
};
|
|
3859
|
+
return /* @__PURE__ */ jsxs30(
|
|
3860
|
+
"button",
|
|
3861
|
+
{
|
|
3862
|
+
className: `${baseClasses} ${getStyleClasses()}`,
|
|
3863
|
+
onClick,
|
|
3864
|
+
"aria-label": `Go to slide ${index + 1}`,
|
|
3865
|
+
"aria-current": isActive ? "true" : "false",
|
|
3866
|
+
children: [
|
|
3867
|
+
renderProgressBar(),
|
|
3868
|
+
renderCumulativeFill()
|
|
3869
|
+
]
|
|
3870
|
+
}
|
|
3871
|
+
);
|
|
3872
|
+
};
|
|
3873
|
+
var Slider_default = Slider;
|
|
3874
|
+
|
|
3875
|
+
// src/components/utilities/AnimationUtility.tsx
|
|
3876
|
+
var AnimationUtility = class {
|
|
3877
|
+
static generateAnimationCSS(config, guid) {
|
|
3878
|
+
const {
|
|
3879
|
+
duration = 700,
|
|
3880
|
+
delay = 0,
|
|
3881
|
+
easing = "ease-out",
|
|
3882
|
+
distance = 30,
|
|
3883
|
+
scaleStart = 1,
|
|
3884
|
+
scaleEnd = 1.2,
|
|
3885
|
+
repeat = 1,
|
|
3886
|
+
intensity = 20,
|
|
3887
|
+
speedPerChar = 100,
|
|
3888
|
+
cursor = true,
|
|
3889
|
+
mode = "enter",
|
|
3890
|
+
direction = "left"
|
|
3891
|
+
// Default direction
|
|
3892
|
+
} = config;
|
|
3893
|
+
let base = "", visible = "", keyframes = "";
|
|
3894
|
+
switch (config.animation) {
|
|
3895
|
+
case "Fade":
|
|
3896
|
+
base = `opacity:0; transition:opacity ${duration}ms ${easing} ${delay}ms;`;
|
|
3897
|
+
visible = `opacity:1;`;
|
|
3898
|
+
break;
|
|
3899
|
+
case "FadeInUp":
|
|
3900
|
+
base = `opacity:0; transform:translateY(${distance}px); transition:all ${duration}ms ${easing} ${delay}ms;`;
|
|
3901
|
+
visible = `opacity:1; transform:translateY(0);`;
|
|
3902
|
+
break;
|
|
3903
|
+
case "Slide":
|
|
3904
|
+
const slideTransform = this.getSlideTransform(direction, distance);
|
|
3905
|
+
base = `opacity:0; transform:${slideTransform.start}; transition:all ${duration}ms ${easing} ${delay}ms; will-change: transform, opacity;`;
|
|
3906
|
+
visible = `opacity:1; transform:${slideTransform.end}; will-change: unset;`;
|
|
3907
|
+
break;
|
|
3908
|
+
case "ZoomIn":
|
|
3909
|
+
if (mode === "enter") {
|
|
3910
|
+
base = `opacity:0; transform:scale(${scaleStart}); transition:all ${duration}ms ${easing} ${delay}ms;`;
|
|
3911
|
+
visible = `opacity:1; transform:scale(${scaleEnd});`;
|
|
3912
|
+
} else {
|
|
3913
|
+
base = `transform:scale(${scaleStart}); transition:transform ${duration / 1e3}s ${easing} ${delay / 1e3}s;`;
|
|
3914
|
+
visible = `transform:scale(${scaleEnd});`;
|
|
3915
|
+
}
|
|
3916
|
+
break;
|
|
3917
|
+
case "Bounce":
|
|
3918
|
+
keyframes = `
|
|
3919
|
+
@keyframes bounce {
|
|
3920
|
+
0%,20%,50%,80%,100% { transform: translateY(0); }
|
|
3921
|
+
40% { transform: translateY(-${intensity}px); }
|
|
3922
|
+
60% { transform: translateY(-${intensity / 2}px); }
|
|
3923
|
+
}
|
|
3924
|
+
`;
|
|
3925
|
+
if (mode === "enter") {
|
|
3926
|
+
base = `opacity:0;`;
|
|
3927
|
+
visible = `opacity:1; animation:bounce ${duration}ms ${easing} ${delay}ms ${repeat};`;
|
|
3928
|
+
} else {
|
|
3929
|
+
base = ``;
|
|
3930
|
+
visible = `animation:bounce ${duration / 1e3}s ${easing} ${delay / 1e3}s ${repeat};`;
|
|
3931
|
+
}
|
|
3932
|
+
break;
|
|
3933
|
+
case "Typewriter":
|
|
3934
|
+
keyframes = `
|
|
3935
|
+
@keyframes typewriter { from { width: 0 } to { width: 100% } }
|
|
3936
|
+
@keyframes blink { 50% { border-color: transparent } }
|
|
3937
|
+
`;
|
|
3938
|
+
base = `
|
|
3939
|
+
overflow:hidden;
|
|
3940
|
+
border-right:${cursor ? "2px solid black" : "none"};
|
|
3941
|
+
white-space:nowrap;
|
|
3942
|
+
width:0;
|
|
3943
|
+
margin:0 auto;
|
|
3944
|
+
`;
|
|
3945
|
+
visible = `
|
|
3946
|
+
animation:typewriter ${speedPerChar * 30}ms steps(30,end) ${delay}ms forwards
|
|
3947
|
+
${cursor ? ", blink .75s step-end infinite" : ""};
|
|
3948
|
+
`;
|
|
3949
|
+
break;
|
|
3950
|
+
}
|
|
3951
|
+
if (mode === "hover") {
|
|
3952
|
+
return `
|
|
3953
|
+
${keyframes}
|
|
3954
|
+
${guid} { ${base} }
|
|
3955
|
+
${guid}:hover { ${visible} }
|
|
3956
|
+
`;
|
|
3957
|
+
} else {
|
|
3958
|
+
return `
|
|
3959
|
+
${keyframes}
|
|
3960
|
+
${guid} { ${base} }
|
|
3961
|
+
${guid}.visible { ${visible} }
|
|
3962
|
+
`;
|
|
3963
|
+
}
|
|
3964
|
+
}
|
|
3965
|
+
// Helper method to generate slide transforms based on direction
|
|
3966
|
+
static getSlideTransform(direction, distance) {
|
|
3967
|
+
switch (direction) {
|
|
3968
|
+
case "left":
|
|
3969
|
+
return { start: `translateX(${distance}px)`, end: `translateX(0)` };
|
|
3970
|
+
case "right":
|
|
3971
|
+
return { start: `translateX(-${distance}px)`, end: `translateX(0)` };
|
|
3972
|
+
case "up":
|
|
3973
|
+
return { start: `translateY(${distance}px)`, end: `translateY(0)` };
|
|
3974
|
+
case "down":
|
|
3975
|
+
return { start: `translateY(-${distance}px)`, end: `translateY(0)` };
|
|
3976
|
+
default:
|
|
3977
|
+
return { start: `translateX(${distance}px)`, end: `translateX(0)` };
|
|
3978
|
+
}
|
|
3979
|
+
}
|
|
3980
|
+
};
|
|
3981
|
+
var AnimationUtility_default = AnimationUtility;
|
|
3982
|
+
|
|
3983
|
+
// src/components/pageRenderingEngine/nodes/EnterAnimationClient.tsx
|
|
3984
|
+
import React47, { useEffect as useEffect11, useRef as useRef6 } from "react";
|
|
3985
|
+
import { Fragment as Fragment9, jsx as jsx63 } from "react/jsx-runtime";
|
|
3986
|
+
function EnterAnimationClient({ hasEnterAnimation, children }) {
|
|
3987
|
+
const ref = useRef6(null);
|
|
3988
|
+
useEffect11(() => {
|
|
3989
|
+
if (!hasEnterAnimation || !ref.current) return;
|
|
3990
|
+
const observer = new IntersectionObserver(
|
|
3991
|
+
(entries) => {
|
|
3992
|
+
entries.forEach((entry) => {
|
|
3993
|
+
if (entry.isIntersecting) {
|
|
3994
|
+
entry.target.classList.add("visible");
|
|
3995
|
+
observer.unobserve(entry.target);
|
|
3996
|
+
}
|
|
3997
|
+
});
|
|
3998
|
+
},
|
|
3999
|
+
{ threshold: 0.1 }
|
|
4000
|
+
);
|
|
4001
|
+
observer.observe(ref.current);
|
|
4002
|
+
return () => observer.disconnect();
|
|
4003
|
+
}, [hasEnterAnimation]);
|
|
4004
|
+
return /* @__PURE__ */ jsx63(Fragment9, { children: children && // enforce passing the ref to Wrapper
|
|
4005
|
+
//@ts-ignore
|
|
4006
|
+
React47.cloneElement(children, { ref }) });
|
|
4007
|
+
}
|
|
4008
|
+
|
|
4009
|
+
// src/components/utilities/PathUtility.tsx
|
|
4010
|
+
var PathUtility = class {
|
|
4011
|
+
constructor() {
|
|
4012
|
+
}
|
|
4013
|
+
normalizePath(path) {
|
|
4014
|
+
if (path == null) {
|
|
4015
|
+
return "/";
|
|
4016
|
+
}
|
|
4017
|
+
const trimmedPath = path.replace(/^\/|\/$/g, "");
|
|
4018
|
+
return trimmedPath === "" ? "/" : "/" + trimmedPath + "/";
|
|
4019
|
+
}
|
|
4020
|
+
joinAndNormalizePaths(path1, path2) {
|
|
4021
|
+
path1 = path1.replace(/\/$/, "");
|
|
4022
|
+
path2 = path2.replace(/^\//, "");
|
|
4023
|
+
const joinedPath = `${path1}/${path2}`;
|
|
4024
|
+
const normalizedPath = joinedPath.replace(/\/{2,}/g, "/");
|
|
4025
|
+
return normalizedPath === "" ? "/" : "/" + normalizedPath;
|
|
4026
|
+
}
|
|
4027
|
+
removeLeadingAndTrailingSlashes(path) {
|
|
4028
|
+
if (path == null) {
|
|
4029
|
+
return "/";
|
|
4180
4030
|
}
|
|
4181
|
-
|
|
4182
|
-
|
|
4183
|
-
|
|
4184
|
-
|
|
4185
|
-
|
|
4186
|
-
|
|
4187
|
-
{
|
|
4188
|
-
className: `absolute top-0 left-0 h-full rounded-full ${activeClassName || "bg-white"} transition-all duration-300`,
|
|
4189
|
-
style: { width: "100%" }
|
|
4190
|
-
}
|
|
4191
|
-
);
|
|
4031
|
+
const trimmedPath = path.replace(/^\/|\/$/g, "");
|
|
4032
|
+
return trimmedPath;
|
|
4033
|
+
}
|
|
4034
|
+
removeTrailingSlash(path) {
|
|
4035
|
+
if (path == null) {
|
|
4036
|
+
return "/";
|
|
4192
4037
|
}
|
|
4193
|
-
|
|
4194
|
-
|
|
4195
|
-
|
|
4196
|
-
|
|
4197
|
-
{
|
|
4198
|
-
|
|
4199
|
-
|
|
4200
|
-
|
|
4201
|
-
|
|
4202
|
-
|
|
4203
|
-
renderProgressBar(),
|
|
4204
|
-
renderCumulativeFill()
|
|
4205
|
-
]
|
|
4038
|
+
const trimmedPath = path.replace(/\/$/, "");
|
|
4039
|
+
return trimmedPath;
|
|
4040
|
+
}
|
|
4041
|
+
joinPaths(path1, path2) {
|
|
4042
|
+
if (!path1.endsWith("/") && !path2.startsWith("/")) {
|
|
4043
|
+
return `${path1}/${path2}`;
|
|
4044
|
+
} else if (path1.endsWith("/") && path2.startsWith("/")) {
|
|
4045
|
+
return `${path1}${path2.substr(1)}`;
|
|
4046
|
+
} else {
|
|
4047
|
+
return `${path1}${path2}`;
|
|
4206
4048
|
}
|
|
4207
|
-
|
|
4049
|
+
}
|
|
4050
|
+
getFirstSegment(path) {
|
|
4051
|
+
if (!path || path === "/") {
|
|
4052
|
+
return "";
|
|
4053
|
+
}
|
|
4054
|
+
const segments = path.split("/").filter(Boolean);
|
|
4055
|
+
return segments.length > 0 ? segments[0] : "";
|
|
4056
|
+
}
|
|
4208
4057
|
};
|
|
4209
|
-
var
|
|
4058
|
+
var PathUtility_default = new PathUtility();
|
|
4210
4059
|
|
|
4211
4060
|
// src/components/NoDataFound.tsx
|
|
4212
|
-
import { jsx as
|
|
4061
|
+
import { jsx as jsx64, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4213
4062
|
var NoDataFound = () => {
|
|
4214
|
-
return /* @__PURE__ */
|
|
4215
|
-
/* @__PURE__ */
|
|
4063
|
+
return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col items-center justify-center py-12 px-4 text-center bg-neutral-weak", children: [
|
|
4064
|
+
/* @__PURE__ */ jsx64("div", { className: "mb-5", children: /* @__PURE__ */ jsx64("div", { className: "mx-auto w-20 h-20 rounded-full flex items-center justify-center bg-neutral-soft", children: /* @__PURE__ */ jsx64(
|
|
4216
4065
|
"svg",
|
|
4217
4066
|
{
|
|
4218
4067
|
className: "w-10 h-10",
|
|
@@ -4220,7 +4069,7 @@ var NoDataFound = () => {
|
|
|
4220
4069
|
stroke: "currentColor",
|
|
4221
4070
|
viewBox: "0 0 24 24",
|
|
4222
4071
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4223
|
-
children: /* @__PURE__ */
|
|
4072
|
+
children: /* @__PURE__ */ jsx64(
|
|
4224
4073
|
"path",
|
|
4225
4074
|
{
|
|
4226
4075
|
strokeLinecap: "round",
|
|
@@ -4231,14 +4080,182 @@ var NoDataFound = () => {
|
|
|
4231
4080
|
)
|
|
4232
4081
|
}
|
|
4233
4082
|
) }) }),
|
|
4234
|
-
/* @__PURE__ */
|
|
4235
|
-
/* @__PURE__ */
|
|
4083
|
+
/* @__PURE__ */ jsx64("h3", { className: "text-lg font-medium mb-2", children: "No data available" }),
|
|
4084
|
+
/* @__PURE__ */ jsx64("p", { className: " max-w-sm mb-0", children: "No records found. Data may be empty or not available at the moment." })
|
|
4236
4085
|
] });
|
|
4237
4086
|
};
|
|
4238
4087
|
var NoDataFound_default = NoDataFound;
|
|
4239
4088
|
|
|
4089
|
+
// src/components/Pagination.tsx
|
|
4090
|
+
import { useMemo } from "react";
|
|
4091
|
+
import { jsx as jsx65, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
4092
|
+
var Pagination = (props) => {
|
|
4093
|
+
const { dataset, path, query, showPageSizeSelector = false, showJumpToPage = false } = props;
|
|
4094
|
+
const builder = useMemo(() => {
|
|
4095
|
+
const b = new OdataBuilder(path);
|
|
4096
|
+
if (query) b.setQuery(query);
|
|
4097
|
+
return b;
|
|
4098
|
+
}, [path, query]);
|
|
4099
|
+
const activePageNumber = builder.getPageNumber(Constants.pagesize);
|
|
4100
|
+
const totalItems = dataset?.count || 0;
|
|
4101
|
+
const itemsPerPage = parseInt(builder.top || Constants.pagesize.toString());
|
|
4102
|
+
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
|
4103
|
+
const startItem = totalItems > 0 ? (activePageNumber - 1) * itemsPerPage + 1 : 0;
|
|
4104
|
+
const endItem = Math.min(activePageNumber * itemsPerPage, totalItems);
|
|
4105
|
+
const getPaginationRange = () => {
|
|
4106
|
+
const delta = 1;
|
|
4107
|
+
const range = [];
|
|
4108
|
+
if (totalPages <= 7) {
|
|
4109
|
+
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
4110
|
+
}
|
|
4111
|
+
range.push(1);
|
|
4112
|
+
let start = Math.max(2, activePageNumber - delta);
|
|
4113
|
+
let end = Math.min(totalPages - 1, activePageNumber + delta);
|
|
4114
|
+
if (activePageNumber - delta <= 2) {
|
|
4115
|
+
end = Math.min(totalPages - 1, 4);
|
|
4116
|
+
}
|
|
4117
|
+
if (activePageNumber + delta >= totalPages - 1) {
|
|
4118
|
+
start = Math.max(2, totalPages - 4);
|
|
4119
|
+
}
|
|
4120
|
+
if (start > 2) {
|
|
4121
|
+
range.push("...");
|
|
4122
|
+
}
|
|
4123
|
+
for (let i = start; i <= end; i++) {
|
|
4124
|
+
range.push(i);
|
|
4125
|
+
}
|
|
4126
|
+
if (end < totalPages - 1) {
|
|
4127
|
+
range.push("...");
|
|
4128
|
+
}
|
|
4129
|
+
if (totalPages > 1) {
|
|
4130
|
+
range.push(totalPages);
|
|
4131
|
+
}
|
|
4132
|
+
return range;
|
|
4133
|
+
};
|
|
4134
|
+
const paginationRange = getPaginationRange();
|
|
4135
|
+
const PageButton = ({ page, children }) => /* @__PURE__ */ jsx65(
|
|
4136
|
+
Hyperlink,
|
|
4137
|
+
{
|
|
4138
|
+
linkType: "Link" /* Link */,
|
|
4139
|
+
className: `
|
|
4140
|
+
min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center px-2.5 md:px-3
|
|
4141
|
+
border text-sm font-medium transition-colors duration-150
|
|
4142
|
+
${activePageNumber === page ? "bg-primary-base font-semibold" : ""}
|
|
4143
|
+
`,
|
|
4144
|
+
href: builder.getNewPageUrl(page),
|
|
4145
|
+
children
|
|
4146
|
+
}
|
|
4147
|
+
);
|
|
4148
|
+
const NavigationButton = ({ page, disabled, children }) => {
|
|
4149
|
+
if (disabled) {
|
|
4150
|
+
return /* @__PURE__ */ jsx65("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 });
|
|
4151
|
+
}
|
|
4152
|
+
return /* @__PURE__ */ jsx65(
|
|
4153
|
+
Hyperlink,
|
|
4154
|
+
{
|
|
4155
|
+
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",
|
|
4156
|
+
href: builder.getNewPageUrl(page),
|
|
4157
|
+
children
|
|
4158
|
+
}
|
|
4159
|
+
);
|
|
4160
|
+
};
|
|
4161
|
+
if (totalPages <= 1 && totalItems === 0) return null;
|
|
4162
|
+
return /* @__PURE__ */ jsxs32("div", { className: "py-6 border-t bg-default", children: [
|
|
4163
|
+
/* @__PURE__ */ jsxs32("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4", children: [
|
|
4164
|
+
/* @__PURE__ */ jsxs32("div", { className: "text-sm", children: [
|
|
4165
|
+
"Showing ",
|
|
4166
|
+
/* @__PURE__ */ jsxs32("span", { className: "font-semibold", children: [
|
|
4167
|
+
startItem,
|
|
4168
|
+
"-",
|
|
4169
|
+
endItem
|
|
4170
|
+
] }),
|
|
4171
|
+
" ",
|
|
4172
|
+
"out of ",
|
|
4173
|
+
/* @__PURE__ */ jsx65("span", { className: "font-semibold", children: totalItems.toLocaleString() }),
|
|
4174
|
+
" results"
|
|
4175
|
+
] }),
|
|
4176
|
+
totalPages > 1 && /* @__PURE__ */ jsxs32("div", { className: "flex items-center space-x-1", children: [
|
|
4177
|
+
/* @__PURE__ */ jsxs32(
|
|
4178
|
+
NavigationButton,
|
|
4179
|
+
{
|
|
4180
|
+
page: activePageNumber - 1,
|
|
4181
|
+
disabled: activePageNumber === 1,
|
|
4182
|
+
children: [
|
|
4183
|
+
/* @__PURE__ */ jsx65("span", { children: /* @__PURE__ */ jsx65(Icon_default, { name: "chevronLeft", className: "w-4 h-4 mr-1" }) }),
|
|
4184
|
+
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Prev" })
|
|
4185
|
+
]
|
|
4186
|
+
}
|
|
4187
|
+
),
|
|
4188
|
+
paginationRange.map((item, index) => {
|
|
4189
|
+
if (item === "...") {
|
|
4190
|
+
return /* @__PURE__ */ jsx65(
|
|
4191
|
+
"span",
|
|
4192
|
+
{
|
|
4193
|
+
className: "min-w-[20px] md:min-w-[40px] h-10 flex items-center justify-center text-gray-500",
|
|
4194
|
+
children: "..."
|
|
4195
|
+
},
|
|
4196
|
+
`ellipsis-${index}`
|
|
4197
|
+
);
|
|
4198
|
+
}
|
|
4199
|
+
const page = item;
|
|
4200
|
+
return /* @__PURE__ */ jsx65(PageButton, { page, children: page }, page);
|
|
4201
|
+
}),
|
|
4202
|
+
/* @__PURE__ */ jsxs32(
|
|
4203
|
+
NavigationButton,
|
|
4204
|
+
{
|
|
4205
|
+
page: activePageNumber + 1,
|
|
4206
|
+
disabled: activePageNumber === totalPages,
|
|
4207
|
+
children: [
|
|
4208
|
+
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Next" }),
|
|
4209
|
+
/* @__PURE__ */ jsx65("span", { children: /* @__PURE__ */ jsx65(Icon_default, { name: "chevronRight", className: "w-4 h-4 ml-1" }) })
|
|
4210
|
+
]
|
|
4211
|
+
}
|
|
4212
|
+
)
|
|
4213
|
+
] }),
|
|
4214
|
+
showJumpToPage && totalPages > 5 && /* @__PURE__ */ jsxs32("div", { className: "flex items-center space-x-2", children: [
|
|
4215
|
+
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Go to:" }),
|
|
4216
|
+
/* @__PURE__ */ jsx65("div", { className: "relative", children: /* @__PURE__ */ jsx65(
|
|
4217
|
+
"input",
|
|
4218
|
+
{
|
|
4219
|
+
type: "number",
|
|
4220
|
+
min: "1",
|
|
4221
|
+
max: totalPages,
|
|
4222
|
+
defaultValue: activePageNumber,
|
|
4223
|
+
className: "w-20 h-10 px-3 border rounded text-sm focus:outline-none focus:ring-2 focus:border-transparent",
|
|
4224
|
+
onKeyDown: (e) => {
|
|
4225
|
+
if (e.key === "Enter") {
|
|
4226
|
+
const input = e.target;
|
|
4227
|
+
const page = parseInt(input.value);
|
|
4228
|
+
if (page >= 1 && page <= totalPages && page !== activePageNumber) {
|
|
4229
|
+
window.location.href = builder.getNewPageUrl(page);
|
|
4230
|
+
}
|
|
4231
|
+
}
|
|
4232
|
+
}
|
|
4233
|
+
}
|
|
4234
|
+
) })
|
|
4235
|
+
] })
|
|
4236
|
+
] }),
|
|
4237
|
+
showPageSizeSelector && /* @__PURE__ */ jsx65("div", { className: "mt-4 pt-4 border-t bg-default", children: /* @__PURE__ */ jsxs32("div", { className: "flex items-center justify-center space-x-2", children: [
|
|
4238
|
+
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "Show:" }),
|
|
4239
|
+
/* @__PURE__ */ jsx65("div", { className: "flex space-x-1", children: [10, 25, 50, 100].map((size) => /* @__PURE__ */ jsx65(
|
|
4240
|
+
Hyperlink,
|
|
4241
|
+
{
|
|
4242
|
+
className: `
|
|
4243
|
+
px-3 py-1 text-sm rounded border transition-colors duration-150
|
|
4244
|
+
${itemsPerPage === size ? "bg-primary-base font-medium" : "bg-neutral-weak"}
|
|
4245
|
+
`,
|
|
4246
|
+
href: builder.getNewPageSizeUrl(size),
|
|
4247
|
+
children: size
|
|
4248
|
+
},
|
|
4249
|
+
size
|
|
4250
|
+
)) }),
|
|
4251
|
+
/* @__PURE__ */ jsx65("span", { className: "text-sm", children: "per page" })
|
|
4252
|
+
] }) })
|
|
4253
|
+
] });
|
|
4254
|
+
};
|
|
4255
|
+
var Pagination_default = Pagination;
|
|
4256
|
+
|
|
4240
4257
|
// src/components/pageRenderingEngine/nodes/DivContainer.tsx
|
|
4241
|
-
import { jsx as
|
|
4258
|
+
import { jsx as jsx66, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
4242
4259
|
function toCamelCase(str) {
|
|
4243
4260
|
return str.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
|
|
4244
4261
|
}
|
|
@@ -4255,18 +4272,23 @@ function convertKeysToCamelCase(obj) {
|
|
|
4255
4272
|
var getNestedValue = (obj, path) => {
|
|
4256
4273
|
if (!obj || !path) return void 0;
|
|
4257
4274
|
return path.split(".").reduce((current, key) => {
|
|
4275
|
+
{
|
|
4276
|
+
}
|
|
4258
4277
|
return current && current[key] !== void 0 ? current[key] : void 0;
|
|
4259
4278
|
}, obj);
|
|
4260
4279
|
};
|
|
4280
|
+
{
|
|
4281
|
+
}
|
|
4261
4282
|
function generateCompleteBackgroundString(layers, apiBaseUrl) {
|
|
4262
4283
|
if (!layers || !Array.isArray(layers)) return "";
|
|
4263
4284
|
return layers.filter((layer) => layer && layer.type && layer.value).map((layer) => {
|
|
4264
4285
|
if (layer.type === "image" && typeof layer.value === "object") {
|
|
4265
4286
|
const imageValue = layer.value;
|
|
4266
4287
|
if (!imageValue.assetUrl) return "";
|
|
4267
|
-
const
|
|
4268
|
-
|
|
4269
|
-
|
|
4288
|
+
const url = `url('${AssetUtility_default.resolveUrl(
|
|
4289
|
+
apiBaseUrl,
|
|
4290
|
+
imageValue.assetUrl
|
|
4291
|
+
)}')`;
|
|
4270
4292
|
const repeat = layer.repeat || "no-repeat";
|
|
4271
4293
|
const position = layer.position || "center";
|
|
4272
4294
|
const size = layer.size || "auto";
|
|
@@ -4285,12 +4307,16 @@ function generateCompleteBackgroundString(layers, apiBaseUrl) {
|
|
|
4285
4307
|
}).filter((bg) => bg.trim() !== "").join(", ");
|
|
4286
4308
|
}
|
|
4287
4309
|
var generateCssString = (guid, stylesObject, mobileStylesObject) => {
|
|
4288
|
-
|
|
4289
|
-
|
|
4290
|
-
|
|
4291
|
-
|
|
4292
|
-
|
|
4293
|
-
|
|
4310
|
+
{
|
|
4311
|
+
}
|
|
4312
|
+
const gridColumns = stylesObject.gridTemplateColumns ? stylesObject.gridTemplateColumns.match(/\d+/g) : [];
|
|
4313
|
+
const hasGridProperties = gridColumns.length > 0;
|
|
4314
|
+
const largeCols = hasGridProperties ? parseInt(gridColumns[0]) : 4;
|
|
4315
|
+
const tabletColumns = hasGridProperties ? Math.ceil(parseInt(gridColumns[0]) / 2) : 2;
|
|
4316
|
+
const mobileColumns = 1;
|
|
4317
|
+
{
|
|
4318
|
+
}
|
|
4319
|
+
const cssRules = Object.entries(stylesObject).filter(([_, value]) => value !== void 0 && value !== "").map(([key, value]) => {
|
|
4294
4320
|
const cssKey = key.replace(/([A-Z])/g, "-$1").toLowerCase();
|
|
4295
4321
|
return `${cssKey}: ${value};`;
|
|
4296
4322
|
});
|
|
@@ -4300,7 +4326,7 @@ ${cssRules.join(
|
|
|
4300
4326
|
)}
|
|
4301
4327
|
transition: all 0.3s ease-in-out; }`;
|
|
4302
4328
|
if (mobileStylesObject) {
|
|
4303
|
-
|
|
4329
|
+
const mobileCssRules = Object.entries(mobileStylesObject).filter(([_, value]) => value !== void 0 && value !== "").map(([key, value]) => {
|
|
4304
4330
|
const cssKey = key.replace(/([A-Z])/g, "-$1").toLowerCase();
|
|
4305
4331
|
return `${cssKey}: ${value};`;
|
|
4306
4332
|
});
|
|
@@ -4338,7 +4364,6 @@ var DivContainer = async (props) => {
|
|
|
4338
4364
|
code: CodeNode_default,
|
|
4339
4365
|
image: ImageNode_default,
|
|
4340
4366
|
horizontalrule: HorizontalRuleNode_default,
|
|
4341
|
-
"layout-container": LayoutContainerNode_default,
|
|
4342
4367
|
widget: WidgetNode_default,
|
|
4343
4368
|
embed: EmbedNode_default,
|
|
4344
4369
|
"div-container": DivContainer,
|
|
@@ -4350,17 +4375,15 @@ var DivContainer = async (props) => {
|
|
|
4350
4375
|
const mobileStyles = props.node.mobileCssProperties;
|
|
4351
4376
|
const dataBindingProperties = props.node.dataBinding;
|
|
4352
4377
|
const updatedStyles = convertKeysToCamelCase(styles);
|
|
4353
|
-
|
|
4354
|
-
props.node.backgroundLayers,
|
|
4355
|
-
// props.resolveAssetUrl,
|
|
4356
|
-
props.apiBaseUrl
|
|
4357
|
-
);
|
|
4378
|
+
const background = generateCompleteBackgroundString(props.node.backgroundLayers, props.apiBaseUrl);
|
|
4358
4379
|
let containerPaddingClass = "";
|
|
4359
4380
|
if (props.node.containerPadding == "small") {
|
|
4360
4381
|
containerPaddingClass = "container-small";
|
|
4361
4382
|
} else if (props.node.containerPadding == "large") {
|
|
4362
4383
|
containerPaddingClass = "container-large";
|
|
4363
4384
|
}
|
|
4385
|
+
{
|
|
4386
|
+
}
|
|
4364
4387
|
const updatedStyle = { ...updatedStyles };
|
|
4365
4388
|
const backgroundStyle = background && background !== "" ? { background } : {};
|
|
4366
4389
|
const combinedStyles = {
|
|
@@ -4391,13 +4414,30 @@ var DivContainer = async (props) => {
|
|
|
4391
4414
|
return fieldValue !== void 0 && fieldValue === false;
|
|
4392
4415
|
};
|
|
4393
4416
|
const isHidden = shouldHideContainer();
|
|
4394
|
-
|
|
4395
|
-
let
|
|
4396
|
-
let
|
|
4417
|
+
let odataString = void 0;
|
|
4418
|
+
let endpoint = void 0;
|
|
4419
|
+
let result = null;
|
|
4420
|
+
let response = null;
|
|
4397
4421
|
let childCollectionData = null;
|
|
4398
4422
|
if (dataBindingProperties) {
|
|
4399
|
-
|
|
4400
|
-
|
|
4423
|
+
const serviceClient = new ServiceClient_default(props.apiBaseUrl, props.session);
|
|
4424
|
+
endpoint = dataBindingProperties.dataSource;
|
|
4425
|
+
{
|
|
4426
|
+
}
|
|
4427
|
+
endpoint = endpoint.replace(/\{(\w+)\}/g, (_, key) => {
|
|
4428
|
+
return props.routeParameters?.[key] ?? `{${key}}`;
|
|
4429
|
+
});
|
|
4430
|
+
if (dataBindingProperties.applyODataParams) {
|
|
4431
|
+
odataString = OdataBuilder.getOdataQueryString(props.query);
|
|
4432
|
+
if (odataString) {
|
|
4433
|
+
const separator = endpoint.includes("?") ? "&" : "?";
|
|
4434
|
+
endpoint += separator + odataString;
|
|
4435
|
+
}
|
|
4436
|
+
}
|
|
4437
|
+
response = await serviceClient.get(endpoint);
|
|
4438
|
+
result = response?.result;
|
|
4439
|
+
if (dataBindingProperties.showNoResultsMessage && (result === void 0 || result.length == 0)) {
|
|
4440
|
+
return /* @__PURE__ */ jsx66(NoDataFound_default, {});
|
|
4401
4441
|
}
|
|
4402
4442
|
if (dataBindingProperties.childCollectionName && props.dataitem) {
|
|
4403
4443
|
childCollectionData = getNestedValue(props.dataitem, dataBindingProperties.childCollectionName);
|
|
@@ -4405,9 +4445,11 @@ var DivContainer = async (props) => {
|
|
|
4405
4445
|
}
|
|
4406
4446
|
const cssResult = generateCssString(guid, updatedStyle, mobileStyles);
|
|
4407
4447
|
function renderNode(node, props2, dataitem, key, href) {
|
|
4448
|
+
{
|
|
4449
|
+
}
|
|
4408
4450
|
const SelectedNode = NodeTypes2[node.type];
|
|
4409
4451
|
if (!SelectedNode) return null;
|
|
4410
|
-
return /* @__PURE__ */
|
|
4452
|
+
return /* @__PURE__ */ jsx66(React49.Fragment, { children: /* @__PURE__ */ jsx66(
|
|
4411
4453
|
SelectedNode,
|
|
4412
4454
|
{
|
|
4413
4455
|
node,
|
|
@@ -4418,11 +4460,9 @@ var DivContainer = async (props) => {
|
|
|
4418
4460
|
host: props2.host,
|
|
4419
4461
|
path: props2.path,
|
|
4420
4462
|
apiBaseUrl: props2.apiBaseUrl,
|
|
4421
|
-
assetBaseUrl: props2.assetBaseUrl,
|
|
4422
4463
|
breadcrumb: props2.breadcrumb,
|
|
4423
4464
|
dataitem,
|
|
4424
|
-
href
|
|
4425
|
-
dataMap: props2.dataMap
|
|
4465
|
+
href
|
|
4426
4466
|
}
|
|
4427
4467
|
) }, key);
|
|
4428
4468
|
}
|
|
@@ -4460,6 +4500,8 @@ var DivContainer = async (props) => {
|
|
|
4460
4500
|
return [props.dataitem];
|
|
4461
4501
|
})();
|
|
4462
4502
|
const renderLink = result && props.node.dataBinding?.responseType === "array" ? true : false;
|
|
4503
|
+
{
|
|
4504
|
+
}
|
|
4463
4505
|
let Wrapper;
|
|
4464
4506
|
let wrapperProps;
|
|
4465
4507
|
switch (true) {
|
|
@@ -4488,6 +4530,8 @@ var DivContainer = async (props) => {
|
|
|
4488
4530
|
const replacementTag = props.node.replaceDivTagWith;
|
|
4489
4531
|
const allowedTags = ["div", "section", "article", "details", "summary"];
|
|
4490
4532
|
if (replacementTag && allowedTags.includes(replacementTag)) {
|
|
4533
|
+
{
|
|
4534
|
+
}
|
|
4491
4535
|
Wrapper = replacementTag;
|
|
4492
4536
|
} else {
|
|
4493
4537
|
Wrapper = "div";
|
|
@@ -4504,9 +4548,9 @@ var DivContainer = async (props) => {
|
|
|
4504
4548
|
props.node.autoFormat && "auto-format",
|
|
4505
4549
|
props.node.bgClass
|
|
4506
4550
|
].filter(Boolean).join(" ");
|
|
4507
|
-
return /* @__PURE__ */
|
|
4508
|
-
/* @__PURE__ */
|
|
4509
|
-
/* @__PURE__ */
|
|
4551
|
+
return /* @__PURE__ */ jsxs33(React49.Fragment, { children: [
|
|
4552
|
+
/* @__PURE__ */ jsx66("style", { dangerouslySetInnerHTML: { __html: cssResult.css + animationCSS } }),
|
|
4553
|
+
/* @__PURE__ */ jsx66(EnterAnimationClient, { hasEnterAnimation: !!props.node.enterAnimation, children: /* @__PURE__ */ jsx66(React49.Fragment, { children: /* @__PURE__ */ jsx66(
|
|
4510
4554
|
Wrapper,
|
|
4511
4555
|
{
|
|
4512
4556
|
id: guid,
|
|
@@ -4515,18 +4559,18 @@ var DivContainer = async (props) => {
|
|
|
4515
4559
|
...wrapperProps,
|
|
4516
4560
|
children: dataToRender.map(
|
|
4517
4561
|
(item, idx) => item?.links?.view && renderLink ? renderChildren(props.node.children, props, item, idx, props.href ? void 0 : item?.links?.view)?.map(
|
|
4518
|
-
(child, i) => /* @__PURE__ */
|
|
4562
|
+
(child, i) => /* @__PURE__ */ jsx66(React49.Fragment, { children: child }, i)
|
|
4519
4563
|
) : renderChildren(props.node.children, props, item, idx)
|
|
4520
4564
|
)
|
|
4521
4565
|
}
|
|
4522
4566
|
) }) }),
|
|
4523
|
-
dataBindingProperties && props.node.dataBinding.enablePagination && /* @__PURE__ */
|
|
4567
|
+
dataBindingProperties && props.node.dataBinding.enablePagination && /* @__PURE__ */ jsx66("div", { children: /* @__PURE__ */ jsx66(Pagination_default, { path: props.path, query: props.query, dataset: response }) })
|
|
4524
4568
|
] });
|
|
4525
4569
|
};
|
|
4526
4570
|
var DivContainer_default = DivContainer;
|
|
4527
4571
|
|
|
4528
4572
|
// src/components/pageRenderingEngine/PageBodyRenderer.tsx
|
|
4529
|
-
import { jsx as
|
|
4573
|
+
import { jsx as jsx67 } from "react/jsx-runtime";
|
|
4530
4574
|
var NodeTypes = {
|
|
4531
4575
|
["paragraph"]: ParagraphNode_default,
|
|
4532
4576
|
["heading"]: HeadingNode_default,
|
|
@@ -4535,7 +4579,6 @@ var NodeTypes = {
|
|
|
4535
4579
|
["code"]: CodeNode_default,
|
|
4536
4580
|
["image"]: ImageNode_default,
|
|
4537
4581
|
["horizontalrule"]: HorizontalRuleNode_default,
|
|
4538
|
-
["layout-container"]: LayoutContainerNode_default,
|
|
4539
4582
|
["widget"]: WidgetNode_default,
|
|
4540
4583
|
["form-container"]: FormContainerNode_default,
|
|
4541
4584
|
["div-container"]: DivContainer_default,
|
|
@@ -4554,11 +4597,11 @@ var PageBodyRenderer = (props) => {
|
|
|
4554
4597
|
if (pageBodyTree && pageBodyTree.root) {
|
|
4555
4598
|
rootNode = pageBodyTree.root;
|
|
4556
4599
|
}
|
|
4557
|
-
return /* @__PURE__ */
|
|
4600
|
+
return /* @__PURE__ */ jsx67(React50.Fragment, { children: rootNode && rootNode?.children?.map((node, index) => {
|
|
4558
4601
|
{
|
|
4559
4602
|
}
|
|
4560
4603
|
const SelectedNode = NodeTypes[node.type];
|
|
4561
|
-
return /* @__PURE__ */
|
|
4604
|
+
return /* @__PURE__ */ jsx67(React50.Fragment, { children: SelectedNode && /* @__PURE__ */ jsx67(React50.Fragment, { children: node.type == "layout-container" ? /* @__PURE__ */ jsx67(React50.Fragment, { children: /* @__PURE__ */ jsx67(
|
|
4562
4605
|
SelectedNode,
|
|
4563
4606
|
{
|
|
4564
4607
|
node,
|
|
@@ -4569,12 +4612,10 @@ var PageBodyRenderer = (props) => {
|
|
|
4569
4612
|
host: props.host,
|
|
4570
4613
|
path: props.path,
|
|
4571
4614
|
apiBaseUrl: props.apiBaseUrl,
|
|
4572
|
-
widgetRegistry: props.widgetRegistry,
|
|
4573
4615
|
serviceClient: props.serviceClient,
|
|
4574
|
-
assetBaseUrl: props.assetBaseUrl
|
|
4575
|
-
dataMap: props.dataMap
|
|
4616
|
+
assetBaseUrl: props.assetBaseUrl
|
|
4576
4617
|
}
|
|
4577
|
-
) }) : /* @__PURE__ */
|
|
4618
|
+
) }) : /* @__PURE__ */ jsx67(React50.Fragment, { children: /* @__PURE__ */ jsx67(
|
|
4578
4619
|
SelectedNode,
|
|
4579
4620
|
{
|
|
4580
4621
|
node,
|
|
@@ -4584,10 +4625,8 @@ var PageBodyRenderer = (props) => {
|
|
|
4584
4625
|
host: props.host,
|
|
4585
4626
|
path: props.path,
|
|
4586
4627
|
apiBaseUrl: props.apiBaseUrl,
|
|
4587
|
-
widgetRegistry: props.widgetRegistry,
|
|
4588
4628
|
serviceClient: props.serviceClient,
|
|
4589
|
-
assetBaseUrl: props.assetBaseUrl
|
|
4590
|
-
dataMap: props.dataMap
|
|
4629
|
+
assetBaseUrl: props.assetBaseUrl
|
|
4591
4630
|
}
|
|
4592
4631
|
) }) }) }, index);
|
|
4593
4632
|
}) });
|