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

package/components/basic/richtexteditor/index.d.ts

@@ -78,6 +78,7 @@ declare const _default: React.ComponentType<{
     standalone?: boolean;
     formRef?: any;
     formKey?: string;
+    hideValidationMessage?: boolean;
     name: string;
     datavalue?: any;
     defaultvalue?: any;

package/components/basic/search/index.js

@@ -55,6 +55,7 @@ import {
   CustomTemplateCaption,
   useCustomTemplate
 } from "../../common/customTemplate";
+import { toPlainText } from "./utils";
 const DEFAULT_CLASS = "app-search input-group";
 const Search = React.forwardRef((props, ref) => {
   const _a = props, {
@@ -303,7 +304,7 @@ const Search = React.forwardRef((props, ref) => {
       const value2 = Array.isArray(datavalue) ? datavalue[0] : datavalue;
       if (value2) {
         const key = searchkey.split(",")[0] || searchkey;
-        const item = (getDisplayExpression == null ? void 0 : getDisplayExpression(value2)) || value2[key];
+        const item = toPlainText(getDisplayExpression == null ? void 0 : getDisplayExpression(value2)) || value2[key];
         if (item) {
           setQuery(item);
           handleQueryChange(item);
@@ -313,7 +314,7 @@ const Search = React.forwardRef((props, ref) => {
     } else if (datafield !== "All Fields" && datafield) {
       let findItem = normalizedData == null ? void 0 : normalizedData.find((item) => item.value === datavalue);
       if (findItem) {
-        let displayValue2 = (getDisplayExpression == null ? void 0 : getDisplayExpression(getSelectedItem(findItem))) || findItem.label;
+        let displayValue2 = toPlainText(getDisplayExpression == null ? void 0 : getDisplayExpression(getSelectedItem(findItem))) || findItem.label;
         setQuery(displayValue2);
         handleQueryChange(displayValue2);
         handleUpdateDatavalue(findItem);
@@ -342,7 +343,7 @@ const Search = React.forwardRef((props, ref) => {
         if (!key) return;
         const findItem = response.find((item) => item[key] == value2);
         if (findItem && Object.keys(findItem).length > 0) {
-          let displayValue2 = (getDisplayExpression == null ? void 0 : getDisplayExpression(getSelectedItem(findItem))) || findItem[key];
+          let displayValue2 = toPlainText(getDisplayExpression == null ? void 0 : getDisplayExpression(getSelectedItem(findItem))) || findItem[key];
           setQuery(displayValue2);
           handleQueryChange(displayValue2);
         }
@@ -816,7 +817,7 @@ const Search = React.forwardRef((props, ref) => {
     try {
       const item = JSON.parse(itemData);
       const selectedItem2 = getSelectedItem(item);
-      const displayVal = (getDisplayExpression == null ? void 0 : getDisplayExpression(selectedItem2)) || item.displayValue || item.label;
+      const displayVal = toPlainText(getDisplayExpression == null ? void 0 : getDisplayExpression(selectedItem2)) || item.displayValue || item.label;
       if (props.isSearchInChips) {
         setQuery("");
         handleQueryChange("");

package/components/basic/search/utils.d.ts

@@ -0,0 +1 @@
+export declare function toPlainText(value: any): any;

package/components/basic/search/utils.js

@@ -0,0 +1,9 @@
+import DOMPurify from "dompurify";
+function toPlainText(value) {
+  if (value == null) return value;
+  const str = String(value);
+  return /<[^>]+>/.test(str) ? DOMPurify.sanitize(str, { ALLOWED_TAGS: [] }) : str;
+}
+export {
+  toPlainText
+};

package/components/common/index.d.ts

@@ -3,3 +3,5 @@ export { WmSkeleton, SKELETON_REGISTRY, shouldShowSkeleton, useShouldShowSkeleto
 export type { WmSkeletonProps, SkeletonConfig } from "./wm-skeleton";
 export { WmAppIcon } from "./WmAppIcon";
 export type { WmAppIconProps } from "./WmAppIcon/props";
+export { PartialContentWrapper } from "./partial-content-wrapper";
+export type { PartialContentWrapperProps } from "./partial-content-wrapper";

package/components/common/index.js

@@ -6,8 +6,10 @@ import {
   useShouldShowSkeleton
 } from "./wm-skeleton";
 import { WmAppIcon } from "./WmAppIcon";
+import { PartialContentWrapper } from "./partial-content-wrapper";
 export {
   AppSpinner,
+  PartialContentWrapper,
   SKELETON_REGISTRY,
   WmAppIcon,
   WmSkeleton,

package/components/common/partial-content-wrapper.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from "react";
+export interface PartialContentWrapperProps {
+    content?: string;
+    children?: ReactNode;
+}
+/**
+ * Wraps a layout region's rendered partial in an `app-partial-{content}` div,
+ * matching the DOM produced by WmPartialContainer in preview so CSS scoped to
+ * that class (e.g. `.app-partial-header`) also applies in codegen builds.
+ * Used by the header/leftnav/rightnav/topnav/footer layout regions only.
+ */
+export declare const PartialContentWrapper: {
+    ({ content, children }: PartialContentWrapperProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/components/common/partial-content-wrapper.js

@@ -0,0 +1,11 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+const PartialContentWrapper = ({ content, children }) => {
+  if (!content) {
+    return /* @__PURE__ */ jsx(Fragment, { children });
+  }
+  return /* @__PURE__ */ jsx("div", { className: `app-partial-${content.toLowerCase()}`, children });
+};
+PartialContentWrapper.displayName = "PartialContentWrapper";
+export {
+  PartialContentWrapper
+};

package/components/container/index.js

@@ -42,7 +42,10 @@ import { clsx } from "clsx";
 import { withBaseWrapper } from "../../higherOrder/withBaseWrapper";
 import { useLayoutSize } from "../../hooks/useLayoutSize";
 import { removeInvalidAttributes } from "../../utils/attr";
-import { normalizeBackgroundImage } from "../../utils/style-utils";
+import {
+  normalizeBackgroundImage,
+  sanitizeStyleObject
+} from "../../utils/style-utils";
 import { publishPartialNamespaces, toHostWidgetProps } from "../../utils/partial-host-util";
 const DEFAULT_CLASS = "app-container";
 const WmContainerContext = createContext(void 0);
@@ -261,7 +264,7 @@ const WmContainer = (props) => {
       id,
       hidden: props.hidden || hostShouldHide
     }, removeInvalidAttributes(rest)), domEvents), { name }), {
-      style: __spreadValues(__spreadValues({}, containerStyles), conditionalstyle),
+      style: __spreadValues(__spreadValues({}, sanitizeStyleObject(containerStyles)), sanitizeStyleObject(conditionalstyle)),
       ref: containerRef
     }), direction ? { direction } : {}), {
       children: renderPartial ? renderPartial(restPartialProps, handleOnLoad) : children

package/components/container/tabs/index.js

@@ -26,6 +26,7 @@ import React, {
   useCallback,
   useContext,
   useEffect,
+  useLayoutEffect,
   useMemo,
   useRef,
   useState
@@ -169,6 +170,7 @@ const WmTabs = memo(
     const changeTab = (newIndex) => {
       if (newIndex >= 0 && newIndex < panesCount.current && newIndex !== currentSelectedIndex.current) {
         prevSelectedIndex.current = currentSelectedIndex.current;
+        currentSelectedIndex.current = newIndex;
         setSelectedIndex(newIndex);
         saveStateToStorage(newIndex);
         return true;
@@ -257,7 +259,7 @@ const WmTabs = memo(
         activeTab: getActiveTab(activeIndex)
       });
     };
-    useEffect(() => {
+    useLayoutEffect(() => {
       updateListener();
     }, [prev, next, goToTab]);
     const getStateFromStorage = () => {
@@ -395,7 +397,7 @@ const WmTabs = memo(
       });
       panesCount.current = tabIndex;
       return headers;
-    }, [dataset, paneHeaderOverrides]);
+    }, [dataset, paneHeaderOverrides, renderTabHeader]);
     const renderStaticTabs = React.useCallback(() => {
       const visibleChildren = filterVisibleChildren(children, hiddenTabNames);
       panesCount.current = visibleChildren.length;
@@ -555,7 +557,7 @@ const WmTabs = memo(
       "styles"
     ];
     return keys.every((key) => {
-      if (key === "children") {
+      if (key === "children" || key === "dataset") {
         return prev[key] === next[key];
       }
       return isEqual(prev[key], next[key]);

package/components/container/wizard/index.js

@@ -51,6 +51,7 @@ import { getFormData } from "../../../utils/form-utils";
 import { useParentFormData } from "../../data/form/form-context";
 import isEqual from "lodash-es/isEqual";
 import withStandalone from "../../../higherOrder/withStandalone";
+import { publishPartialNamespaces, toHostWidgetProps } from "../../../utils/partial-host-util";
 import {
   WmSkeleton,
   SKELETON_REGISTRY,
@@ -89,7 +90,9 @@ const WmWizardComponent = memo(
       width,
       height,
       render,
-      standalone = false
+      standalone = false,
+      viewParent,
+      prefab
     } = props;
     const [steps, setSteps] = useState([]);
     const [wizardMessage, setWizardMessage] = useState(message || { caption: "", type: "" });
@@ -99,6 +102,34 @@ const WmWizardComponent = memo(
     const navIndexRef = useRef(-1);
     const loadedStepNameRef = useRef(null);
     const [formReady, setFormReady] = useState(false);
+    const loadedStepPartialKeysRef = useRef(/* @__PURE__ */ new Set());
+    const currentStepRef = useRef(null);
+    const currentStepIndexRef = useRef(-1);
+    const handleStepPartialOnLoad = useCallback(
+      (widget, partialName) => {
+        var _a, _b, _c, _d;
+        if (!viewParent || !viewParent.Widgets) return;
+        const hostKey = ((_a = currentStepRef.current) == null ? void 0 : _a.name) || partialName;
+        if (!hostKey || loadedStepPartialKeysRef.current.has(hostKey)) return;
+        loadedStepPartialKeysRef.current.add(hostKey);
+        if (!widget || prefab) {
+          viewParent.Widgets[hostKey] = widget || props;
+        } else {
+          if (!viewParent.Widgets[hostKey]) {
+            viewParent.Widgets[hostKey] = toHostWidgetProps(props);
+          }
+          publishPartialNamespaces(viewParent.Widgets[hostKey], widget);
+        }
+        if (((_b = currentStepRef.current) == null ? void 0 : _b.name) === hostKey) {
+          (_d = (_c = currentStepRef.current) == null ? void 0 : _c.onLoad) == null ? void 0 : _d.call(
+            _c,
+            viewParent.Widgets[hostKey],
+            currentStepIndexRef.current
+          );
+        }
+      },
+      [viewParent, prefab]
+    );
     const parentFormContext = useParentFormData();
     const isInsideOuterForm = !!parentFormContext && Object.keys(parentFormContext).length > 0;
     const createDynamicSteps = useCallback(
@@ -146,6 +177,7 @@ const WmWizardComponent = memo(
       [defaultstepindex]
     );
     const currentStep = useMemo(() => steps.find((step) => step.active) || null, [steps]);
+    currentStepRef.current = currentStep;
     const visibleSteps = useMemo(() => steps.filter((step) => step.show), [steps]);
     const visibleStepsRef = useRef(visibleSteps);
     visibleStepsRef.current = visibleSteps;
@@ -157,6 +189,7 @@ const WmWizardComponent = memo(
     }, [currentStep, visibleSteps]);
     useEffect(() => {
       navIndexRef.current = currentStepIndex;
+      currentStepIndexRef.current = currentStepIndex;
     }, [currentStepIndex]);
     const hasNextStep = useMemo(
       () => currentStepIndex < visibleSteps.length - 1,
@@ -780,7 +813,7 @@ const WmWizardComponent = memo(
                       className: clsx("app-wizard-step-content", {
                         active: step.active
                       }),
-                      children: (currentStep == null ? void 0 : currentStep.name) && step.active && currentStep.render ? currentStep.render(step, index) : step.children
+                      children: (currentStep == null ? void 0 : currentStep.name) && step.active && currentStep.render ? currentStep.render(step, handleStepPartialOnLoad) : step.children
                     }
                   )
                 ) : (
@@ -796,7 +829,7 @@ const WmWizardComponent = memo(
                       }),
                       listener,
                       isInsideWizard: true,
-                      children: (currentStep == null ? void 0 : currentStep.name) && step.active && currentStep.render ? currentStep.render(step, index) : step.children
+                      children: (currentStep == null ? void 0 : currentStep.name) && step.active && currentStep.render ? currentStep.render(step, handleStepPartialOnLoad) : step.children
                     }
                   )
                 )

package/components/container/wizard/props.d.ts

@@ -49,7 +49,7 @@ export interface WizardStepData extends Record<string, unknown> {
     isValid: boolean;
     isInitialized: boolean;
     content?: ReactNode;
-    render?: (step: WizardStepData, stepIndex?: number, dataset?: Record<string, unknown>[]) => ReactNode;
+    render?: (step: WizardStepData, onLoad?: (widget?: Record<string, unknown>, partialName?: string) => void) => ReactNode;
     dynamicStepIndex?: number;
     isdynamic?: boolean;
     onLoad?: (step: WizardStepData, stepIndex: number) => void;
@@ -256,7 +256,7 @@ export interface WmWizardStepProps {
     ref?: React.Ref<unknown>;
     className?: string;
     props?: Record<string, unknown>;
-    render?: (item: Record<string, unknown>, index?: number, dataset?: Record<string, unknown>[]) => ReactNode;
+    render?: (props: Record<string, unknown>, onLoad?: (widget?: Record<string, unknown>, partialName?: string) => void) => ReactNode;
     listener?: Record<string, unknown>;
 }
 /**

package/components/data/form/dynamic-fields/WmxDynamicFormField.js

@@ -30,38 +30,24 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import { jsx } from "react/jsx-runtime";
-import { useEffect, useMemo, useState } from "react";
+import { useMemo } from "react";
 import WmText from "../../../input/text";
 import withFormController from "../form-controller/withFormController";
-import { loadWmxComponent, getWmxComponentName } from "../../../../utils/wmx.utils";
+import { getWmxComponentName, getWmxModule } from "../../../../utils/wmx.utils";
 const WmxDynamicFormField = ({ field, fieldProps }) => {
-  var _b;
+  var _b, _c, _d;
   const componentName = getWmxComponentName(String((field == null ? void 0 : field.widget) || ""));
   const _a = fieldProps, { class: className } = _a, restProps = __objRest(_a, ["class"]);
   const resolvedClassName = className || fieldProps.className;
-  const [RawComponent, setRawComponent] = useState(null);
-  useEffect(() => {
-    if (!componentName) return;
-    let isActive = true;
-    loadWmxComponent(componentName).then((component) => {
-      if (isActive) {
-        setRawComponent(component);
-      }
-    }).catch((e) => {
-      console.error(e);
-    });
-    return () => {
-      isActive = false;
-    };
-  }, [componentName]);
-  const EnhancedWmxComponent = useMemo(() => {
-    if (!RawComponent) return null;
-    return withFormController(RawComponent);
-  }, [RawComponent]);
+  const RawComponent = componentName ? (_c = (_b = getWmxModule()) == null ? void 0 : _b[`Wmx${componentName}`]) != null ? _c : null : null;
+  const EnhancedWmxComponent = useMemo(
+    () => RawComponent ? withFormController(RawComponent) : null,
+    [RawComponent]
+  );
   if (!EnhancedWmxComponent) {
     return /* @__PURE__ */ jsx(WmText, __spreadProps(__spreadValues({ name: field == null ? void 0 : field.name }, restProps), { className: resolvedClassName }));
   }
-  const dataset = (_b = field == null ? void 0 : field.dataset) != null ? _b : fieldProps == null ? void 0 : fieldProps.dataset;
+  const dataset = (_d = field == null ? void 0 : field.dataset) != null ? _d : fieldProps == null ? void 0 : fieldProps.dataset;
   return /* @__PURE__ */ jsx(
     EnhancedWmxComponent,
     __spreadProps(__spreadValues({

package/components/data/form/form-controller/props.d.ts

@@ -121,6 +121,8 @@ export interface WithFormControllerProps {
     standalone?: boolean;
     formRef?: any;
     formKey?: string;
+    /** Suppress the inline help-block; set by hosts that show validation errors their own way. */
+    hideValidationMessage?: boolean;
     name: string;
     datavalue?: any;
     defaultvalue?: any;

package/components/data/form/form-controller/utils.js

@@ -30,6 +30,7 @@ function resolveValue(value) {
   }
   return value === null ? void 0 : value;
 }
+const toPatternSource = (regexp) => regexp instanceof RegExp ? regexp.source : regexp;
 function extractDynamicValidationProps(validators, rules) {
   const result = {
     required: rules.required,
@@ -55,8 +56,8 @@ function extractDynamicValidationProps(validators, rules) {
         result.maxchars = resolveValue(validator.validator);
         break;
       case "regexp":
-        result.regexp = resolveValue(
-          validator.validator
+        result.regexp = toPatternSource(
+          resolveValue(validator.validator)
         );
         break;
       case "minvalue":

package/components/data/form/form-controller/validation-contrustor.js

@@ -58,6 +58,82 @@ const parseTime = (time) => {
   }
   return null;
 };
+const resolveValidatorValue = (validator) => {
+  if (!isFunction(validator)) return validator;
+  try {
+    return validator();
+  } catch (error) {
+    console.warn("Error resolving validator value:", error);
+    return void 0;
+  }
+};
+const parseDateValue = (value) => {
+  if (value === null || value === void 0 || value === "") return null;
+  if (isDate(value)) {
+    const parsed = moment(value);
+    return parsed.isValid() ? parsed : null;
+  }
+  if (isNumber(value)) {
+    const parsed = moment(value);
+    return parsed.isValid() ? parsed : null;
+  }
+  if (!isString(value)) return null;
+  const trimmed = value.trim();
+  if (trimmed === "") return null;
+  if (/^-?\d+$/.test(trimmed)) {
+    const parsed = moment(Number(trimmed));
+    return parsed.isValid() ? parsed : null;
+  }
+  const iso = moment(trimmed, moment.ISO_8601, true);
+  if (iso.isValid()) return iso;
+  const loose = moment(new Date(trimmed));
+  return loose.isValid() ? loose : null;
+};
+const toMinutesOfDay = (value) => {
+  if (value === null || value === void 0 || value === "") return null;
+  if (isString(value)) {
+    const fromTime = parseTime(value);
+    if (fromTime !== null) return fromTime;
+  }
+  const parsed = parseDateValue(value);
+  return parsed ? parsed.hours() * 60 + parsed.minutes() : null;
+};
+const toNumberList = (validator) => {
+  const raw = isArray(validator) ? validator : isString(validator) ? validator.split(",") : [];
+  return raw.map((entry) => Number(String(entry).trim())).filter((n) => !isNaN(n));
+};
+const toDateList = (validator) => {
+  const raw = isArray(validator) ? validator : isString(validator) ? validator.split(",") : [];
+  return raw.map((entry) => parseDateValue(isString(entry) ? entry.trim() : entry)).filter((entry) => entry !== null);
+};
+const dateTimeRule = (key, check) => {
+  return (config, rules, form, fieldName) => {
+    rules.validate = __spreadProps(__spreadValues({}, rules.validate), {
+      [key]: async (value) => {
+        if (value === null || value === void 0 || value === "") return true;
+        const bound = resolveValidatorValue(config.validator);
+        if (bound === null || bound === void 0 || bound === "") return true;
+        const result = check(value, bound);
+        if (result === null) {
+          console.warn(`Could not evaluate "${key}" validator for field "${fieldName}":`, {
+            value,
+            validator: bound
+          });
+          return true;
+        }
+        if (result) return true;
+        return await resolveErrorMessage(config.errorMessage, value, fieldName, form);
+      }
+    });
+    return rules;
+  };
+};
+const compareDay = (value, bound, ok) => {
+  const parsedValue = parseDateValue(value);
+  const parsedBound = parseDateValue(bound);
+  if (!parsedValue || !parsedBound) return null;
+  return ok(parsedValue.startOf("day").valueOf(), parsedBound.startOf("day").valueOf());
+};
 const validationHandlers = {
   required: (config, rules, form, fieldName) => {
     if (config.validator) {
@@ -170,7 +246,42 @@ const validationHandlers = {
       };
     }
     return rules;
-  }
+  },
+  mindate: dateTimeRule(
+    "minDate",
+    (value, bound) => compareDay(value, bound, (v, b) => v >= b)
+  ),
+  maxdate: dateTimeRule(
+    "maxDate",
+    (value, bound) => compareDay(value, bound, (v, b) => v <= b)
+  ),
+  mintime: dateTimeRule("minTime", (value, bound) => {
+    const current = toMinutesOfDay(value);
+    const min = toMinutesOfDay(bound);
+    if (current === null || min === null) return null;
+    return current >= min;
+  }),
+  maxtime: dateTimeRule("maxTime", (value, bound) => {
+    const current = toMinutesOfDay(value);
+    const max = toMinutesOfDay(bound);
+    if (current === null || max === null) return null;
+    return current <= max;
+  }),
+  excludedays: dateTimeRule("excludeDays", (value, bound) => {
+    const parsed = parseDateValue(value);
+    if (!parsed) return null;
+    const days = toNumberList(bound);
+    if (days.length === 0) return true;
+    return !days.includes(parsed.day());
+  }),
+  excludedates: dateTimeRule("excludeDates", (value, bound) => {
+    const parsed = parseDateValue(value);
+    if (!parsed) return null;
+    const excluded = toDateList(bound);
+    if (excluded.length === 0) return true;
+    const day = parsed.startOf("day").valueOf();
+    return !excluded.some((entry) => entry.startOf("day").valueOf() === day);
+  })
 };
 const isValidatorConfig = (config) => {
   return config && typeof config === "object" && !Array.isArray(config) && typeof config !== "function" && isString(config.type) && (isString(config.errorMessage) || isFunction(config.errorMessage)) && config.validator !== void 0;

package/components/data/form/form-controller/withFormController.js

@@ -246,7 +246,7 @@ const withFormController = (WrappedComponent) => {
           fieldRef.current = field;
           const processedValue = processFieldValue(field.value, type, props.datafield);
           const errorState = getErrorState(fieldState, validationType, touched);
-          const isExplicitFormField = props.formfield === true || props.formfield === "true";
+          const isExplicitFormField = !props.hideValidationMessage && (props.formfield === true || props.formfield === "true");
           let valueToUse;
           if (processedValue !== void 0) {
             valueToUse = processedValue;

package/components/data/form/form-field/index.js

@@ -126,14 +126,14 @@ const WmFormField = memo(
       });
     }, [props.dataset, props.datafield, props.displayfield, props.displaylabel, props.searchkey]);
     function renderFormFields() {
-      var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l, _m;
+      var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
       if (props.formRef) {
         const errors = (_a2 = props.formRef) == null ? void 0 : _a2.errors;
         const formKey = (_b2 = props.formKey) != null ? _b2 : props.name;
         const fieldError = formKey && errors ? get(errors, formKey) : void 0;
         const invalid = Boolean(fieldError);
         const invalidCls = invalid ? " text-danger " : "";
-        return /* @__PURE__ */ jsx(Fragment, { children: (_m = props == null ? void 0 : props.renderFormFields) == null ? void 0 : _m.call(props, __spreadProps(__spreadValues(__spreadValues({}, proxyProps), overriddenItemsRef.current), {
+        return /* @__PURE__ */ jsx(Fragment, { children: (_n = props == null ? void 0 : props.renderFormFields) == null ? void 0 : _n.call(props, __spreadProps(__spreadValues(__spreadValues({}, proxyProps), overriddenItemsRef.current), {
           // proxyProps snapshots onChange once at mount; nothing resyncs it, so a
           // handler assigned after mount (e.g. from a page's onReady) is never seen
           // unless we read the live prop here, same as onTrailingiconclick below.
@@ -156,7 +156,10 @@ const WmFormField = memo(
           onTrailingiconclick: (_i = overriddenItemsRef.current.onTrailingiconclick) != null ? _i : props.onTrailingiconclick,
           trailingiconurl: (_j = overriddenItemsRef.current.trailingiconurl) != null ? _j : props.trailingiconurl,
           onLeadingiconclick: (_k = overriddenItemsRef.current.onLeadingiconclick) != null ? _k : props.onLeadingiconclick,
-          leadingiconurl: (_l = overriddenItemsRef.current.leadingiconurl) != null ? _l : props.leadingiconurl
+          leadingiconurl: (_l = overriddenItemsRef.current.leadingiconurl) != null ? _l : props.leadingiconurl,
+          styles: {},
+          style: {},
+          limitdisplaytext: (_m = overriddenItemsRef.current.limitdisplaytext) != null ? _m : props.limitdisplaytext
         })) });
       } else {
         return null;

package/components/data/form/form-field/props.d.ts

@@ -211,6 +211,7 @@ export interface FormFieldProps {
     leadingiconurl?: string;
     onLeadingiconclick?: (...args: any[]) => void;
     onChange?: (...args: any[]) => void;
+    limitdisplaytext?: string;
 }
 /**
  * Combined props for the WmFormField component, including base WaveMaker props.

package/components/data/list/components/ListItemWithTemplate.js

@@ -60,7 +60,7 @@ const ListItemWithTemplate = ({
     },
     [WidgetProxy, name]
   );
-  if (isPlainObject(item)) {
+  if (isPlainObject(item) && item.selected !== isActive) {
     item.selected = isActive;
   }
   const templateContent = renderItem ? renderItem(item, globalIndex != null ? globalIndex : index, WidgetProxy[name], getCurrentItemWidgets) : itemTemplate || /* @__PURE__ */ jsx(MediaWmListtemplate, {});

package/components/data/list/index.js

@@ -339,7 +339,7 @@ const WmList = (props) => {
     if (navigation === LIST_NAVIGATION_TYPES.NONE || !navigation) {
       paginationState.setCurrentPageSize(resolvedDataset.length);
     }
-  }, [resolvedDataset.length, pagesize, paginationState]);
+  }, [resolvedDataset.length, pagesize, paginationState.setCurrentPageSize]);
   const effectiveStateHandler = navigation === LIST_NAVIGATION_TYPES.ON_DEMAND || navigation === LIST_NAVIGATION_TYPES.SCROLL ? "none" : statehandler;
   const stateManager = useListStateManager({
     name,