@wavemaker-ai/react-runtime 1.0.0-rc.322 → 1.0.0-rc.326

package/components/data/table/utils/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { type CSSProperties } from "react";
 import { WmTableColumnProps, WmTableRowActionProps, WmTableRowProps, WmTableActionProps, ValidationResult } from "../props";
 declare const formWidgets: readonly ["WmText", "WmTextarea", "WmCheckbox", "WmSlider", "WmCurrency", "WmSwitch", "WmSelect", "WmCheckboxSet", "WmRadioSet", "WmDate", "WmTime", "WmTimestamp", "WmRating", "WmDatetime", "WmSearch", "WmChips", "WmColorPicker"];
 type FormWidgetType = (typeof formWidgets)[number];
@@ -46,6 +46,8 @@ export declare const parseTableStructureWithGroups: (children: React.ReactNode)
 export declare const flattenTableStructure: (structure: TableStructureItem[]) => WmTableColumnProps[];
 export declare const parseTableRowActions: (children: React.ReactNode) => WmTableRowActionProps[];
 export declare const parseTableActions: (children: React.ReactNode) => WmTableActionProps[];
+/** Resolve row-bound expansion props. Uses precomputed map first, then tableRowProps(rowData) fallback. */
+export declare const getRowExpansionConfig: (config: WmTableRowProps | null, rowId: string, rowData?: any) => WmTableRowProps | null;
 export declare const parseTableRowExpansion: (children: React.ReactNode) => WmTableRowProps | null;
 export declare const isEditAction: (actionKey: string) => boolean;
 export declare const isDeleteAction: (actionKey: string) => boolean;
@@ -95,8 +97,18 @@ export declare const INTERNAL_PROPERTIES: string[];
  */
 export declare const cleanRowData: (data: any) => any;
 export declare const parseWidth: (width: string | number, fallbackSize?: number) => number;
+/**
+ * Angular datatable.js hides show:false columns via jQuery `.hide()` / `.show()`
+ * (sets element.style.display = "none"), not by removing th/td from the DOM.
+ * setColGroupWidths also hides the matching `<col>` ($headerCol.hide()).
+ */
+export declare function isColumnDomHidden(meta?: Record<string, unknown>): boolean;
+/** Angular setColGroupWidths: jQuery `.hide()` plus width 0 on col for table-layout:fixed. */
+export declare function getDomHiddenColStyle(meta?: Record<string, unknown>): CSSProperties | undefined;
+/** Inline style for hidden th/td — display:none and zero box so flex sizing cannot leak width. */
+export declare function getDomHiddenCellStyle(meta?: Record<string, unknown>): CSSProperties | undefined;
 export declare const getColClass: (colClass: string, rowData: any, columnName: string) => string;
-export { TABLE_CSS_CLASSES, TABLE_DATA_STATES, TABLE_MESSAGES, INTERACTIVE_CLASSES, INTERACTIVE_ROLES, INTERACTIVE_DATA_ROLES, INTERACTIVE_TAG_NAMES, DYNAMIC_COLUMNS_CONFIG, UNSUPPORTED_STATE_PERSISTENCE_TYPES, } from "./constants";
+export { TABLE_CSS_CLASSES, TABLE_DATA_STATES, TABLE_MESSAGES, INTERACTIVE_CLASSES, INTERACTIVE_ROLES, INTERACTIVE_DATA_ROLES, INTERACTIVE_TAG_NAMES, UNSUPPORTED_STATE_PERSISTENCE_TYPES, } from "./constants";
 export { renderDisplayCell } from "./renderDisplayCell";
 export { buildSelectionColumns } from "./buildSelectionColumns";
 export { validateField, resetValidationState, updateValidationErrors } from "./validation";

package/components/data/table/utils/index.js

@@ -311,26 +311,17 @@ const flattenTableStructure = (structure) => {
   });
   return columns;
 };
-const parseTableRowActions = (children) => {
-  const actions = [];
-  React.Children.forEach(children, (child) => {
-    var _a;
-    if (child && child.props && child.props.name && (child.props.name.includes("wm_table_row_action") || ((_a = child.type) == null ? void 0 : _a.displayName) === "WmTableRowAction")) {
-      const props = get(child, "props", {});
-      const actionProps = assign({}, props);
-      if (child.key) {
-        actionProps.key = child.key;
-      }
-      actions.push(actionProps);
-    }
-  });
-  return actions;
+const isTableChildOfType = (child, namePattern, componentToken) => {
+  var _a;
+  if (!((_a = child == null ? void 0 : child.props) == null ? void 0 : _a.name)) return false;
+  const propName = child.props.name;
+  const displayName = getChildComponentDisplayName(child);
+  return propName.includes(namePattern) || displayName.includes(componentToken);
 };
-const parseTableActions = (children) => {
+const parseTableChildActions = (children, namePattern, componentToken) => {
   const actions = [];
   React.Children.forEach(children, (child) => {
-    var _a;
-    if (child && child.props && child.props.name && (child.props.name.includes("wm_table_action") || ((_a = child.type) == null ? void 0 : _a.displayName) === "WmTableAction")) {
+    if (isTableChildOfType(child, namePattern, componentToken)) {
       const props = get(child, "props", {});
       const actionProps = assign({}, props);
       if (child.key) {
@@ -341,6 +332,8 @@ const parseTableActions = (children) => {
   });
   return actions;
 };
+const parseTableRowActions = (children) => parseTableChildActions(children, "wm_table_row_action", "WmTableRowAction");
+const parseTableActions = (children) => parseTableChildActions(children, "wm_table_action", "WmTableAction");
 function isTableRowComponent(child) {
   if (!(child == null ? void 0 : child.type)) return false;
   const name = child.type.displayName || child.type.name || "";
@@ -353,6 +346,11 @@ function isTableRowComponent(child) {
   }
   return false;
 }
+const getRowExpansionConfig = (config, rowId, rowData) => {
+  if (!config) return null;
+  const overrides = typeof config.tableRowProps === "function" && rowData !== void 0 ? config.tableRowProps(rowData) : {};
+  return __spreadValues(__spreadValues({}, config), overrides);
+};
 const parseTableRowExpansion = (children) => {
   let rowExpansionConfig = null;
   React.Children.forEach(children, (child) => {
@@ -570,6 +568,32 @@ const parseWidth = (width, fallbackSize = 150) => {
   }
   return columnSize;
 };
+function isColumnDomHidden(meta) {
+  return !!(meta == null ? void 0 : meta.domHidden);
+}
+function getDomHiddenColStyle(meta) {
+  if (!isColumnDomHidden(meta)) {
+    return void 0;
+  }
+  return {
+    display: "none",
+    width: 0,
+    minWidth: 0,
+    maxWidth: 0
+  };
+}
+function getDomHiddenCellStyle(meta) {
+  if (!isColumnDomHidden(meta)) {
+    return void 0;
+  }
+  return {
+    display: "none",
+    width: 0,
+    minWidth: 0,
+    maxWidth: 0,
+    padding: 0
+  };
+}
 const getColClass = (colClass, rowData, columnName) => {
   if (!colClass || typeof colClass !== "string") {
     return "";
@@ -611,7 +635,6 @@ import {
   INTERACTIVE_ROLES,
   INTERACTIVE_DATA_ROLES,
   INTERACTIVE_TAG_NAMES,
-  DYNAMIC_COLUMNS_CONFIG,
   UNSUPPORTED_STATE_PERSISTENCE_TYPES
 } from "./constants";
 import { renderDisplayCell } from "./renderDisplayCell";
@@ -642,7 +665,6 @@ import {
   convertFilterObjectToArray
 } from "./table-helpers";
 export {
-  DYNAMIC_COLUMNS_CONFIG,
   INTERACTIVE_CLASSES,
   INTERACTIVE_DATA_ROLES,
   INTERACTIVE_ROLES,
@@ -673,6 +695,9 @@ export {
   getButtonClasses,
   getChildComponentDisplayName,
   getColClass,
+  getDomHiddenCellStyle,
+  getDomHiddenColStyle,
+  getRowExpansionConfig,
   getRowIdsFromDataset,
   getSpacingClasses,
   getTableActionButtonClass,
@@ -683,6 +708,7 @@ export {
   hasInteractiveAttributes,
   hasInteractiveClass,
   isAddNewAction,
+  isColumnDomHidden,
   isColumnVisibleForViewport,
   isDataColumn,
   isDeleteAction,

package/components/dialogs/alert-dialog/index.d.ts

@@ -71,6 +71,7 @@ declare const WmAlertDialogStandalone: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("../withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
@@ -156,6 +157,7 @@ declare const _default: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("../withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/components/dialogs/confirm-dialog/index.d.ts

@@ -72,6 +72,7 @@ declare const WmConfirmDialogStandalone: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
@@ -158,6 +159,7 @@ declare const _default: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/components/dialogs/dialog/index.d.ts

@@ -76,6 +76,7 @@ declare const WmDialogStandalone: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
@@ -168,6 +169,7 @@ declare const _default: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/components/dialogs/dialog/index.js

@@ -18,13 +18,14 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { jsx, jsxs } from "react/jsx-runtime";
-import { memo } from "react";
+import { memo, Suspense } from "react";
 import clsx from "clsx";
 import withBaseWrapper from "../../../higherOrder/withBaseWrapper";
 import Dialog from "..";
 import BaseDialog from "../withDialogWrapper";
 import { WmDialogHeader } from "../dialog-header";
 import { WmDialogContent } from "../dialog-content";
+import { WmSpinner } from "../../basic/spinner";
 const WmDialog = memo(
   (props) => {
     var _a;
@@ -65,7 +66,7 @@ const WmDialog = memo(
               closable: props.closable
             }
           ),
-          props.children
+          /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(WmSpinner, { show: true, name: "dialog" }), children: props.children })
         ] }))
       })
     );

package/components/dialogs/dialog-actions/index.d.ts

@@ -65,5 +65,6 @@ declare const _default: import("react").ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

package/components/dialogs/dialog-body/index.d.ts

@@ -64,5 +64,6 @@ declare const _default: import("react").ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

package/components/dialogs/dialog-content/index.d.ts

@@ -67,5 +67,6 @@ declare const _default: import("react").ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

package/components/dialogs/dialog-header/index.d.ts

@@ -82,5 +82,6 @@ declare const _default: React.ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

package/components/dialogs/dialog-header/index.js

@@ -1,6 +1,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { IconButton, Typography, Box } from "@mui/material";
 import withBaseWrapper from "../../../higherOrder/withBaseWrapper";
+import { WmAppIcon } from "../../common/WmAppIcon";
 const DEFAULT_ICON_DIMENSIONS = "21px";
 const DEFAULT_CLASS = "app-dialog-header modal-header";
 const WmDialogHeader = (props) => {
@@ -40,19 +41,17 @@ const WmDialogHeader = (props) => {
             sx: { display: "flex", alignItems: "center" },
             className: "app-dialog-title modal-title",
             children: [
-              isDialog ? iconurl && iconurl !== "" ? /* @__PURE__ */ jsx(
-                "img",
+              isDialog ? iconclass && iconclass.trim() !== "" || iconurl && iconurl !== "" ? /* @__PURE__ */ jsx(
+                WmAppIcon,
                 {
-                  src: iconurl,
-                  alt: "dialog icon",
-                  style: { width: iconwidth, height: iconheight, margin: iconmargin }
-                }
-              ) : iconclass && iconclass.trim() !== "" ? /* @__PURE__ */ jsx(
-                Box,
-                {
-                  component: "i",
-                  className: iconclass,
-                  style: { width: iconwidth, height: iconheight, margin: iconmargin }
+                  iconclass,
+                  iconurl,
+                  prefabName: props.prefabName,
+                  iconStyle: {
+                    width: iconwidth,
+                    height: iconheight,
+                    margin: iconmargin
+                  }
                 }
               ) : null : /* @__PURE__ */ jsx(Fragment, {}),
               /* @__PURE__ */ jsx(Box, { component: "span", className: "dialog-heading", id: props.titleid, children: heading }),

package/components/dialogs/iframe-dialog/index.d.ts

@@ -81,6 +81,7 @@ declare const WmIframeDialogStandalone: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
@@ -176,6 +177,7 @@ declare const _default: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/components/dialogs/login-dialog/index.d.ts

@@ -17,6 +17,7 @@ declare const WmLoginDialogStandalone: {
         sheet?: boolean;
         invokeEventCallback?: (eventName: string, data?: any) => void;
         appLocale?: any;
+        iconurl?: string;
         isopen?: boolean;
         close?: (event?: React.SyntheticEvent) => void;
         openDialog?: (event?: React.SyntheticEvent) => void;
@@ -78,6 +79,7 @@ declare const WmLoginDialogStandalone: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("../withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
@@ -100,6 +102,7 @@ declare const _default: {
         sheet?: boolean;
         invokeEventCallback?: (eventName: string, data?: any) => void;
         appLocale?: any;
+        iconurl?: string;
         isopen?: boolean;
         close?: (event?: React.SyntheticEvent) => void;
         openDialog?: (event?: React.SyntheticEvent) => void;
@@ -161,6 +164,7 @@ declare const _default: {
         prefabName?: string;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("../withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/components/dialogs/login-dialog/index.js

@@ -267,7 +267,8 @@ const WmLoginDialog = (props) => {
             heading: title,
             iconclass,
             onClose: close != null ? close : (() => {
-            })
+            }),
+            iconurl: props.iconurl
           }
         ),
         /* @__PURE__ */ jsx(WmDialogBody, { name: `${name}_body`, listener, children: /* @__PURE__ */ jsxs(

package/components/dialogs/login-dialog/props.d.ts

@@ -91,6 +91,7 @@ export interface WmLoginDialogOwnProps extends WmDialogInjectedProps {
      * Application locale object injected at runtime.
      */
     appLocale?: any;
+    iconurl?: string;
 }
 /**
  * Combined props for the WmLoginDialog component.

package/components/dialogs/page-dialog/index.d.ts

@@ -13,6 +13,7 @@ declare const WmPageDialogStandalone: {
         onClose?: (event?: React.SyntheticEvent | {}) => void;
         onOkClick?: (event?: React.SyntheticEvent) => void;
         onOk?: (event?: React.SyntheticEvent) => void;
+        iconurl?: string;
         isopen?: boolean;
         close?: (event?: React.SyntheticEvent) => void;
         openDialog?: (event?: React.SyntheticEvent) => void;
@@ -73,6 +74,7 @@ declare const WmPageDialogStandalone: {
         dataset?: any;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
@@ -100,6 +102,7 @@ declare const _default: {
         onClose?: (event?: React.SyntheticEvent | {}) => void;
         onOkClick?: (event?: React.SyntheticEvent) => void;
         onOk?: (event?: React.SyntheticEvent) => void;
+        iconurl?: string;
         isopen?: boolean;
         close?: (event?: React.SyntheticEvent) => void;
         openDialog?: (event?: React.SyntheticEvent) => void;
@@ -160,6 +163,7 @@ declare const _default: {
         dataset?: any;
         loading?: boolean;
         showSkeleton?: boolean;
+        widget?: string;
     } & import("@wavemaker-ai/react-runtime/components/dialogs/withDialogWrapper").BaseDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/components/dialogs/page-dialog/index.js

@@ -76,7 +76,8 @@ const WmPageDialog = (props) => {
             onClose: handleClose,
             closable: props.closable,
             name: "",
-            listener: {}
+            listener: {},
+            iconurl: props.iconurl
           }
         ),
         /* @__PURE__ */ jsx(WmDialogBody, { name: "", listener: {}, children: props.content && /* @__PURE__ */ jsx(

package/components/dialogs/page-dialog/props.d.ts

@@ -52,6 +52,7 @@ export interface WmPageDialogOwnProps extends WmDialogInjectedProps {
      * Callback fired for OK event.
      */
     onOk?: (event?: React.SyntheticEvent) => void;
+    iconurl?: string;
 }
 /**
  * Combined props for the WmPageDialog component.

package/components/form/button/index.d.ts

@@ -75,5 +75,6 @@ declare const _default: import("react").ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

package/components/form/button/index.js

@@ -29,10 +29,9 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useEffect, useRef } from "react";
 import clsx from "clsx";
-import Image from "next/image";
 import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 import Badge from "@mui/material/Badge";
@@ -40,9 +39,9 @@ import { withBaseWrapper } from "../../../higherOrder/withBaseWrapper";
 import {
   WmSkeleton,
   SKELETON_REGISTRY,
-  shouldShowSkeleton
+  useShouldShowSkeleton
 } from "../../common/wm-skeleton";
-import { prefixPrefabResourceUrl } from "../../../utils/resource-url";
+import { WmAppIcon } from "../../common/WmAppIcon";
 import { removeInvalidAttributes } from "../../../utils/attr";
 const DEFAULT_CLASS = "btn app-button";
 const WmButton = memo(
@@ -107,6 +106,7 @@ const WmButton = memo(
     ]);
     const safeCaption = (caption == null ? void 0 : caption.toString().replace(/undefined|null/g, "")) || "";
     const btnRef = useRef(null);
+    const showSkeleton = useShouldShowSkeleton(props.loading, props.showSkeleton);
     useEffect(() => {
       if (!shortcutkey) return;
       const handleGlobalKeyDown = (e) => {
@@ -179,7 +179,7 @@ const WmButton = memo(
       }
     };
     const EVENTS = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, onBlur && { onBlur: handleOnBlur }), onFocus && { onFocus: handleOnFocus }), onMouseEnter && { onMouseEnter: handleMouseEnter }), onMouseLeave && { onMouseLeave: handleMouseLeave }), onDoubleClick && { onDoubleClick: handleDoubleClick }), onKeydown && { onKeyDown: handleKeyDown }), onKeyup && { onKeyUp: handleKeyUp }), onClick && { onClick: handleClick }), onKeypress && { onKeyPress: handleKeyPress }), { onMouseDown: handleMouseDown });
-    if (shouldShowSkeleton(props.loading, props.showSkeleton))
+    if (showSkeleton)
       return /* @__PURE__ */ jsx(WmSkeleton, __spreadProps(__spreadValues({}, SKELETON_REGISTRY["WmButton"]), { className, styles }));
     return /* @__PURE__ */ jsxs(
       Button,
@@ -207,41 +207,37 @@ const WmButton = memo(
         show: show == null ? void 0 : show.toString()
       }), removeInvalidAttributes(restProps)), EVENTS), {
         children: [
+          iconclass && /* @__PURE__ */ jsx(
+            WmAppIcon,
+            {
+              iconclass,
+              prefabName: props.prefabName,
+              iconStyle: {
+                width: iconwidth || "auto",
+                height: iconheight || "auto",
+                margin: iconmargin || "0 4",
+                fontSize: iconwidth
+              }
+            }
+          ),
           iconurl && /* @__PURE__ */ jsx(
-            Image,
+            WmAppIcon,
             {
-              "data-identifier": "img",
-              alt: "button image",
-              src: prefixPrefabResourceUrl(iconurl, props.prefabName),
-              className: "button-image-icon",
-              width: parseInt(iconwidth || "24", 10),
-              height: parseInt(iconheight || "24", 10),
-              style: {
+              iconurl,
+              prefabName: props.prefabName,
+              defaultClasses: "button-image-icon",
+              iconStyle: {
                 width: iconwidth,
                 height: iconheight || "auto",
-                margin: iconmargin || "0 4"
+                margin: iconmargin || "0 4",
+                fontSize: iconwidth
               }
             }
           ),
-          iconclass && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              "i",
-              {
-                className: clsx("app-icon", iconclass),
-                "aria-hidden": "true",
-                style: {
-                  width: iconwidth || "auto",
-                  height: iconheight || "auto",
-                  margin: iconmargin || "0 4",
-                  fontSize: iconheight || "24"
-                }
-              }
-            ),
-            /* @__PURE__ */ jsxs(Box, { component: "span", className: "sr-only", children: [
-              safeCaption,
-              " ",
-              (_b = listener == null ? void 0 : listener.appLocale) == null ? void 0 : _b.LABEL_ICON
-            ] })
+          (iconclass || iconurl) && /* @__PURE__ */ jsxs(Box, { component: "span", className: "sr-only", children: [
+            safeCaption,
+            " ",
+            (_b = listener == null ? void 0 : listener.appLocale) == null ? void 0 : _b.LABEL_ICON
           ] }),
           /* @__PURE__ */ jsx(
             Box,

package/components/form/button-group/index.d.ts

@@ -67,5 +67,6 @@ declare const _default: React.ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

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

@@ -68,6 +68,7 @@ export declare const WmCalendar: React.ForwardRefExoticComponent<Omit<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }, "ref"> & React.RefAttributes<HTMLDivElement>>;
 /**
  * The WmCalendar component provides an interactive calendar with event support, day/week/month views.
@@ -130,5 +131,6 @@ declare const _default: React.ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

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

@@ -101,6 +101,7 @@ declare const WmChipsStandalone: React.ComponentType<import("../../data/form/for
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 } & import("@wavemaker-ai/react-runtime/higherOrder/withStandalone").WithStandaloneProps>;
 export { WmChipsStandalone as WmChips };
 /**
@@ -224,5 +225,6 @@ declare const _default: React.ComponentType<{
     prefabName?: string;
     loading?: boolean;
     showSkeleton?: boolean;
+    widget?: string;
 }>;
 export default _default;

package/components/input/chips/index.js

@@ -28,7 +28,13 @@ import { debounce, isEqual, trim, find, slice } from "lodash";
 import { WmSearch } from "../../basic/search";
 import { withBaseWrapper } from "../../../higherOrder/withBaseWrapper";
 import SortableChip from "./SortableChip";
-import { generateStableKey, processDataset, performAddItem, performRemoveItem } from "./utils";
+import {
+  generateStableKey,
+  processDataset,
+  performAddItem,
+  performRemoveItem,
+  resolveItemToAdd
+} from "./utils";
 import withFormController from "../../data/form/form-controller/withFormController";
 import { DEFAULT_CHIPS_DATASET } from "../../constants";
 import withStandalone from "../../../higherOrder/withStandalone";
@@ -346,12 +352,12 @@ const WmChips = React.memo(
     const handleSearchSelect = useCallback(
       (event, widget, selectedValue) => {
         if (selectedValue) {
-          addItem(selectedValue.dataObject ? selectedValue.dataObject : selectedValue);
+          addItem(resolveItemToAdd(selectedValue, datasetItems, datafield));
           setSearchQuery("");
           backspaceArmedRef.current = false;
         }
       },
-      [addItem]
+      [addItem, datasetItems, datafield]
     );
     const handleSearchSubmit = useCallback(
       (event, widget) => {

package/components/input/chips/utils.d.ts

@@ -16,6 +16,11 @@ export declare function updateChipsListAndTriggerEvents(newChipsList: ChipItem[]
 export declare function validateBeforeOperation(listener: any, name: string, beforeHandler: any, event: any, item: any): boolean;
 export declare function createChipItem(itemToAdd: DataSetItem | string, generateUniqueKey: () => string, datafield: string, displayfield: string, createCustomDataModel: (val: string) => any): DataSetItem;
 export declare function createChipItemWithStructure(itemToAdd: DataSetItem): ChipItem;
+/**
+ * Resolves a search selection to a DataSetItem with the correct `value` for the datafield.
+ * may pass either that item or the raw `dataObject` via `getSelectedItem`.
+ */
+export declare function resolveItemToAdd(selectedValue: DataSetItem | string | Record<string, unknown>, datasetItems: DataSetItem[], datafield: string): DataSetItem | string;
 export declare function validateAddItem(newItem: DataSetItem | string, chipsList: ChipItem[], maxsize: number, datafield: string): boolean;
 export declare function validateSearchInput(query: string, allowonlyselect: boolean, maxsize: number, chipsList: ChipItem[]): boolean;
 export declare function performAddItem(newItem: DataSetItem | string, chipsList: ChipItem[], modelByValue: any[], setChipsList: (chips: ChipItem[]) => void, setModelByValue: (model: any[]) => void, setSearchQuery: (query: string) => void, updateMaxSizeFn: (length: number) => void, listener: any, name: string, datafield: string, displayfield: string, createCustomDataModel: (val: string) => any, generateUniqueKey: () => string, maxsize: number, onBeforeadd?: any, onChange?: any, onAdd?: any, props?: any): boolean;