@wavemaker-ai/react-runtime 1.0.0-rc.647712 → 12.0.0-rc.335

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.
Files changed (106) hide show
  1. package/components/basic/richtexteditor/index.d.ts +1 -0
  2. package/components/basic/search/index.js +5 -4
  3. package/components/basic/search/utils.d.ts +1 -0
  4. package/components/basic/search/utils.js +9 -0
  5. package/components/common/index.d.ts +2 -0
  6. package/components/common/index.js +2 -0
  7. package/components/common/partial-content-wrapper.d.ts +15 -0
  8. package/components/common/partial-content-wrapper.js +11 -0
  9. package/components/container/index.js +5 -2
  10. package/components/container/tabs/index.js +5 -3
  11. package/components/container/wizard/index.js +36 -3
  12. package/components/container/wizard/props.d.ts +2 -2
  13. package/components/data/form/dynamic-fields/WmxDynamicFormField.js +9 -23
  14. package/components/data/form/form-controller/props.d.ts +2 -0
  15. package/components/data/form/form-controller/utils.js +3 -2
  16. package/components/data/form/form-controller/validation-contrustor.js +112 -1
  17. package/components/data/form/form-controller/withFormController.js +1 -1
  18. package/components/data/form/form-field/index.js +6 -3
  19. package/components/data/form/form-field/props.d.ts +1 -0
  20. package/components/data/list/components/ListItemWithTemplate.js +1 -1
  21. package/components/data/list/index.js +1 -1
  22. package/components/data/table/components/EditableCell.js +47 -24
  23. package/components/data/table/components/FieldValidationError.js +1 -1
  24. package/components/data/table/components/TableHeader.js +9 -3
  25. package/components/data/table/hooks/useFormWidget.js +11 -0
  26. package/components/data/table/hooks/useRowSelection.js +58 -1
  27. package/components/data/table/hooks/useTableEdit.d.ts +1 -1
  28. package/components/data/table/hooks/useTableEdit.js +115 -75
  29. package/components/data/table/hooks/useTableEditForms.d.ts +25 -0
  30. package/components/data/table/hooks/useTableEditForms.js +30 -0
  31. package/components/data/table/index.js +68 -32
  32. package/components/data/table/props.d.ts +42 -23
  33. package/components/data/table/utils/buildSelectionColumns.js +3 -3
  34. package/components/data/table/utils/columnProxy.d.ts +7 -1
  35. package/components/data/table/utils/columnProxy.js +21 -1
  36. package/components/data/table/utils/columnValidation.d.ts +19 -0
  37. package/components/data/table/utils/columnValidation.js +76 -0
  38. package/components/data/table/utils/constants.d.ts +2 -0
  39. package/components/data/table/utils/constants.js +2 -0
  40. package/components/data/table/utils/index.d.ts +4 -12
  41. package/components/data/table/utils/index.js +13 -77
  42. package/components/data/table/utils/selectionUtils.js +13 -5
  43. package/components/input/chips/index.d.ts +1 -0
  44. package/components/input/color-picker/index.d.ts +1 -0
  45. package/components/input/currency/index.d.ts +1 -0
  46. package/components/input/default/checkbox/index.d.ts +1 -0
  47. package/components/input/default/checkboxset/index.d.ts +1 -0
  48. package/components/input/default/radioset/index.d.ts +1 -0
  49. package/components/input/default/switch/index.d.ts +1 -0
  50. package/components/input/epoch/datetime/index.js +10 -2
  51. package/components/input/number/index.d.ts +1 -0
  52. package/components/input/rating/index.d.ts +1 -0
  53. package/components/input/select/index.d.ts +1 -0
  54. package/components/input/slider/index.d.ts +1 -0
  55. package/components/input/text/index.d.ts +1 -0
  56. package/components/input/textarea/index.d.ts +1 -0
  57. package/components/input/upload/index.d.ts +1 -0
  58. package/components/layout/footer/index.js +4 -2
  59. package/components/layout/footer/props.d.ts +1 -0
  60. package/components/layout/header/index.js +29 -3
  61. package/components/layout/header/props.d.ts +1 -0
  62. package/components/layout/leftnav/index.js +22 -6
  63. package/components/layout/leftnav/props.d.ts +1 -0
  64. package/components/layout/leftnav/utils/page-class-util.d.ts +1 -0
  65. package/components/layout/leftnav/utils/page-class-util.js +4 -3
  66. package/components/layout/rightnav/index.js +4 -2
  67. package/components/layout/rightnav/props.d.ts +1 -0
  68. package/components/layout/topnav/index.js +4 -2
  69. package/components/layout/topnav/props.d.ts +1 -0
  70. package/components/navbar/index.js +32 -7
  71. package/components/navigation/menu/index.js +6 -2
  72. package/components/page/index.js +60 -19
  73. package/components/page/page-context.d.ts +4 -0
  74. package/core/proxy-service.js +86 -19
  75. package/higherOrder/BaseApp.js +1 -1
  76. package/higherOrder/BasePage.js +2 -1
  77. package/higherOrder/withBaseWrapper.js +10 -2
  78. package/hooks/useHttp.d.ts +14 -4
  79. package/hooks/useHttp.js +47 -9
  80. package/package-lock.json +314 -308
  81. package/package.json +3 -3
  82. package/runtime-dynamic/App.js +21 -2
  83. package/runtime-dynamic/app-initializer.js +8 -1
  84. package/runtime-dynamic/factories/dynamic-component.js +4 -3
  85. package/runtime-dynamic/main.d.ts +1 -0
  86. package/runtime-dynamic/main.js +9 -1
  87. package/runtime-dynamic/services/compile-render.js +7 -0
  88. package/runtime-dynamic/services/css-scoping.d.ts +1 -1
  89. package/runtime-dynamic/services/css-scoping.js +2 -2
  90. package/runtime-dynamic/services/variable-factory.js +2 -1
  91. package/runtime-dynamic/services/variable-transpiler.js +4 -1
  92. package/runtime-dynamic/wmx-shared.d.ts +40 -0
  93. package/runtime-dynamic/wmx-shared.js +33 -0
  94. package/utils/style-utils.js +1 -1
  95. package/utils/wmx.utils.d.ts +0 -1
  96. package/utils/wmx.utils.js +0 -25
  97. package/variables/crud-variable.d.ts +10 -0
  98. package/variables/crud-variable.js +53 -2
  99. package/variables/live-variable.d.ts +1 -0
  100. package/variables/live-variable.js +2 -1
  101. package/variables/operation-params.d.ts +29 -0
  102. package/variables/operation-params.js +69 -0
  103. package/variables/service-variable.d.ts +9 -0
  104. package/variables/service-variable.js +21 -2
  105. package/components/data/table/utils/validation.d.ts +0 -13
  106. package/components/data/table/utils/validation.js +0 -82
@@ -31,7 +31,7 @@ var __objRest = (source, exclude) => {
31
31
  return target;
32
32
  };
33
33
  import { jsx, jsxs } from "react/jsx-runtime";
34
- import { memo, useMemo, useState } from "react";
34
+ import { memo, useEffect, useMemo, useRef, useState } from "react";
35
35
  import clsx from "clsx";
36
36
  import Box from "@mui/material/Box";
37
37
  import Link from "@mui/material/Link";
@@ -66,7 +66,10 @@ const WmNavbar = memo(
66
66
  "menuiconurl",
67
67
  "listener"
68
68
  ]);
69
+ const collapseRef = useRef(null);
70
+ const timersRef = useRef([]);
69
71
  const [isCollapsed, setIsCollapsed] = useState(true);
72
+ useEffect(() => () => timersRef.current.forEach(clearTimeout), []);
70
73
  const processedStyles = useMemo(() => {
71
74
  if (!styles) return styles;
72
75
  if (styles == null ? void 0 : styles.backgroundImage) {
@@ -74,8 +77,32 @@ const WmNavbar = memo(
74
77
  }
75
78
  return __spreadValues({}, styles);
76
79
  }, [styles]);
77
- const handleToggle = () => {
78
- setIsCollapsed(!isCollapsed);
80
+ const handleToggle = (event) => {
81
+ var _a2, _b;
82
+ event.stopPropagation();
83
+ const el = collapseRef.current;
84
+ if (!el) return;
85
+ const open = isCollapsed;
86
+ (_a2 = el.getAnimations) == null ? void 0 : _a2.call(el).forEach((a) => a.cancel());
87
+ el.style.overflow = "hidden";
88
+ el.style.display = "block";
89
+ const h = `${el.scrollHeight}px`;
90
+ el.style.height = open ? "0" : h;
91
+ timersRef.current.forEach(clearTimeout);
92
+ const finalize = () => {
93
+ animation == null ? void 0 : animation.cancel();
94
+ Object.assign(el.style, { display: open ? "block" : "none", height: "", overflow: "" });
95
+ };
96
+ const animation = (_b = el.animate) == null ? void 0 : _b.call(el, [{ height: open ? "0" : h }, { height: open ? h : "0" }], {
97
+ duration: 400,
98
+ fill: "forwards"
99
+ });
100
+ if (animation) {
101
+ animation.onfinish = finalize;
102
+ } else {
103
+ timersRef.current[0] = setTimeout(finalize, 400);
104
+ }
105
+ open ? setIsCollapsed(false) : timersRef.current[1] = setTimeout(() => setIsCollapsed(true), 500);
79
106
  };
80
107
  return /* @__PURE__ */ jsx(
81
108
  Box,
@@ -114,11 +141,9 @@ const WmNavbar = memo(
114
141
  /* @__PURE__ */ jsx(
115
142
  Box,
116
143
  {
144
+ ref: collapseRef,
117
145
  component: "div",
118
- className: clsx("navbar-collapse", {
119
- collapse: isCollapsed,
120
- in: !isCollapsed
121
- }),
146
+ className: clsx("navbar-collapse collapse", { in: !isCollapsed }),
122
147
  children
123
148
  }
124
149
  )
@@ -744,10 +744,13 @@ const WmMenu = memo((props) => {
744
744
  ]
745
745
  );
746
746
  useEffect(() => {
747
+ if (props.hidden) {
748
+ setOpen(false);
749
+ }
747
750
  if (!open) return;
748
751
  setActiveItem(null);
749
752
  setFocusedIndex(-1);
750
- }, [open]);
753
+ }, [open, props.hidden]);
751
754
  useEffect(() => {
752
755
  if (autoopen === AUTO_OPEN.ALWAYS) {
753
756
  setOpen(true);
@@ -994,7 +997,8 @@ const WmMenu = memo((props) => {
994
997
  onKeyDown: handleKeyDown,
995
998
  role: "menu",
996
999
  "aria-label": arialabel || "Menu",
997
- "aria-expanded": open
1000
+ "aria-expanded": open,
1001
+ hidden: props.hidden
998
1002
  }), { type, name }), {
999
1003
  children: [
1000
1004
  /* @__PURE__ */ jsx(Tooltip, { title: hint || "", enterDelay: TOOLTIP_ENTER_DELAY, disableHoverListener: !hint, children: type === "anchor" ? /* @__PURE__ */ jsxs(
@@ -50,12 +50,58 @@ function WmPage(props) {
50
50
  }));
51
51
  const [hasFullNavHeight, setHasFullNavHeight] = useState(false);
52
52
  const [leftPanelPageClasses, setLeftPanelPageClasses] = useState();
53
+ const [hasLeftPanel, setHasLeftPanel] = useState(false);
54
+ const [leftPanelExpanded, setLeftPanelExpanded] = useState(false);
53
55
  const handleNavHeightChange = useCallback((isFull) => {
54
56
  setHasFullNavHeight(isFull);
55
57
  }, []);
56
58
  const handleLeftPanelPageClassesChange = useCallback((pageClasses) => {
57
59
  setLeftPanelPageClasses(pageClasses);
58
60
  }, []);
61
+ const handleLeftPanelPresenceChange = useCallback((present) => {
62
+ setHasLeftPanel(present);
63
+ if (!present) {
64
+ setLeftPanelExpanded(false);
65
+ }
66
+ }, []);
67
+ const toggleLeftPanel = useCallback(() => {
68
+ setLeftPanelExpanded((expanded) => !expanded);
69
+ }, []);
70
+ const handlePageClick = useCallback(
71
+ (event) => {
72
+ if (!leftPanelExpanded) {
73
+ return;
74
+ }
75
+ const target = event.target;
76
+ if (!target) {
77
+ return;
78
+ }
79
+ if (target.closest(".app-left-panel")) {
80
+ return;
81
+ }
82
+ if (target.closest("[data-role='page-left-panel-icon']")) {
83
+ return;
84
+ }
85
+ setLeftPanelExpanded(false);
86
+ },
87
+ [leftPanelExpanded]
88
+ );
89
+ const pageLayoutContextValue = useMemo(
90
+ () => ({
91
+ onLeftPanelPageClassesChange: handleLeftPanelPageClassesChange,
92
+ onLeftPanelPresenceChange: handleLeftPanelPresenceChange,
93
+ hasLeftPanel,
94
+ leftPanelExpanded,
95
+ toggleLeftPanel
96
+ }),
97
+ [
98
+ handleLeftPanelPageClassesChange,
99
+ handleLeftPanelPresenceChange,
100
+ hasLeftPanel,
101
+ leftPanelExpanded,
102
+ toggleLeftPanel
103
+ ]
104
+ );
59
105
  const handleResize = useCallback(() => {
60
106
  const newSize = {
61
107
  width: window.innerWidth,
@@ -122,25 +168,20 @@ function WmPage(props) {
122
168
  return child;
123
169
  });
124
170
  }, [children, handleNavHeightChange]);
125
- return /* @__PURE__ */ jsx(
126
- PageLayoutContext.Provider,
127
- {
128
- value: { onLeftPanelPageClassesChange: handleLeftPanelPageClassesChange },
129
- children: /* @__PURE__ */ jsx(
130
- Container,
131
- __spreadProps(__spreadValues({}, removeInvalidAttributes(restProps)), {
132
- className: clsx(
133
- getDefaultClass(pageName),
134
- { "app-nav-full": hasFullNavHeight },
135
- leftPanelPageClasses,
136
- className
137
- ),
138
- sx: __spreadValues({}, styles),
139
- children: childrenWithCallback
140
- })
141
- )
142
- }
143
- );
171
+ return /* @__PURE__ */ jsx(PageLayoutContext.Provider, { value: pageLayoutContextValue, children: /* @__PURE__ */ jsx(
172
+ Container,
173
+ __spreadProps(__spreadValues({}, removeInvalidAttributes(restProps)), {
174
+ onClick: handlePageClick,
175
+ className: clsx(
176
+ getDefaultClass(pageName),
177
+ { "app-nav-full": hasFullNavHeight },
178
+ leftPanelPageClasses,
179
+ className
180
+ ),
181
+ sx: __spreadValues({}, styles),
182
+ children: childrenWithCallback
183
+ })
184
+ ) });
144
185
  }
145
186
  WmPage.displayName = "WmPage";
146
187
  var page_default = WmPage;
@@ -1,4 +1,8 @@
1
1
  export interface PageLayoutContextValue {
2
2
  onLeftPanelPageClassesChange?: (pageClasses?: string) => void;
3
+ onLeftPanelPresenceChange?: (present: boolean) => void;
4
+ hasLeftPanel?: boolean;
5
+ leftPanelExpanded?: boolean;
6
+ toggleLeftPanel?: () => void;
3
7
  }
4
8
  export declare const PageLayoutContext: import("react").Context<PageLayoutContextValue>;
@@ -54,6 +54,8 @@ const NON_PROXYABLE_TAGS = /* @__PURE__ */ new Set([
54
54
  const isNonProxyableBuiltin = (value) => NON_PROXYABLE_TAGS.has(Object.prototype.toString.call(value)) || // Covers every TypedArray flavour plus DataView in one check.
55
55
  ArrayBuffer.isView(value);
56
56
  const proxyMap = /* @__PURE__ */ new WeakMap();
57
+ const stateProxyMap = /* @__PURE__ */ new WeakMap();
58
+ const isKnownProxy = (value) => proxyMap.has(value) || stateProxyMap.has(value);
57
59
  const pageWidgetProxyCaches = /* @__PURE__ */ new WeakMap();
58
60
  function clearPageWidgetProxyCache(widgetsProxy) {
59
61
  var _a;
@@ -118,6 +120,7 @@ function queueBatchedWidgetContextUpdate(widgetName, widget, prop, value, setPag
118
120
  }
119
121
  }
120
122
  const originalTargets = /* @__PURE__ */ new WeakMap();
123
+ const objectsBeingProxied = /* @__PURE__ */ new WeakSet();
121
124
  const MUTATING_ARRAY_METHODS = [
122
125
  "push",
123
126
  "pop",
@@ -389,7 +392,10 @@ const createPageProxy = (target, setPageContext, overriddenPropsRegistry) => {
389
392
  }
390
393
  return proxy2;
391
394
  }
392
- const proxy = widget ? createWidgetProxy(widget, widgetName, setPageContext, overriddenPropsRegistry) : void 0;
395
+ if (!widget) {
396
+ return void 0;
397
+ }
398
+ const proxy = createWidgetProxy(widget, widgetName, setPageContext, overriddenPropsRegistry);
393
399
  widgetProxies.set(widgetName, proxy);
394
400
  return proxy;
395
401
  },
@@ -398,24 +404,23 @@ const createPageProxy = (target, setPageContext, overriddenPropsRegistry) => {
398
404
  return true;
399
405
  }
400
406
  widgetsTarget[widgetName] = widgetValue;
401
- if (widgetProxies.has(widgetName)) {
402
- const proxy = widgetProxies.get(widgetName);
403
- const originalTarget = originalTargets.get(proxy);
404
- if (widgetValue && typeof widgetValue === "object") {
405
- for (const key in widgetValue) {
406
- const newVal = widgetValue[key];
407
- const oldVal = originalTarget[key];
408
- if (oldVal !== newVal) {
409
- Reflect.defineProperty(originalTarget, key, {
410
- value: newVal,
411
- writable: true,
412
- configurable: true,
413
- enumerable: true
414
- });
415
- }
407
+ const isObjectValue = !!widgetValue && typeof widgetValue === "object";
408
+ const cachedProxy = widgetProxies.get(widgetName);
409
+ const originalTarget = cachedProxy ? originalTargets.get(cachedProxy) : void 0;
410
+ if (originalTarget && isObjectValue) {
411
+ for (const key in widgetValue) {
412
+ const newVal = widgetValue[key];
413
+ const oldVal = originalTarget[key];
414
+ if (oldVal !== newVal) {
415
+ Reflect.defineProperty(originalTarget, key, {
416
+ value: newVal,
417
+ writable: true,
418
+ configurable: true,
419
+ enumerable: true
420
+ });
416
421
  }
417
422
  }
418
- } else if (widgetValue && typeof widgetValue === "object") {
423
+ } else if (isObjectValue) {
419
424
  const proxy = createWidgetProxy(
420
425
  widgetValue,
421
426
  widgetName,
@@ -423,6 +428,8 @@ const createPageProxy = (target, setPageContext, overriddenPropsRegistry) => {
423
428
  overriddenPropsRegistry
424
429
  );
425
430
  widgetProxies.set(widgetName, proxy);
431
+ } else {
432
+ widgetProxies.delete(widgetName);
426
433
  }
427
434
  return true;
428
435
  }
@@ -430,15 +437,68 @@ const createPageProxy = (target, setPageContext, overriddenPropsRegistry) => {
430
437
  pageWidgetProxyCaches.set(widgetsProxy, widgetProxies);
431
438
  return widgetsProxy;
432
439
  };
440
+ const dataSetRaw = /* @__PURE__ */ new WeakMap();
433
441
  const wrapVariableProxy = (variable, path, varName, setPageContext) => {
434
442
  if (proxyMap.has(variable)) {
435
443
  return variable;
436
444
  }
437
- const varProxy = new Proxy(variable, {
445
+ const dataSetProxies = /* @__PURE__ */ new WeakMap();
446
+ let varProxy;
447
+ const refreshDataSet = () => {
448
+ const dataSet = variable.dataSet;
449
+ varProxy.dataSet = Array.isArray(dataSet) ? [...dataSet] : __spreadValues({}, dataSet);
450
+ };
451
+ const createDataSetProxy = (value, isRootDataSet = false) => {
452
+ if (typeof value !== "object" || value === null || isNonProxyableBuiltin(value)) {
453
+ return value;
454
+ }
455
+ const cached = dataSetProxies.get(value);
456
+ if (cached) return cached;
457
+ const proxy = new Proxy(value, {
458
+ get(target, prop, receiver) {
459
+ const nestedValue = Reflect.get(target, prop, receiver);
460
+ if (Array.isArray(target) && typeof prop === "string" && MUTATING_ARRAY_METHODS.includes(prop) && typeof nestedValue === "function") {
461
+ return (...args) => {
462
+ const mutationTarget = isRootDataSet ? variable.dataSet : target;
463
+ const result = Reflect.get(mutationTarget, prop).apply(mutationTarget, args);
464
+ refreshDataSet();
465
+ return result;
466
+ };
467
+ }
468
+ return createDataSetProxy(nestedValue);
469
+ },
470
+ set(target, prop, value2) {
471
+ const mutationTarget = isRootDataSet ? variable.dataSet : target;
472
+ if (Reflect.get(mutationTarget, prop) === value2) {
473
+ return true;
474
+ }
475
+ const result = Reflect.set(mutationTarget, prop, value2);
476
+ refreshDataSet();
477
+ return result;
478
+ },
479
+ deleteProperty(target, prop) {
480
+ const result = Reflect.deleteProperty(isRootDataSet ? variable.dataSet : target, prop);
481
+ refreshDataSet();
482
+ return result;
483
+ }
484
+ });
485
+ dataSetProxies.set(value, proxy);
486
+ dataSetRaw.set(proxy, value);
487
+ return proxy;
488
+ };
489
+ varProxy = new Proxy(variable, {
490
+ get(target, prop, receiver) {
491
+ const value = Reflect.get(target, prop, receiver);
492
+ return prop === "dataSet" ? createDataSetProxy(value, true) : value;
493
+ },
438
494
  set(target, prop, value, receiver) {
439
495
  if (typeof prop === "symbol") {
440
496
  return Reflect.set(target, prop, value, receiver);
441
497
  }
498
+ if (prop === "dataSet" && dataSetRaw.has(value)) {
499
+ const raw = dataSetRaw.get(value);
500
+ value = Array.isArray(raw) ? [...raw] : __spreadValues({}, raw);
501
+ }
442
502
  const prevVal = Reflect.get(target, prop, receiver);
443
503
  const result = Reflect.set(target, prop, value, receiver);
444
504
  if (prevVal !== value) {
@@ -462,8 +522,12 @@ const wrapVariableProxy = (variable, path, varName, setPageContext) => {
462
522
  return varProxy;
463
523
  };
464
524
  const createStateProxy = (obj, path = [], setPageContext, overriddenPropsRegistry) => {
525
+ if (isKnownProxy(obj) || objectsBeingProxied.has(obj)) {
526
+ return obj;
527
+ }
465
528
  const nestedProxies = /* @__PURE__ */ new Map();
466
- return new Proxy(obj, {
529
+ objectsBeingProxied.add(obj);
530
+ const proxy = new Proxy(obj, {
467
531
  get(target, prop, receiver) {
468
532
  if (prop === "eval") {
469
533
  return (fn, failOnError = false) => {
@@ -591,6 +655,9 @@ const createStateProxy = (obj, path = [], setPageContext, overriddenPropsRegistr
591
655
  return true;
592
656
  }
593
657
  });
658
+ stateProxyMap.set(proxy, true);
659
+ objectsBeingProxied.delete(obj);
660
+ return proxy;
594
661
  };
595
662
  const getFormFieldEntries = (formfields) => {
596
663
  const canonicalKeyByField = /* @__PURE__ */ new Map();
@@ -354,7 +354,7 @@ const BaseApp = (WrappedComponent, addAppScript, getAppVariables, appInfo = {})
354
354
  showTypeLabel: showTypeLabel != null ? showTypeLabel : false
355
355
  });
356
356
  notificationAction.config.paramProvider = newParams;
357
- notificationAction.invoke();
357
+ notificationAction.invoke(__spreadValues({ message }, newParams()));
358
358
  } else {
359
359
  console.warn(
360
360
  `The default Action "appNotification" doesn't exist in the app. App notified following error:
@@ -154,7 +154,8 @@ const withPageContext = (WrappedComponent, addPageScript, getVariables, componen
154
154
  formatMessage,
155
155
  overriddenPropsRegistryRef: overriddenPropsRegistryRef.current,
156
156
  layoutReady,
157
- activePageName: componentInfo == null ? void 0 : componentInfo.componentName
157
+ activePageName: componentInfo == null ? void 0 : componentInfo.componentName,
158
+ pageName: componentInfo == null ? void 0 : componentInfo.componentName
158
159
  }));
159
160
  useActivePageReactivity({
160
161
  componentType: componentInfo == null ? void 0 : componentInfo.componentType,
@@ -31,7 +31,7 @@ var __objRest = (source, exclude) => {
31
31
  return target;
32
32
  };
33
33
  import { createElement } from "react";
34
- import React, { useEffect, useMemo, useCallback } from "react";
34
+ import React, { useEffect, useMemo, useCallback, useRef } from "react";
35
35
  import isEqual from "lodash-es/isEqual";
36
36
  import { useDeviceVisibility } from "../hooks/useDeviceVisibility";
37
37
  import { usePageContext } from "../context/WidgetProvider";
@@ -40,11 +40,19 @@ const withBaseWrapper = (WrappedComponent) => {
40
40
  const WithBaseComponent = (props) => {
41
41
  var _b, _c, _d;
42
42
  const _a = props, { show = true, deferload, standalone = false } = _a, rest = __objRest(_a, ["show", "deferload", "standalone"]);
43
+ const previousDataValueRef = useRef(props.datavalue);
43
44
  const name = props["item-id"] || props.name;
44
45
  const { pageContext, updateWidgetState, destroy, proxy } = usePageContext(standalone);
45
46
  const { isHidden } = useDeviceVisibility(props.showindevice || ["all"]);
46
47
  const componentWidgetId = useMemo(() => props == null ? void 0 : props["data-widget-id"], [props == null ? void 0 : props["data-widget-id"]]);
47
48
  const widgetFromContext = name ? (_b = pageContext == null ? void 0 : pageContext.Widgets) == null ? void 0 : _b[name] : void 0;
49
+ const previousDataValueHasChanged = useMemo(() => {
50
+ if (previousDataValueRef.current != props.datavalue) {
51
+ previousDataValueRef.current = props.datavalue;
52
+ return true;
53
+ }
54
+ return false;
55
+ }, [props.datavalue]);
48
56
  useEffect(() => {
49
57
  if (name && (props == null ? void 0 : props.iswidget) !== "false" && (pageContext == null ? void 0 : pageContext.Widgets)) {
50
58
  const widget = (widgetFromContext == null ? void 0 : widgetFromContext["data-widget-id"]) === componentWidgetId ? widgetFromContext : {};
@@ -67,7 +75,7 @@ const withBaseWrapper = (WrappedComponent) => {
67
75
  let mergedState = __spreadValues({}, props);
68
76
  const registry = pageContext == null ? void 0 : pageContext.overriddenPropsRegistry;
69
77
  const widgetDatavalue = widget.datavalue;
70
- const datavalue = props["item-id"] ? props.datavalue : widgetDatavalue != null ? widgetDatavalue : props.datavalue;
78
+ const datavalue = props["item-id"] || previousDataValueHasChanged ? props.datavalue : widgetDatavalue != null ? widgetDatavalue : props.datavalue;
71
79
  if (shouldMergeFromContext && (registry == null ? void 0 : registry.isWidgetOverridden(name, componentWidgetId || "")) && !props.formfield) {
72
80
  const widgetOverrides = registry == null ? void 0 : registry.getWidgetOverrides(name, componentWidgetId || "");
73
81
  if (widgetOverrides) {
@@ -22,12 +22,21 @@ declare class ModernHttpService implements HttpClientService {
22
22
  * Get the currently stored context
23
23
  * @returns The stored context object
24
24
  */
25
+ /**
26
+ * The axios instance carrying every interceptor setupInterceptors() attaches.
27
+ *
28
+ * For module-scope callers that build their own request config and cannot use the useHttp()
29
+ * hook — the generated service classes in an app's `services/` folder. Without this they had to
30
+ * own a separate instance and re-implement each interceptor, which drifted (the app's
31
+ * onBeforeServiceCall stopped firing). Prefer send()/sendCall() for the normal variable flow.
32
+ */
33
+ getAxiosInstance(): AxiosInstance;
25
34
  getContext(): any;
26
35
  getAppManager(): any;
27
36
  private handleSessionFailure;
28
37
  private setupInterceptors;
29
- send(options: any, variable: any): Promise<any>;
30
- sendCall(requestParams: any, variable: any): Promise<any>;
38
+ send(options: any, variable: any, params?: any): Promise<any>;
39
+ sendCall(requestParams: any, variable: any, params?: any): Promise<any>;
31
40
  setLocale(locale: string): void;
32
41
  getLocale(): any;
33
42
  cancel(variable: any): void;
@@ -46,13 +55,14 @@ export declare const useHttp: () => HttpContextType;
46
55
  export declare const getHttpService: () => ModernHttpService;
47
56
  export declare const httpService: {
48
57
  readonly instance: ModernHttpService;
49
- send: (options: any, variable: any) => Promise<any>;
50
- sendCall: (requestParams: any, variable: any) => Promise<any>;
58
+ send: (options: any, variable: any, params?: any) => Promise<any>;
59
+ sendCall: (requestParams: any, variable: any, params?: any) => Promise<any>;
51
60
  cancel: (variable: any) => void;
52
61
  uploadFile: (url: string, data: any, variable: any, options?: any) => Promise<any>;
53
62
  setLocale: (locale: string) => void;
54
63
  getLocale: () => any;
55
64
  setContext: (context: any) => void;
56
65
  getContext: () => any;
66
+ getAxiosInstance: () => AxiosInstance;
57
67
  };
58
68
  export default httpService;
package/hooks/useHttp.js CHANGED
@@ -28,12 +28,16 @@ import { createContext, useContext, useRef, useMemo } from "react";
28
28
  import { WS_CONSTANTS } from "../variables/constants";
29
29
  import { store } from "../store";
30
30
  import { XSRF_HEADER_NAME } from "../store/slices/authSlice";
31
+ import { getActiveRoutingBasePath, PREVIEW_ROUTING_BASEPATH } from "../core/constants";
31
32
  class ModernHttpService {
32
33
  constructor(baseURL = "") {
33
34
  __publicField(this, "axiosInstance");
34
35
  __publicField(this, "_context", null);
35
36
  __publicField(this, "localeObject", store.getState().i18n.appLocale);
36
- this.axiosInstance = axios.create({ baseURL });
37
+ this.axiosInstance = axios.create({
38
+ baseURL,
39
+ formSerializer: { indexes: null }
40
+ });
37
41
  this.setupInterceptors();
38
42
  }
39
43
  /**
@@ -47,6 +51,17 @@ class ModernHttpService {
47
51
  * Get the currently stored context
48
52
  * @returns The stored context object
49
53
  */
54
+ /**
55
+ * The axios instance carrying every interceptor setupInterceptors() attaches.
56
+ *
57
+ * For module-scope callers that build their own request config and cannot use the useHttp()
58
+ * hook — the generated service classes in an app's `services/` folder. Without this they had to
59
+ * own a separate instance and re-implement each interceptor, which drifted (the app's
60
+ * onBeforeServiceCall stopped firing). Prefer send()/sendCall() for the normal variable flow.
61
+ */
62
+ getAxiosInstance() {
63
+ return this.axiosInstance;
64
+ }
50
65
  getContext() {
51
66
  return this._context;
52
67
  }
@@ -156,8 +171,8 @@ class ModernHttpService {
156
171
  }
157
172
  );
158
173
  }
159
- async send(options, variable) {
160
- var _a, _b, _c, _d;
174
+ async send(options, variable, params) {
175
+ var _a, _b, _c, _d, _e, _f, _g;
161
176
  const serviceInfo = variable.serviceInfo;
162
177
  let headers = new AxiosHeaders(options.headers);
163
178
  let requestBody = options.data;
@@ -186,12 +201,19 @@ class ModernHttpService {
186
201
  if (!options.isDirectCall) {
187
202
  headers = headers.set("X-Requested-With", "XMLHttpRequest");
188
203
  }
204
+ const plainHeaders = {};
205
+ const rawHeaders = typeof headers.toJSON === "function" ? headers.toJSON() : headers;
206
+ if (rawHeaders && typeof rawHeaders === "object") {
207
+ for (const [k, v] of Object.entries(rawHeaders)) {
208
+ if (v != null && typeof v !== "function") plainHeaders[k] = String(v);
209
+ }
210
+ }
189
211
  const methodType = ((serviceInfo == null ? void 0 : serviceInfo.methodType) || options.method || "get").toLowerCase();
190
212
  const isNonDataMethod = WS_CONSTANTS.NON_DATA_AXIOS_METHODS.indexOf(methodType.toUpperCase()) > -1;
191
213
  const axiosConfig = __spreadProps(__spreadValues({
192
214
  url: url.endsWith("/") ? url.slice(0, -1) : url,
193
215
  method: methodType,
194
- headers,
216
+ headers: plainHeaders,
195
217
  cancelToken: variable.cancelTokenSource.token,
196
218
  withCredentials: (options == null ? void 0 : options.withCredentials) !== false
197
219
  }, isNonDataMethod ? {} : { data: requestBody || {} }), {
@@ -200,7 +222,8 @@ class ModernHttpService {
200
222
  owner: variable.config._context.name,
201
223
  operation: variable.operation
202
224
  // Add operation to the context
203
- }
225
+ },
226
+ __axiosInstance: this.axiosInstance
204
227
  });
205
228
  if (variable.operation === "getDownloadFile" || (serviceInfo == null ? void 0 : serviceInfo.operationId) === "FileController_getDownloadFile") {
206
229
  axiosConfig.responseType = "blob";
@@ -209,7 +232,21 @@ class ModernHttpService {
209
232
  axiosConfig.onUploadProgress = options.onUploadProgress;
210
233
  }
211
234
  try {
212
- const response = await this.axiosInstance.request(axiosConfig);
235
+ const isPreview = getActiveRoutingBasePath() === PREVIEW_ROUTING_BASEPATH;
236
+ let response;
237
+ if (isPreview || variable.invokeHttp == void 0) {
238
+ response = await this.axiosInstance.request(axiosConfig);
239
+ } else {
240
+ response = await variable.invokeHttp(
241
+ __spreadProps(__spreadValues({}, axiosConfig), { serviceInfo }),
242
+ (_g = (_f = (_e = params != null ? params : variable.resolvedParams) != null ? _e : variable.lastInvokedParams) != null ? _f : variable.inputFields) != null ? _g : variable.params,
243
+ // CrudVariable only: it sets lastInvokedOperation per call. Not `variable.operation`
244
+ // (for a CrudVariable that is the entity name, "Loan") and not axiosConfig.method
245
+ // (that is the HTTP verb, "get") — either hits the generated switch's default and
246
+ // throws. The generated glue defaults an undefined value to its own operationType.
247
+ variable.lastInvokedOperation
248
+ );
249
+ }
213
250
  if (variable.operation === "getDownloadFile" || (serviceInfo == null ? void 0 : serviceInfo.operationId) === "FileController_getDownloadFile") {
214
251
  return this.handleFileDownload(response, options, variable);
215
252
  }
@@ -218,9 +255,9 @@ class ModernHttpService {
218
255
  throw error.response || error;
219
256
  }
220
257
  }
221
- async sendCall(requestParams, variable) {
258
+ async sendCall(requestParams, variable, params) {
222
259
  try {
223
- const response = await this.send(requestParams, variable);
260
+ const response = await this.send(requestParams, variable, params);
224
261
  return response;
225
262
  } catch (error) {
226
263
  throw error;
@@ -342,7 +379,8 @@ const httpService = {
342
379
  setLocale: (...args) => getHttpService().setLocale(...args),
343
380
  getLocale: () => getHttpService().getLocale(),
344
381
  setContext: (...args) => getHttpService().setContext(...args),
345
- getContext: () => getHttpService().getContext()
382
+ getContext: () => getHttpService().getContext(),
383
+ getAxiosInstance: () => getHttpService().getAxiosInstance()
346
384
  };
347
385
  var useHttp_default = httpService;
348
386
  export {