@wavemaker-ai/react-runtime 1.0.0-rc.330 → 1.0.0-rc.334

package/components/input/select/index.js

@@ -334,7 +334,7 @@ const WmSelect = React.memo(
       }
       prevComputedValueRef.current = currentValue;
     }, [computedSelectValue, multiple, listener, props.fieldName, name, localDatavalue]);
-    return /* @__PURE__ */ jsx("div", { className: clsx(DEFAULT_CLASS, className), hidden: props.hidden, style: styles, children: /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx("div", { className: clsx(DEFAULT_CLASS), hidden: props.hidden, style: styles, children: /* @__PURE__ */ jsxs(
       NativeSelect,
       __spreadProps(__spreadValues({
         name,
@@ -342,7 +342,6 @@ const WmSelect = React.memo(
         className: clsx(
           isTouched ? "ng-touched" : "ng-untouched",
           isDirty ? "ng-invalid" : "ng-valid",
-          className,
           "wm-native-select-root"
         ),
         value: multiple ? computedSelectValue : (_b = (_a = computedSelectValue.key) != null ? _a : placeholder) != null ? _b : ""
@@ -365,7 +364,11 @@ const WmSelect = React.memo(
           multiple,
           disabled,
           "aria-readonly": readonly,
-          className: `app-select ${className} ${DEFAULT_CLASS}  form-control ng-valid ng-touched ng-dirty wm-app `,
+          className: clsx(
+            "app-select",
+            className || "",
+            "form-control ng-valid ng-touched ng-dirty wm-app"
+          ),
           accessKey: shortcutkey,
           title: hint
         },

package/components/input/slider/index.d.ts

@@ -30,6 +30,7 @@ declare const WmSliderStandalone: React.ComponentType<import("../../data/form/fo
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -129,6 +130,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/input/text/index.d.ts

@@ -41,6 +41,7 @@ declare const WmTextStandalone: import("react").ComponentType<import("../../data
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: import("react").CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -146,6 +147,7 @@ declare const _default: import("react").ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: import("react").CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/input/text/index.js

@@ -84,11 +84,13 @@ const WmText = memo(
     const [isTouched, setIsTouched] = useState(false);
     const [isAutofilled, setIsAutofilled] = useState(false);
     const ref = useRef(null);
+    const wrapperRef = useRef(null);
     const cursorPositionRef = useRef(0);
     const displayError = error || isDirty && showError;
     const isInternalChange = useRef(false);
     const prevValueRef = useRef(datavalue);
     useEffect(() => {
+      var _a, _b, _c;
       const normalizedValue = sanitizeInputValue(datavalue);
       if (!isInternalChange.current && normalizedValue !== rawValue) {
         setRawValue(normalizedValue);
@@ -100,6 +102,12 @@ const WmText = memo(
       if (datavalue === "" || datavalue === null || datavalue === void 0) {
         setIsAutofilled(false);
       }
+      const type_attr = (_a = wrapperRef.current) == null ? void 0 : _a.getAttribute("type");
+      if (type && !type_attr) {
+        (_b = wrapperRef.current) == null ? void 0 : _b.setAttribute("type", type);
+      } else {
+        (_c = wrapperRef.current) == null ? void 0 : _c.removeAttribute("type");
+      }
     }, [datavalue]);
     const validateInput = useCallback(
       (value) => {
@@ -360,6 +368,7 @@ const WmText = memo(
     return /* @__PURE__ */ jsx(
       TextField,
       __spreadProps(__spreadValues({}, events), {
+        ref: wrapperRef,
         hidden: props.hidden,
         title: hint || "Text Input",
         name,
@@ -399,7 +408,6 @@ const WmText = memo(
                 name: "leadingIcon",
                 className: "btn-leading-icon",
                 onClick: handleLeadingIconClick,
-                "aria-hidden": "true",
                 tabIndex: -1,
                 children: /* @__PURE__ */ jsx(
                   WmAppIcon,
@@ -418,7 +426,6 @@ const WmText = memo(
                 name: "trailingIcon",
                 className: "btn-trailing-icon",
                 onClick: handleTrailingIconClick,
-                "aria-hidden": "true",
                 tabIndex: -1,
                 children: /* @__PURE__ */ jsx(
                   WmAppIcon,

package/components/input/textarea/index.d.ts

@@ -27,6 +27,7 @@ declare const WmTextareaStandalone: React.ComponentType<import("../../data/form/
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -117,6 +118,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/input/upload/index.d.ts

@@ -21,6 +21,7 @@ declare const WithForm: React.NamedExoticComponent<import("../../data/form/form-
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -106,6 +107,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/navbar/index.d.ts

@@ -26,6 +26,7 @@ declare const _default: import("react").MemoExoticComponent<import("react").Comp
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: import("react").CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/navbar/nav-item/index.d.ts

@@ -19,6 +19,7 @@ declare const _default: import("react").MemoExoticComponent<import("react").Comp
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: import("react").CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/navigation/breadcrumb/index.d.ts

@@ -22,6 +22,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/navigation/menu/index.d.ts

@@ -39,6 +39,7 @@ declare const _default: React.ComponentType<{
     datavalue?: any;
     width?: string | number;
     height?: string | number;
+    class?: string;
     onClick?: (event?: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
     onDoubleClick?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
     onMouseEnter?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;

package/components/navigation/menu/index.js

@@ -314,7 +314,8 @@ const WmMenu = memo((props) => {
         link: (node == null ? void 0 : node[itemlink]) || dataObject[itemlink] || dataObject["link"],
         hint: (node == null ? void 0 : node[hint]) || dataObject[hint],
         disabled: (node == null ? void 0 : node.disabled) || dataObject.disabled,
-        children: children2
+        children: children2,
+        itemClass: (node == null ? void 0 : node.class) || dataObject["class"]
       };
     },
     [itemlabel, itemicon, itemlink, hint, itemchildren]
@@ -331,23 +332,25 @@ const WmMenu = memo((props) => {
     [menualign]
   );
   const getMenuLayoutStyles = useCallback(() => {
+    const positionStyles = {
+      inset: "100% auto auto 0px",
+      transform: "translateY(0px)"
+    };
     switch (menulayout) {
       case LAYOUT.HORIZONTAL:
-        return {
+        return __spreadProps(__spreadValues({}, positionStyles), {
           display: "flex",
           flexDirection: "row"
-        };
+        });
       case LAYOUT.GRID:
-        return {
+        return __spreadProps(__spreadValues({}, positionStyles), {
           display: "grid",
           gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
           gap: "8px"
-        };
+        });
       case LAYOUT.VERTICAL:
       default:
-        return {
-          display: "block"
-        };
+        return __spreadValues({}, positionStyles);
     }
   }, [menulayout]);
   const handleMenuClick = useCallback(
@@ -636,7 +639,7 @@ const WmMenu = memo((props) => {
       if (!nodes || !Array.isArray(nodes)) return null;
       return nodes.map((node, index) => {
         var _a2;
-        const { label, icon, link, hint: hint2, disabled, children: children2 } = getNodeProperties(node);
+        const { label, icon, link, hint: hint2, disabled, children: children2, itemClass } = getNodeProperties(node);
         const itemPath = pathPrefix ? `${pathPrefix}-${index}` : `${index}`;
         const nodeValueLink = (_a2 = node == null ? void 0 : node.value) == null ? void 0 : _a2.link;
         const isActive = nodeValueLink && typeof nodeValueLink === "string" ? isPathMatchingLink(path, nodeValueLink) : link ? isPathMatchingLink(path, link) : false;
@@ -659,6 +662,7 @@ const WmMenu = memo((props) => {
             className: clsx(
               children2 && children2.length > 0 && "dropdown-submenu",
               "app-menu-item",
+              itemClass,
               {
                 active: isActive,
                 hovered: isHovered

package/components/navigation/menu/props.d.ts

@@ -56,6 +56,7 @@ export interface MenuNode {
     nodeRef?: React.RefObject<HTMLDivElement | null>;
     dataObject?: any;
     isactive?: boolean;
+    class?: string;
 }
 export interface WmMenuExtendedProps extends Omit<WmMenuProps, "name"> {
     styles?: React.CSSProperties;

package/components/navigation/popover/index.d.ts

@@ -25,7 +25,7 @@ declare const _default: React.ComponentType<{
     onLoad?: (widget: WmPopoverProps) => void | Function;
     onShow?: (event: Event, widget: WmPopoverProps) => void;
     onHide?: (event: Event, widget: WmPopoverProps) => void;
-    render?: (props: WmPopoverProps, onLoad: () => void) => React.ReactNode;
+    render?: (props: WmPopoverProps, onLoad: (widget?: any) => void) => React.ReactNode;
     disabled?: boolean;
     isOpen?: boolean;
     caption: string;
@@ -54,6 +54,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/navigation/popover/index.js

@@ -32,6 +32,7 @@ import debounce from "lodash-es/debounce";
 import Popover from "@mui/material/Popover";
 import withBaseWrapper from "../../../higherOrder/withBaseWrapper";
 import { WmAnchor } from "../../basic/anchor";
+import { PopoverContext } from "../../../context/PopoverContext";
 import { DEFAULT_PROPS } from "./props";
 const WmPopover = (Props) => {
   var _a, _b, _c;
@@ -44,6 +45,7 @@ const WmPopover = (Props) => {
   const popoverActionsRef = useRef(null);
   const loadedRef = useRef(false);
   const [open, setOpen] = useState(false);
+  const [keepContentMounted, setKeepContentMounted] = useState(false);
   const isOpen = Boolean(anchorEl);
   const openPopover = useCallback(() => {
     var _a2;
@@ -64,6 +66,16 @@ const WmPopover = (Props) => {
     setIsDialogOpen(false);
     (_a2 = props == null ? void 0 : props.onHide) == null ? void 0 : _a2.call(props, {}, __spreadValues({ isOpen: false }, props));
   }, [isOpen]);
+  const popoverContext = useMemo(
+    () => ({
+      closeForDialog: () => {
+        setKeepContentMounted(true);
+        closePopover();
+      },
+      onDialogClose: () => setKeepContentMounted(false)
+    }),
+    [closePopover]
+  );
   const togglePopover = useCallback(() => {
     if (isOpen) {
       closePopover();
@@ -260,7 +272,7 @@ const WmPopover = (Props) => {
         )
       })
     ),
-    /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(PopoverContext.Provider, { value: popoverContext, children: /* @__PURE__ */ jsxs(
       Popover,
       {
         action: popoverActionsRef,
@@ -274,6 +286,7 @@ const WmPopover = (Props) => {
           enter: 0,
           exit: 0
         },
+        keepMounted: keepContentMounted,
         disableScrollLock: true,
         disableAutoFocus: true,
         disableEnforceFocus: true,
@@ -288,7 +301,6 @@ const WmPopover = (Props) => {
             },
             className: clsx(
               placement,
-              props.className,
               "app-popover in popover",
               props.contentanimation && `animated ${props.contentanimation}`,
               `popover-${placement}`,
@@ -306,10 +318,10 @@ const WmPopover = (Props) => {
             }
           ),
           props.title && /* @__PURE__ */ jsx("div", { className: "popover-title popover-header", children: props.title }),
-          /* @__PURE__ */ jsx("div", { className: "popover-content popover-body", children: props.render && props.content ? /* @__PURE__ */ jsx(Suspense, { fallback: null, children: props.render(props, () => handleLoad(__spreadValues({}, props))) }) : props.children })
+          /* @__PURE__ */ jsx("div", { className: "popover-content popover-body", children: props.render && props.content ? /* @__PURE__ */ jsx(Suspense, { fallback: null, children: props.render(props, (widget) => handleLoad(widget)) }) : props.children })
         ]
       }
-    )
+    ) })
   ] });
 };
 var popover_default = withBaseWrapper(WmPopover);

package/components/navigation/popover/props.d.ts

@@ -19,7 +19,7 @@ interface PopoverProps extends WmAnchorProps {
     onLoad?: (widget: WmPopoverProps) => void | Function;
     onShow?: (event: Event, widget: WmPopoverProps) => void;
     onHide?: (event: Event, widget: WmPopoverProps) => void;
-    render?: (props: WmPopoverProps, onLoad: () => void) => React.ReactNode;
+    render?: (props: WmPopoverProps, onLoad: (widget?: any) => void) => React.ReactNode;
     disabled?: boolean;
     isOpen?: boolean;
 }

package/components/page/partial/index.d.ts

@@ -17,6 +17,7 @@ declare const _default: import("react").ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: import("react").CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/context/PopoverContext.d.ts

@@ -0,0 +1,5 @@
+export interface PopoverContextValue {
+    closeForDialog: () => void;
+    onDialogClose: () => void;
+}
+export declare const PopoverContext: import("react").Context<PopoverContextValue>;

package/context/PopoverContext.js

@@ -0,0 +1,5 @@
+import { createContext } from "react";
+const PopoverContext = createContext(null);
+export {
+  PopoverContext
+};

package/context/WidgetProvider.js

@@ -35,6 +35,7 @@ import { HttpProvider } from "../hooks/useHttp";
 import { removeWidgetsFromContext } from "../utils/widget-cleanup-util";
 import { EVENTEMITTER_METHODS } from "../core/constants/events";
 import { createWidgetProxy } from "../core/proxy-service";
+import { isPrefabScope, publishPartialNamespaces } from "../utils/partial-host-util";
 import { useLayout } from "./LayoutProvider";
 import isPlainObject from "lodash-es/isPlainObject";
 const WidgetContext = createContext(void 0);
@@ -176,8 +177,14 @@ const WidgetProvider = ({
       var _a2;
       if (!data.pageContext) return;
       if ((_a2 = data.pageContext) == null ? void 0 : _a2.isLayout) return;
-      proxy.Widgets[data.partialName] = data.proxy;
-      if (isAppWidgetRegisterNeeded) proxy.App.Widgets[data.partialName] = data.proxy;
+      const registerHost = (widgets) => {
+        if (!widgets) return;
+        if (isPrefabScope(data.pageContext) || !publishPartialNamespaces(widgets[data.partialName], data.proxy)) {
+          widgets[data.partialName] = data.proxy;
+        }
+      };
+      registerHost(proxy.Widgets);
+      if (isAppWidgetRegisterNeeded) registerHost(proxy.App.Widgets);
     };
     EVENTEMITTER_METHODS.PARTIAL_STATE_SYNC_ON(handlePartialStateSync);
     return () => {

package/core/proxy-service.d.ts

@@ -2,8 +2,25 @@ import { PageContextState, ProxyTarget } from "@wavemaker-ai/react-runtime/types
 import { OverriddenPropsRegistry } from "@wavemaker-ai/react-runtime/core/script-registry";
 import BaseAppProps from "../higherOrder/BaseAppProps";
 import { FormFieldProps } from "../components/data/form/form-field/props";
+import type { UseFormSetValue } from "react-hook-form";
+/** True when `value` is a built-in that breaks if wrapped in a reactivity Proxy. */
+export declare const isNonProxyableBuiltin: (value: object) => boolean;
 export declare function clearPageWidgetProxyCache(widgetsProxy: object | null | undefined): void;
 export declare const createWidgetProxy: (widget: any, widgetName: string, setPageContext: any, overriddenPropsRegistry?: OverriddenPropsRegistry) => any;
 export declare const createPageProxy: (target: ProxyTarget, setPageContext: React.Dispatch<React.SetStateAction<PageContextState>>, overriddenPropsRegistry?: OverriddenPropsRegistry) => ProxyTarget;
 export declare const createStateProxy: (obj: PageContextState | BaseAppProps, path: string[], setPageContext: React.Dispatch<React.SetStateAction<PageContextState>> | React.Dispatch<React.SetStateAction<BaseAppProps>>, overriddenPropsRegistry?: OverriddenPropsRegistry) => ProxyTarget;
-export declare const createFormFieldProxy: (formField: FormFieldProps, setState: React.Dispatch<React.SetStateAction<FormFieldProps>>, overriddenItemsRef: React.MutableRefObject<Record<string, any>>, formProxy: any) => any;
+/**
+ * Distinct fields with their canonical registry key - a field is stored under several keys,
+ * so dedupe by identity and keep the first (canonical) key. Iterate this, not Object.keys().
+ */
+export declare const getFormFieldEntries: (formfields: Record<string, any> | undefined) => {
+    key: string;
+    field: any;
+}[];
+/** Distinct field objects in registration order. */
+export declare const getFormFieldList: (formfields: Record<string, any> | undefined) => any[];
+/** Hidden `<name>_formWidget` lookup alias, so registry iteration yields one entry per field (as in Angular). */
+export declare const defineFieldAlias: (alias: string, widget: any, ...registries: any[]) => void;
+export declare const createFormFieldProxy: (formField: FormFieldProps, setState: React.Dispatch<React.SetStateAction<FormFieldProps>>, overriddenItemsRef: React.MutableRefObject<Record<string, any>>, formProxy: any, formRef?: {
+    setValue?: UseFormSetValue<any>;
+}) => any;

package/core/proxy-service.js

@@ -27,6 +27,32 @@ import { ServiceVariable } from "../variables/service-variable";
 import LiveVariable from "../variables/live-variable";
 import { ModelVariable } from "../variables/model-variable";
 import CrudVariable from "../variables/crud-variable";
+const NON_PROXYABLE_TAGS = /* @__PURE__ */ new Set([
+  "[object AbortController]",
+  "[object AbortSignal]",
+  "[object ArrayBuffer]",
+  "[object Blob]",
+  "[object Date]",
+  "[object Error]",
+  "[object File]",
+  "[object FileList]",
+  "[object FormData]",
+  "[object Headers]",
+  "[object Map]",
+  "[object Promise]",
+  "[object RegExp]",
+  "[object Request]",
+  "[object Response]",
+  "[object Set]",
+  "[object SharedArrayBuffer]",
+  "[object URL]",
+  "[object URLSearchParams]",
+  "[object WeakMap]",
+  "[object WeakRef]",
+  "[object WeakSet]"
+]);
+const isNonProxyableBuiltin = (value) => NON_PROXYABLE_TAGS.has(Object.prototype.toString.call(value)) || // Covers every TypedArray flavour plus DataView in one check.
+ArrayBuffer.isView(value);
 const proxyMap = /* @__PURE__ */ new WeakMap();
 const pageWidgetProxyCaches = /* @__PURE__ */ new WeakMap();
 function clearPageWidgetProxyCache(widgetsProxy) {
@@ -209,6 +235,7 @@ const createWidgetProxy = (widget, widgetName, setPageContext, overriddenPropsRe
   widget.__isProxy = true;
   const proxy = new Proxy(widget, {
     set(target, prop, value, receiver) {
+      var _a;
       if (typeof prop === "symbol" || prop === "prototype") {
         return Reflect.set(target, prop, value, receiver);
       }
@@ -224,10 +251,21 @@ const createWidgetProxy = (widget, widgetName, setPageContext, overriddenPropsRe
       }
       Reflect.set(target, prop, value, receiver);
       queueBatchedWidgetContextUpdate(widgetName, widget, prop, value, setPageContext);
+      if (prop === "className") {
+        Reflect.set(target, "class", value);
+        (_a = overriddenPropsRegistry == null ? void 0 : overriddenPropsRegistry.trackOverriddenProps) == null ? void 0 : _a.call(
+          overriddenPropsRegistry,
+          widgetName,
+          "class",
+          value,
+          widget["data-widget-id"]
+        );
+        queueBatchedWidgetContextUpdate(widgetName, widget, "class", value, setPageContext);
+      }
       return true;
     },
     get(target, prop, receiver) {
-      var _a;
+      var _a, _b, _c, _d;
       if (typeof prop === "symbol" || prop === "prototype") {
         return Reflect.get(target, prop, receiver);
       }
@@ -302,6 +340,10 @@ const createWidgetProxy = (widget, widgetName, setPageContext, overriddenPropsRe
         );
         return internalValue !== void 0 ? internalValue : widgetOverrides[prop];
       }
+      if (prop === "class" || prop === "className") {
+        const resolved = (_d = (_c = (_b = widgetOverrides == null ? void 0 : widgetOverrides.class) != null ? _b : Reflect.get(target, "class", receiver)) != null ? _c : widgetOverrides == null ? void 0 : widgetOverrides.className) != null ? _d : Reflect.get(target, "className", receiver);
+        return resolved != null ? resolved : "";
+      }
       if (isDOMElement(value)) {
         return value;
       }
@@ -487,7 +529,7 @@ const createStateProxy = (obj, path = [], setPageContext, overriddenPropsRegistr
       if (isDOMElement(value)) {
         return value;
       }
-      if (value instanceof Map || value instanceof Date) {
+      if (isNonProxyableBuiltin(value)) {
         return value;
       }
       if (Array.isArray(value)) {
@@ -550,28 +592,52 @@ const createStateProxy = (obj, path = [], setPageContext, overriddenPropsRegistr
     }
   });
 };
-const createFormFieldProxy = (formField, setState, overriddenItemsRef, formProxy) => {
+const getFormFieldEntries = (formfields) => {
+  const canonicalKeyByField = /* @__PURE__ */ new Map();
+  Object.entries(formfields != null ? formfields : {}).forEach(([key, field]) => {
+    if (field && !canonicalKeyByField.has(field)) canonicalKeyByField.set(field, key);
+  });
+  return [...canonicalKeyByField].map(([field, key]) => ({ key, field }));
+};
+const getFormFieldList = (formfields) => getFormFieldEntries(formfields).map(({ field }) => field);
+const defineFieldAlias = (alias, widget, ...registries) => registries.forEach(
+  (registry) => registry && Object.defineProperty(registry, alias, {
+    value: widget,
+    enumerable: false,
+    configurable: true,
+    writable: true
+  })
+);
+const createFormFieldProxy = (formField, setState, overriddenItemsRef, formProxy, formRef) => {
+  const { name, formKey } = formField;
+  const rhfKey = formKey || name;
   const fieldProxy = new Proxy(formField, {
     get: (target, prop) => {
+      if (prop === "setProperty") {
+        return function(key, value) {
+          fieldProxy[key] = value;
+          return this;
+        };
+      }
       return target[prop];
     },
     set: (target, prop, value) => {
       target[prop] = value;
       overriddenItemsRef.current[prop] = value;
       setState(__spreadValues({}, target));
+      if ((prop === "datavalue" || prop === "value") && rhfKey && (formRef == null ? void 0 : formRef.setValue)) {
+        formRef.setValue(rhfKey, value, { shouldValidate: false, shouldDirty: true });
+      }
       return true;
     }
   });
-  const name = formField.name;
-  const key = formField.formKey;
-  if (key) {
-    formProxy.formfields[key] = fieldProxy;
-    formProxy.formWidgets[key] = fieldProxy;
-  }
-  formProxy.formfields[`${name}_formWidget`] = fieldProxy;
-  formProxy.formWidgets[`${name}_formWidget`] = fieldProxy;
-  formProxy.formfields[`${name}`] = fieldProxy;
-  formProxy.formWidgets[`${name}`] = fieldProxy;
+  const { formfields, formWidgets } = formProxy;
+  [formKey, name].forEach((fieldKey) => {
+    if (!fieldKey) return;
+    formfields[fieldKey] = fieldProxy;
+    formWidgets[fieldKey] = fieldProxy;
+  });
+  defineFieldAlias(`${name}_formWidget`, fieldProxy, formfields, formWidgets);
   return fieldProxy;
 };
 export {
@@ -579,5 +645,9 @@ export {
   createFormFieldProxy,
   createPageProxy,
   createStateProxy,
-  createWidgetProxy
+  createWidgetProxy,
+  defineFieldAlias,
+  getFormFieldEntries,
+  getFormFieldList,
+  isNonProxyableBuiltin
 };

package/higherOrder/BaseApp.js

@@ -79,7 +79,8 @@ const BaseApp = (WrappedComponent, addAppScript, getAppVariables, appInfo = {})
       subscribe,
       targetPlatform: "WEB",
       hasOwnObjectProperty,
-      formatters
+      formatters,
+      i18nService
     }), appInfo), i18nServiceActions), i18nService));
     const appProxyRef = useRef(null);
     const sessionFailureRequestsRef = useRef([]);

package/higherOrder/BaseDateTime.js

@@ -235,7 +235,14 @@ const withBaseDateTime = (WrappedComponent) => {
       if (date == "CURRENT_DATE") {
         return /* @__PURE__ */ new Date();
       }
-      return typeof date === "string" ? moment(date).toDate() : date;
+      if (typeof date === "string") {
+        const parsed = moment(date).toDate();
+        return isNaN(parsed.getTime()) ? void 0 : parsed;
+      }
+      if (date instanceof Date) {
+        return isNaN(date.getTime()) ? void 0 : date;
+      }
+      return date;
     }, []);
     const handleKeyDown = useCallback((event) => {
       const arrowKeys = Object.values(ARROW_KEYS);