@wavemaker-ai/react-runtime 1.0.0-rc.647469 → 1.0.0-rc.647502

package/actions/base-action.d.ts

@@ -0,0 +1,7 @@
+import { BaseVariable, VariableConfig } from "@wavemaker-ai/react-runtime/variables/base-variable";
+export interface ActionConfig extends VariableConfig {
+}
+export declare class BaseAction<T extends ActionConfig> extends BaseVariable<T> {
+    constructor(config: T);
+    setData(dataSet: any): void;
+}

package/actions/login-action.d.ts

@@ -0,0 +1,11 @@
+import { ActionConfig, BaseAction } from "./base-action";
+import { SecurityService } from "@wavemaker-ai/react-runtime/core/security.service";
+export interface LoginActionConfig extends ActionConfig {
+    securityService: () => SecurityService;
+    baseURL: String;
+    useDefaultSuccessHandler: boolean;
+}
+export declare class LoginAction extends BaseAction<LoginActionConfig> {
+    constructor(config: LoginActionConfig);
+    invoke(options: any, successcb?: Function, errorcb?: Function): any;
+}

package/actions/logout-action.d.ts

@@ -0,0 +1,10 @@
+import { ActionConfig, BaseAction } from "./base-action";
+import { SecurityService } from "@wavemaker-ai/react-runtime/core/security.service";
+export interface LogoutActionConfig extends ActionConfig {
+    securityService: () => SecurityService;
+    baseURL: String;
+}
+export declare class LogoutAction extends BaseAction<LogoutActionConfig> {
+    constructor(config: LogoutActionConfig);
+    invoke(options: any, successcb?: Function, errorcb?: Function): any;
+}

package/actions/navigation-action.d.ts

@@ -0,0 +1,35 @@
+import { ActionConfig, BaseAction } from "./base-action";
+export declare const __resetNavigationPageParamHistoryForTests: () => void;
+export declare const __getPageQueryParamHistorySizeForTests: () => number;
+export interface NavigationParams {
+    pageName?: string;
+    tabName?: string;
+    accordionName?: string;
+    [key: string]: any;
+}
+export interface NavigationActionConfig extends ActionConfig {
+    appConfig: any;
+    operation: string;
+    _context: any;
+}
+export declare class NavigationAction extends BaseAction<NavigationActionConfig> {
+    constructor(config: NavigationActionConfig);
+    invoke(params?: Record<string, unknown>, onSuccess?: Function, onError?: Function): Promise<NavigationAction>;
+    navigate(params?: {}, onSuccess?: Function, onError?: Function): Promise<NavigationAction>;
+    private handleGoToPreviousPage;
+    private handleGotoTab;
+    private findTabWidget;
+    private handleGotoAccordion;
+    private getAppRelativePath;
+    private parseSearch;
+    private normalizePageName;
+    private getCurrentPageInfo;
+    private rememberPageQueryParams;
+    private resolveQueryParams;
+    /**
+     * Returns true if the current URL matches the target path and query params.
+     * When true, we skip router.push.
+     */
+    private isSamePageAsCurrent;
+    private handleGotoPage;
+}

package/actions/navigation-action.js

@@ -228,7 +228,7 @@ var NavigationAction = exports.NavigationAction = /*#__PURE__*/function (_BaseAc
       var trimTrailingSlash = function trimTrailingSlash(path) {
         return path.replace(/\/$/, "") || "/";
       };
-      var basePath = "/".concat(_constants.ROUTING_BASEPATH);
+      var basePath = "/".concat((0, _constants.getActiveRoutingBasePath)());
       var currentPathname = this.getAppRelativePath(trimTrailingSlash(window.location.pathname), basePath);
       if (!currentPathname.startsWith(basePath)) {
         return null;
@@ -259,7 +259,6 @@ var NavigationAction = exports.NavigationAction = /*#__PURE__*/function (_BaseAc
   }, {
     key: "resolveQueryParams",
     value: function resolveQueryParams(pageName, params) {
-      var _pageQueryParamHistor2;
       var normalizedPageName = this.normalizePageName(pageName);
       var explicitQueryParams = Object.fromEntries(Object.entries(params || {}).filter(function (_ref) {
         var _ref2 = (0, _slicedToArray2["default"])(_ref, 2),
@@ -272,7 +271,26 @@ var NavigationAction = exports.NavigationAction = /*#__PURE__*/function (_BaseAc
           value = _ref4[1];
         return [key, String(value)];
       }));
-      var queryParams = Object.keys(explicitQueryParams).length > 0 ? explicitQueryParams : (_pageQueryParamHistor2 = pageQueryParamHistory.get(normalizedPageName)) !== null && _pageQueryParamHistor2 !== void 0 ? _pageQueryParamHistor2 : {};
+      var isPreview = (0, _constants.getActiveRoutingBasePath)() === _constants.PREVIEW_ROUTING_BASEPATH;
+      var queryParams;
+      if (isPreview) {
+        // Preview: explicit > per-page history > current URL (e.g. wm_state) across navigations
+        if (Object.keys(explicitQueryParams).length > 0) {
+          queryParams = explicitQueryParams;
+        } else {
+          var historyParams = pageQueryParamHistory.get(normalizedPageName);
+          if (historyParams && Object.keys(historyParams).length > 0) {
+            queryParams = historyParams;
+          } else {
+            var currentPageInfo = this.getCurrentPageInfo();
+            queryParams = currentPageInfo && Object.keys(currentPageInfo.queryParams).length > 0 ? currentPageInfo.queryParams : {};
+          }
+        }
+      } else {
+        var _pageQueryParamHistor2;
+        // Production: explicit > per-page history only
+        queryParams = Object.keys(explicitQueryParams).length > 0 ? explicitQueryParams : (_pageQueryParamHistor2 = pageQueryParamHistory.get(normalizedPageName)) !== null && _pageQueryParamHistor2 !== void 0 ? _pageQueryParamHistor2 : {};
+      }
       this.rememberPageQueryParams(normalizedPageName, queryParams);
       return {
         pageName: normalizedPageName,
@@ -293,7 +311,7 @@ var NavigationAction = exports.NavigationAction = /*#__PURE__*/function (_BaseAc
       var trimTrailingSlash = function trimTrailingSlash(p) {
         return p.replace(/\/$/, "") || "/";
       };
-      var basePath = "/".concat(_constants.ROUTING_BASEPATH);
+      var basePath = "/".concat((0, _constants.getActiveRoutingBasePath)());
       var rawCurrentPathname = trimTrailingSlash(window.location.pathname);
       var currentSearch = window.location.search || "";
       var rawTargetPathNorm = trimTrailingSlash(targetPath);
@@ -343,7 +361,7 @@ var NavigationAction = exports.NavigationAction = /*#__PURE__*/function (_BaseAc
 
         // Construct full path with optional query string
         var fullPath = queryString ? "/".concat(cleanPageName, "?").concat(queryString) : "/".concat(cleanPageName);
-        var targetPath = "/".concat(_constants.ROUTING_BASEPATH).concat(fullPath);
+        var targetPath = "/".concat((0, _constants.getActiveRoutingBasePath)()).concat(fullPath);
         var targetPathname = targetPath.split("?")[0];
         var targetSearch = queryString ? "?".concat(queryString) : "";
 

package/actions/notification-action.d.ts

@@ -0,0 +1,20 @@
+import { ActionConfig, BaseAction } from "./base-action";
+import React from "react";
+export interface NotificationActionConfig extends ActionConfig {
+    showDialog: Function;
+    onOk?: Function;
+    onCancel?: Function;
+    onClose?: Function;
+    operation: string;
+    partialContent?: React.ReactNode;
+    toasterService?: () => any;
+}
+export declare class NotificationAction extends BaseAction<NotificationActionConfig> {
+    constructor(config: NotificationActionConfig);
+    notify(event: string, args: any[], emitToParent?: boolean): void;
+    notify(params?: any, onSuccess?: Function, onError?: Function): Promise<any>;
+    private prepareToastOptions;
+    invoke(params?: any, onSuccess?: Function, onError?: Function): Promise<any>;
+    private showToast;
+    getMessage(): void;
+}

package/actions/timer-action.d.ts

@@ -0,0 +1,27 @@
+import { ActionConfig, BaseAction } from "./base-action";
+export interface TimerActionConfig extends ActionConfig {
+    repeating: boolean;
+    delay: number;
+    _context: any;
+}
+export declare class TimerAction extends BaseAction<TimerActionConfig> {
+    private _timerId;
+    private _isActive;
+    private _onSuccess?;
+    private _onError?;
+    constructor(config: TimerActionConfig);
+    invoke(params?: Record<string, any>, onSuccess?: Function, onError?: Function): Promise<TimerAction>;
+    /**
+     * Starts the timer based on configuration
+     */
+    private startTimer;
+    cancel(): void;
+    pause(): void;
+    resume(): void;
+    trigger(): Promise<TimerAction>;
+    /**
+     * Checks if the timer is currently active
+     */
+    isActive(): boolean;
+    destroy(): void;
+}

package/components/advanced/carousel/index.d.ts

@@ -47,6 +47,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/advanced/carousel/index.js

@@ -16,6 +16,7 @@ var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _isPlainObject = _interopRequireDefault(require("lodash-es/isPlainObject"));
 var _withBaseWrapper = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper"));
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["name", "animation", "animationinterval", "controls", "nodatamessage", "height", "width", "children", "className", "styles", "render", "onChange"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -435,7 +436,7 @@ var WmCarousel = /*#__PURE__*/(0, _react.memo)(function (props) {
     role: "region",
     "aria-label": props.arialabel || "Carousel",
     "aria-live": animation === "auto" ? "polite" : "off"
-  }, rest), __jsx("div", {
+  }, (0, _attr.removeInvalidAttributes)(rest)), __jsx("div", {
     className: "carousel slide",
     style: _objectSpread({}, styles)
   }, __jsx("div", {

package/components/advanced/carousel/template.d.ts

@@ -46,6 +46,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/advanced/carousel/template.js

@@ -13,6 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["name", "horizontalalign", "children", "className", "styles", "item", "index"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -57,7 +58,7 @@ var WmCarouselTemplate = /*#__PURE__*/(0, _react.memo)(function (props) {
       display: "flex",
       alignItems: "center"
     }, getAlignmentStyles()), styles)
-  }, rest), children);
+  }, (0, _attr.removeInvalidAttributes)(rest)), children);
 }, function (prevProps, nextProps) {
   // Custom comparison for memoization
   var keysToCompare = ["horizontalalign", "children", "className", "styles", "item", "index"];

package/components/advanced/login/index.d.ts

@@ -50,6 +50,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/advanced/marquee/index.d.ts

@@ -42,6 +42,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/advanced/marquee/index.js

@@ -14,6 +14,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _withBaseWrapper = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper"));
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["direction", "scrollamount", "scrolldelay", "className", "styles", "children", "id"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -144,7 +145,7 @@ var WmMarquee = /*#__PURE__*/(0, _react.memo)(function (props) {
     onClick: handleClick,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave
-  }, restProps), __jsx(_Box["default"], {
+  }, (0, _attr.removeInvalidAttributes)(restProps)), __jsx(_Box["default"], {
     component: "div",
     sx: contentStyles
   }, children)));

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

@@ -57,6 +57,7 @@ declare const _default: import("react").ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/basic/anchor/index.js

@@ -17,6 +17,7 @@ var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _Link = _interopRequireDefault(require("@mui/material/Link"));
 var _Badge = _interopRequireDefault(require("@mui/material/Badge"));
 var _withBaseWrapper = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper"));
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _utils = require("../../../core/util/utils");
 var _excluded = ["caption", "iconclass", "styles", "className", "iconheight", "iconwidth", "iconmargin", "iconurl", "iconposition", "badgevalue", "listener", "hyperlink", "encodeurl", "onClick", "shortcutkey", "arialabel", "target", "itemLink", "href"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
@@ -31,7 +32,7 @@ var getCurrentPageName = function getCurrentPageName(pathname) {
   return segments[segments.length - 1];
 };
 var WmAnchor = exports.WmAnchor = function WmAnchor(props) {
-  var _props$variant, _listener$appLocale;
+  var _listener$appLocale;
   var _props$caption = props.caption,
     caption = _props$caption === void 0 ? "Link" : _props$caption,
     iconclass = props.iconclass,
@@ -195,7 +196,7 @@ var WmAnchor = exports.WmAnchor = function WmAnchor(props) {
     caption: caption,
     role: "link",
     tabIndex: props.tabindex,
-    className: (0, _clsx2["default"])(DEFAULT_CLASS, "wm-anchor-link", (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, className || "", Boolean(className)), "active", isActive), ((_props$variant = props.variant) === null || _props$variant === void 0 ? void 0 : _props$variant.replace(":", "-")) || "", Boolean(props.variant)), "wm-anchor-icon-left", iconposition === "left"), "wm-anchor-icon-top", iconposition === "top"), "wm-anchor-icon-right", iconposition === "right")),
+    className: (0, _clsx2["default"])(DEFAULT_CLASS, "wm-anchor-link", (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, className || "", Boolean(className)), "active", isActive), "wm-anchor-icon-left", iconposition === "left"), "wm-anchor-icon-top", iconposition === "top"), "wm-anchor-icon-right", iconposition === "right")),
     onContextMenu: handleContextMenu,
     accessKey: shortcutkey,
     "aria-label": arialabel || (badgevalue && caption ? "".concat(caption, " ").concat(badgevalue) : caption) || null,
@@ -203,7 +204,7 @@ var WmAnchor = exports.WmAnchor = function WmAnchor(props) {
     target: target,
     title: props.hint,
     "data-identifier": "anchor"
-  }, restProps, {
+  }, (0, _attr.removeInvalidAttributes)(restProps), {
     name: props.name
   }), iconurl && __jsx(_image["default"], {
     alt: "Image",

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

@@ -47,6 +47,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/basic/audio/index.js

@@ -13,6 +13,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _resourceUrl = require("@wavemaker-ai/react-runtime/utils/resource-url");
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["mp3format", "prefabName", "muted", "controls", "loop", "audiopreload", "audiosupportmessage", "autoplay", "hint", "arialabel", "tabindex", "styles", "className"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -42,9 +43,9 @@ var WmAudio = exports.WmAudio = /*#__PURE__*/(0, _react.memo)(function (props) {
     tabIndex: tabindex,
     sx: styles,
     style: styles
-  }, restProps), __jsx("audio", {
+  }, (0, _attr.removeInvalidAttributes)(restProps)), __jsx("audio", {
     title: hint,
-    src: computedSrc,
+    src: computedSrc || undefined,
     muted: muted,
     controls: controls,
     loop: loop,

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

@@ -43,6 +43,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

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

@@ -44,6 +44,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/basic/icon/index.js

@@ -20,7 +20,6 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DEFAULT_CLASS = "app-icon-wrapper";
 var WmIcon = exports.WmIcon = /*#__PURE__*/(0, _react.memo)(function (props) {
-  var _props$variant;
   var name = props.name,
     listener = props.listener,
     caption = props.caption,
@@ -48,16 +47,14 @@ var WmIcon = exports.WmIcon = /*#__PURE__*/(0, _react.memo)(function (props) {
     }
     return rootStyle;
   }, [styles, iconsize]);
-  var variant = (_props$variant = props.variant) === null || _props$variant === void 0 ? void 0 : _props$variant.replace(":", "-");
   return __jsx(_Box["default"], {
-    className: (0, _clsx["default"])(DEFAULT_CLASS, "wm-icon-root", iconposition === "right" && "wm-icon-pos-right", className, variant),
+    className: (0, _clsx["default"])(DEFAULT_CLASS, "wm-icon-root", iconposition === "right" && "wm-icon-pos-right", className),
     component: "span",
     style: wrapperStyle,
     "aria-label": arialabel,
     id: id,
     "data-icon-position": iconposition,
-    hidden: props.hidden,
-    variant: variant
+    hidden: props.hidden
   }, __jsx(_Box["default"], {
     component: "span",
     className: "sr-only"
@@ -65,12 +62,12 @@ var WmIcon = exports.WmIcon = /*#__PURE__*/(0, _react.memo)(function (props) {
     "data-identifier": "img",
     alt: "Image",
     src: computedIconUrl,
-    className: (0, _clsx["default"])("anchor-image-icon", "wm-icon-media", iconclass, variant),
+    className: (0, _clsx["default"])("anchor-image-icon", "wm-icon-media", iconclass),
     "aria-hidden": "true",
     width: parseInt(iconsize || "24", 10),
     height: parseInt(iconsize || "24", 10)
   }) : __jsx("i", {
-    className: (0, _clsx["default"])("app-icon", "wm-icon-media", iconclass, variant),
+    className: (0, _clsx["default"])("app-icon", "wm-icon-media", iconclass),
     "aria-hidden": "true"
   }), caption && __jsx(_label["default"], {
     listener: listener,

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

@@ -1,2 +1,2 @@
+export { toCssLength } from "@wavemaker-ai/react-runtime/utils/style-utils";
 export declare const needsEncoding: (url: string) => boolean;
-export declare const toCssLength: (value: string | number) => string;

package/components/basic/iframe/iframe.utils.js

@@ -3,11 +3,15 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.toCssLength = exports.needsEncoding = void 0;
+exports.needsEncoding = void 0;
+Object.defineProperty(exports, "toCssLength", {
+  enumerable: true,
+  get: function get() {
+    return _styleUtils.toCssLength;
+  }
+});
+var _styleUtils = require("@wavemaker-ai/react-runtime/utils/style-utils");
 var needsEncoding = exports.needsEncoding = function needsEncoding(url) {
   // Matches anything not in the safe character set
   return /[^A-Za-z0-9\-._~:/?#\[\]@!$&'()*+,;=%]/.test(url);
-};
-var toCssLength = exports.toCssLength = function toCssLength(value) {
-  return typeof value === "number" ? "".concat(value, "px") : String(value);
 };

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

@@ -40,6 +40,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

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

@@ -46,6 +46,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/basic/label/index.js

@@ -14,6 +14,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _dompurify = _interopRequireDefault(require("dompurify"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["required", "trustAs", "type", "styles", "className", "caption", "hint", "name", "htmlFor", "onClick", "listener", "variant", "viewParent"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -98,7 +99,7 @@ var WmLabel = exports.WmLabel = /*#__PURE__*/(0, _react.memo)(function (props) {
       dangerouslySetInnerHTML: {
         __html: sanitizedContent
       }
-    }, rest, {
+    }, (0, _attr.removeInvalidAttributes)(rest), {
       onClick: handleOnClick
     }));
   }
@@ -112,7 +113,7 @@ var WmLabel = exports.WmLabel = /*#__PURE__*/(0, _react.memo)(function (props) {
     variant: variant,
     caption: captionString,
     hidden: (_props$hidden = props.hidden) !== null && _props$hidden !== void 0 ? _props$hidden : false
-  }, rest, {
+  }, (0, _attr.removeInvalidAttributes)(rest), {
     onClick: handleOnClick
   }), parts.map(function (part, index) {
     return part.link ? __jsx("a", {

package/components/basic/message/index.js

@@ -65,7 +65,7 @@ var WmMessage = exports.WmMessageWithoutWrapper = /*#__PURE__*/(0, _react.memo)(
     hidden: props.hidden,
     component: "div",
     style: styles,
-    className: (0, _clsx["default"])(DEFAULT_CLS, messageClass, animation ? "animated ".concat(animation) : "", className, [variant.replace(":", "-") || ""]),
+    className: (0, _clsx["default"])(DEFAULT_CLS, messageClass, animation ? "animated ".concat(animation) : "", className),
     title: caption
   }, __jsx(_Box["default"], {
     component: "i",

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

@@ -50,6 +50,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/basic/picture/index.js

@@ -13,6 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _clsx2 = _interopRequireDefault(require("clsx"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _resourceUrl = require("@wavemaker-ai/react-runtime/utils/resource-url");
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["pictureaspect", "resizemode", "pictureplaceholder", "tabindex", "onLoad", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave", "children", "show", "ref"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -23,7 +24,6 @@ function objectFitClassToken(resizemode) {
   return OBJECT_FIT_MODES.includes(raw) ? raw : "cover";
 }
 var WmPicture = exports.WmPicture = /*#__PURE__*/(0, _react.memo)(function (props) {
-  var _props$variant;
   var _props$pictureaspect = props.pictureaspect,
     pictureaspect = _props$pictureaspect === void 0 ? "None" : _props$pictureaspect,
     _props$resizemode = props.resizemode,
@@ -92,7 +92,7 @@ var WmPicture = exports.WmPicture = /*#__PURE__*/(0, _react.memo)(function (prop
   var onMouseLeaveHandler = function onMouseLeaveHandler(event) {
     onMouseLeave && onMouseLeave(event, props);
   };
-  return __jsx(_react["default"].Fragment, null, __jsx("img", (0, _extends2["default"])({}, restProps, {
+  return __jsx(_react["default"].Fragment, null, __jsx("img", (0, _extends2["default"])({}, (0, _attr.removeInvalidAttributes)(restProps), {
     ref: ref,
     "data-identifier": "img",
     title: props.hint || props.name,
@@ -102,8 +102,7 @@ var WmPicture = exports.WmPicture = /*#__PURE__*/(0, _react.memo)(function (prop
     onMouseLeave: onMouseLeaveHandler,
     src: imgSource || pictureplaceholder,
     alt: props.alttext || "image alt text not provided",
-    className: (0, _clsx2["default"])(DEFAULT_CLASS, "wm-picture-object-fit-".concat(objectFitClassToken(resizemode)), (0, _defineProperty2["default"])({}, "img-".concat(props.shape), props.shape), props.className, (_props$variant = props.variant) === null || _props$variant === void 0 ? void 0 : _props$variant.replace(":", "-")),
-    variant: props.variant,
+    className: (0, _clsx2["default"])(DEFAULT_CLASS, "wm-picture-object-fit-".concat(objectFitClassToken(resizemode)), (0, _defineProperty2["default"])({}, "img-".concat(props.shape), props.shape), props.className),
     style: props.styles,
     height: imageHeight,
     width: imageWidth,

package/components/basic/progress-bar/index.d.ts

@@ -47,6 +47,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

package/components/basic/progress-bar/index.js

@@ -17,6 +17,7 @@ var _props = require("@wavemaker-ai/react-runtime/components/basic/progress-bar/
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _formatUtil = require("@wavemaker-ai/react-runtime/utils/format-util");
 var _constants = require("@wavemaker-ai/react-runtime/components/constants");
+var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["type", "datavalue", "minvalue", "maxvalue", "captionplacement", "tabindex", "arialabel", "dataset", "displayformat", "styles", "className", "hint", "height", "width", "listener", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 var __jsx = _react["default"].createElement;
@@ -142,7 +143,7 @@ var WmProgressBar = exports.WmProgressBar = /*#__PURE__*/(0, _react.memo)(functi
   } : {});
   return __jsx(_Box["default"], (0, _extends2["default"])({
     className: (0, _clsx["default"])(_constants.progressBarConstants.DEFAULT_CLASS, className)
-  }, rest, {
+  }, (0, _attr.removeInvalidAttributes)(rest), {
     style: styles,
     "aria-label": arialabel,
     title: hint

package/components/basic/progress-circle/index.d.ts

@@ -52,6 +52,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;

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

@@ -35,6 +35,7 @@ declare const WmRichTextEditorStandalone: React.ComponentType<import("../../data
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;
@@ -119,6 +120,7 @@ declare const _default: React.ComponentType<{
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     arialabel?: string;
     tabindex?: number;
     styles?: React.CSSProperties;

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

@@ -34,6 +34,8 @@ declare const WmSearchStandalone: React.ComponentType<import("../../data/form/fo
     getDisplayExpression?: (data: any) => string;
     isSearchInChips?: boolean;
     onChange?: (event: any, widget: any, newVal?: any, oldVal?: any) => void;
+    clearSearch?: unknown;
+    destroy?: (((names: string[]) => void) | ((formName?: string) => void)) & (((names: string[]) => void) | ((formName?: string) => void));
     standalone?: boolean;
     datafield?: string;
     displayfield?: string;
@@ -149,6 +151,7 @@ declare const _default: React.NamedExoticComponent<import("../../data/form/form-
     eventCallback?: (eventName: string, data: any) => void;
     forwardedRef?: React.ForwardedRef<any>;
     viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
     hint?: string;
     arialabel?: string;
     tabindex?: number;