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

package/components/input/slider/index.js

@@ -63,6 +63,7 @@ var WmSlider = /*#__PURE__*/(0, _react.memo)(function (props) {
     setValue = _useState[1];
   var prevDatavalueRef = (0, _react.useRef)(initialValue);
   var sliderRef = (0, _react.useRef)(null);
+  var sliderControlRef = (0, _react.useRef)(null);
   var _useState2 = (0, _react.useState)(false),
     isTouched = _useState2[0],
     setIsTouched = _useState2[1];
@@ -109,17 +110,15 @@ var WmSlider = /*#__PURE__*/(0, _react.memo)(function (props) {
     }
     prevDatavalueRef.current = newVal;
   }, [onChange, name]);
-  var sliderControlStyle = (0, _react.useMemo)(function () {
-    var min = Number(minvalue || 0);
-    var max = Number(maxvalue || 100);
-    var current = Number(value) || 0;
-    var denominator = max - min;
-    var sliderValue = denominator === 0 ? 100 : 100 - (current - min) / denominator * 100;
+  var updateSliderValue = (0, _react.useCallback)(function () {
+    if (!sliderControlRef.current) return;
+    var sliderValue = 100 - ((Number(value) || 0) - (minvalue || 0)) / ((maxvalue || 100) - (minvalue || 0)) * 100;
     var safePercent = Math.min(100, Math.max(0, sliderValue));
-    return {
-      "--wm-slider-end": "".concat(safePercent, "%")
-    };
+    sliderControlRef.current.style.setProperty("--end", "".concat(safePercent, "%"));
   }, [value, minvalue, maxvalue]);
+  (0, _react.useEffect)(function () {
+    updateSliderValue();
+  }, [value, updateSliderValue]);
   var handleBlur = (0, _react.useCallback)(function (e) {
     setIsTouched(true);
   }, [listener, name, props, value]);
@@ -251,8 +250,8 @@ var WmSlider = /*#__PURE__*/(0, _react.memo)(function (props) {
     "aria-hidden": "true",
     className: starticon
   })), __jsx(_Box["default"], {
-    className: "slider-control wm-slider-control",
-    style: sliderControlStyle
+    className: "slider-control",
+    ref: sliderControlRef
   }, !showmarkers && (minvalue || maxvalue) && __jsx(_react["default"].Fragment, null, __jsx(_Box["default"], {
     component: "span",
     className: "app-slider-value pull-left"
@@ -302,9 +301,9 @@ var WmSlider = /*#__PURE__*/(0, _react.memo)(function (props) {
   }, markerItems.map(function (marker, index) {
     return __jsx("span", {
       key: index,
-      className: "marker-wrapper wm-slider-marker-wrapper",
+      className: "marker-wrapper",
       style: {
-        "--wm-slider-marker-left": "".concat(marker.left, "px")
+        left: marker.left + "px"
       },
       title: marker.label
     }, __jsx("span", {

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

@@ -56,7 +56,6 @@ declare const WmTextStandalone: import("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;
@@ -155,7 +154,6 @@ 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);
     arialabel?: string;
     tabindex?: number;
     styles?: import("react").CSSProperties;

package/components/input/text/index.js

@@ -17,7 +17,7 @@ var _debounce = _interopRequireDefault(require("lodash-es/debounce"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _withFormController = _interopRequireDefault(require("@wavemaker-ai/react-runtime/components/data/form/form-controller/withFormController"));
 var _util = require("./util");
-var _delay = _interopRequireDefault(require("lodash-es/delay"));
+var _delay = _interopRequireDefault(require("lodash/delay"));
 var _util2 = require("../util");
 var _withStandalone = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withStandalone"));
 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); }
@@ -432,7 +432,7 @@ var WmText = /*#__PURE__*/(0, _react.memo)(function (props) {
     className: (0, _clsx["default"])("app-input-wrapper", isTouched ? "ng-touched" : "ng-untouched", displayError && "ng-invalid"),
     slotProps: {
       formHelperText: {
-        className: (0, _clsx["default"])("app-label help-block supporting-text", "wm-text-helper-text", displayError && "wm-text-helper-text-error"),
+        className: "app-label help-block supporting-text",
         name: "supportingText"
       },
       input: {
@@ -467,7 +467,7 @@ var WmText = /*#__PURE__*/(0, _react.memo)(function (props) {
         tabIndex: tabindex,
         readOnly: readonly,
         autoCapitalize: autocapitalize,
-        className: (0, _clsx["default"])(DEFAULT_CLASS, className, "wm-text-input", leadingiconclass && "with-leading-icon", trailingiconclass && "with-trailing-icon", isTouched ? "ng-touched" : "ng-untouched", displayError && "ng-invalid"),
+        className: (0, _clsx["default"])(DEFAULT_CLASS, className, leadingiconclass && "with-leading-icon", trailingiconclass && "with-trailing-icon", isTouched ? "ng-touched" : "ng-untouched", displayError && "ng-invalid"),
         style: styles,
         "aria-label": arialabel,
         maxLength: maxchars,
@@ -476,6 +476,17 @@ var WmText = /*#__PURE__*/(0, _react.memo)(function (props) {
         max: props.maxvalue,
         step: props.step
       }
+    },
+    sx: {
+      "& .MuiInputBase-input.Mui-disabled": {
+        WebkitTextFillColor: "inherit"
+      },
+      "& .MuiFormHelperText-root": {
+        marginLeft: 0,
+        "&.Mui-error": {
+          color: "#ee5f5b"
+        }
+      }
     }
   }));
 }, function (prev, current) {

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

@@ -43,7 +43,6 @@ declare const WmTextareaStandalone: React.ComponentType<import("../../data/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;
@@ -129,7 +128,6 @@ 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/input/textarea/index.js

@@ -14,7 +14,7 @@ var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var lodash = _interopRequireWildcard(require("lodash-es"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _withFormController = _interopRequireDefault(require("@wavemaker-ai/react-runtime/components/data/form/form-controller/withFormController"));
-var _delay = _interopRequireDefault(require("lodash-es/delay"));
+var _delay = _interopRequireDefault(require("lodash/delay"));
 var _util = require("@wavemaker-ai/react-runtime/components/input/util");
 var _withStandalone = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withStandalone"));
 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); }
@@ -318,7 +318,7 @@ var WmTextarea = /*#__PURE__*/(0, _react.memo)(function (props) {
     required: required,
     disabled: disabled,
     error: isDirty && error.show,
-    className: (0, _clsx["default"])("app-input-wrapper", "wm-textarea-root", isTouched ? "ng-touched" : "ng-untouched", isDirty && "ng-invalid"),
+    className: (0, _clsx["default"])("app-input-wrapper", isTouched ? "ng-touched" : "ng-untouched", isDirty && "ng-invalid"),
     style: styles,
     "aria-readonly": readonly,
     helperText: maxchars ? limitdisplaytext.replaceAll("undefined", "".concat((displayValue === null || displayValue === void 0 ? void 0 : displayValue.length) || 0)) : undefined,
@@ -334,16 +334,19 @@ var WmTextarea = /*#__PURE__*/(0, _react.memo)(function (props) {
         ref: textareaRef,
         onKeyDown: handleKeyDown,
         onKeyUp: handleKeyUp,
-        className: (0, _clsx["default"])(DEFAULT_CLASS, "wm-textarea-input", className, isTouched ? "ng-touched" : "ng-untouched", isDirty && "ng-invalid", isEditable ? "wm-textarea-editable" : ""),
-        style: _objectSpread({}, styles.height ? {
-          "--wm-textarea-height": "".concat(styles.height)
-        } : {}),
+        className: (0, _clsx["default"])(DEFAULT_CLASS, className, isTouched ? "ng-touched" : "ng-untouched", isDirty && "ng-invalid", isEditable ? "wm-textarea-editable" : ""),
         pattern: regexp
       }
     },
     slots: _objectSpread({}, maxchars ? {
       formHelperText: TextareaCount
-    } : {})
+    } : {}),
+    sx: {
+      width: "100%",
+      "& .MuiInputBase-input": _objectSpread({}, styles.height ? {
+        height: "".concat(styles.height, " !important")
+      } : {})
+    }
   }, events)));
 }, function (prev, current) {
   var keys = ["datavalue", "disabled", "required", "readonly", "placeholder", "maxchars", "tabindex", "shortcutkey", "autofocus", "arialabel", "limitdisplaytext", "hidden"];

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

@@ -36,7 +36,6 @@ declare const WithForm: 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;
@@ -118,7 +117,6 @@ 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/input/upload/index.js

@@ -12,7 +12,6 @@ var _link = _interopRequireDefault(require("next/link"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _withFormController = _interopRequireDefault(require("../../data/form/form-controller/withFormController"));
 var _image = _interopRequireDefault(require("next/image"));
-var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 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;
 var WmUpload = /*#__PURE__*/(0, _react.memo)(function (props) {
@@ -81,7 +80,10 @@ var WmUpload = /*#__PURE__*/(0, _react.memo)(function (props) {
       className: "form-control-static",
       href: fileUrl
     }, __jsx(_image["default"], {
-      className: "wi wi-file wm-upload-existing-image",
+      style: {
+        height: "2em"
+      },
+      className: "wi wi-file",
       src: fileUrl,
       alt: "Existing file"
     })) : __jsx(_link["default"], {
@@ -100,7 +102,7 @@ var WmUpload = /*#__PURE__*/(0, _react.memo)(function (props) {
   return __jsx("div", {
     className: className,
     style: styles
-  }, renderExistingFile(), __jsx("input", (0, _extends2["default"])({}, (0, _attr.removeInvalidAttributes)(props), {
+  }, renderExistingFile(), __jsx("input", (0, _extends2["default"])({}, props, {
     hidden: props.hidden,
     ref: fileInputRef,
     type: "file",

package/components/layout/footer/index.js

@@ -13,7 +13,6 @@ var DEFAULT_CLASS = "app-footer clearfix";
 var WmFooter = exports.WmFooter = function WmFooter(props) {
   var styles = props.styles,
     children = props.children,
-    render = props.render,
     className = props.className,
     id = props.id;
   return __jsx(_material.Box, {
@@ -21,7 +20,7 @@ var WmFooter = exports.WmFooter = function WmFooter(props) {
     sx: styles,
     className: (0, _clsx["default"])(DEFAULT_CLASS, className),
     id: id
-  }, render ? render(props) : children);
+  }, children);
 };
 WmFooter.displayName = "WmFooter";
 

package/components/layout/footer/props.d.ts

@@ -3,6 +3,5 @@ export interface FooterProps {
     className?: string;
     styles?: React.CSSProperties;
     id?: string;
-    render?: (props: Record<string, any>) => React.ReactNode;
 }
 export type WmFooterProps = FooterProps;

package/components/layout/header/index.js

@@ -13,7 +13,6 @@ var DEFAULT_CLASS = "app-header clearfix app-header-shrink";
 var WmHeader = exports.WmHeader = function WmHeader(props) {
   var styles = props.styles,
     children = props.children,
-    render = props.render,
     className = props.className,
     id = props.id;
   return __jsx(_Box["default"], {
@@ -24,7 +23,7 @@ var WmHeader = exports.WmHeader = function WmHeader(props) {
   }, __jsx(_Box["default"], {
     component: "div",
     className: "app-header-container"
-  }, render ? render(props) : children));
+  }, children));
 };
 WmHeader.displayName = "WmHeader";
 

package/components/layout/header/props.d.ts

@@ -3,6 +3,5 @@ export interface HeaderProps {
     className?: string;
     styles?: React.CSSProperties;
     id?: string;
-    render?: (props: Record<string, any>) => React.ReactNode;
 }
 export type WmHeaderProps = HeaderProps;

package/components/layout/leftnav/index.js

@@ -15,7 +15,6 @@ var DEFAULT_CLASS = "app-nav-drawer app-left-panel left-panel-collapsed ";
 var WmLeftPanel = exports.WmLeftPanel = function WmLeftPanel(props) {
   var styles = props.styles,
     children = props.children,
-    render = props.render,
     className = props.className,
     _props$columnwidth = props.columnwidth,
     columnwidth = _props$columnwidth === void 0 ? 2 : _props$columnwidth,
@@ -38,7 +37,7 @@ var WmLeftPanel = exports.WmLeftPanel = function WmLeftPanel(props) {
     component: "div",
     sx: styles,
     className: (0, _clsx["default"])(DEFAULT_CLASS, className, "col-sm-".concat(columnwidth, " ").concat(navtype ? "app-nav-".concat(navtype) : "", " ").concat(navheight ? "app-nav-".concat(navheight) : ""))
-  }, render ? render(props) : children);
+  }, children);
 };
 WmLeftPanel.displayName = "WmLeftPanel";
 

package/components/layout/leftnav/props.d.ts

@@ -20,6 +20,5 @@ export interface LeftNavProps {
     className?: string;
     styles?: React.CSSProperties;
     id?: string;
-    render?: (props: Record<string, any>) => React.ReactNode;
 }
 export type WmLeftNavProps = LeftNavProps;

package/components/layout/rightnav/index.js

@@ -13,7 +13,6 @@ var DEFAULT_CLASS = "app-right-panel";
 var WmRightPanel = exports.WmRightPanel = function WmRightPanel(props) {
   var styles = props.styles,
     children = props.children,
-    render = props.render,
     className = props.className,
     _props$columnwidth = props.columnwidth,
     columnwidth = _props$columnwidth === void 0 ? 2 : _props$columnwidth,
@@ -22,7 +21,7 @@ var WmRightPanel = exports.WmRightPanel = function WmRightPanel(props) {
     id: id,
     sx: styles,
     className: (0, _clsx["default"])(DEFAULT_CLASS, className, "col-sm-".concat(columnwidth))
-  }, render ? render(props) : children);
+  }, children);
 };
 WmRightPanel.displayName = "WmRightPanel";
 

package/components/layout/rightnav/props.d.ts

@@ -8,6 +8,5 @@ export interface RightNavProps {
     className?: string;
     styles?: React.CSSProperties;
     id?: string;
-    render?: (props: Record<string, any>) => React.ReactNode;
 }
 export type WmRightNavProps = RightNavProps;

package/components/layout/topnav/index.js

@@ -13,7 +13,6 @@ var DEFAULT_CLASS = "app-top-nav";
 var WmTopNav = exports.WmTopNav = function WmTopNav(props) {
   var styles = props.styles,
     children = props.children,
-    render = props.render,
     className = props.className,
     id = props.id;
   return __jsx(_Box["default"], {
@@ -24,7 +23,7 @@ var WmTopNav = exports.WmTopNav = function WmTopNav(props) {
     role: "navigation",
     "aria-label": "Second level navigation",
     "data-role": "page-topnav"
-  }, render ? render(props) : children);
+  }, children);
 };
 WmTopNav.displayName = "WmTopNav";
 

package/components/layout/topnav/props.d.ts

@@ -3,6 +3,5 @@ export interface TopNavProps {
     className?: string;
     styles?: React.CSSProperties;
     id?: string;
-    render?: (props: Record<string, any>) => React.ReactNode;
 }
 export type WmTopNavProps = TopNavProps;

package/components/navbar/index.d.ts

@@ -40,7 +40,6 @@ declare const _default: import("react").MemoExoticComponent<import("react").Comp
     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/navbar/index.js

@@ -16,7 +16,6 @@ var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _Link = _interopRequireDefault(require("@mui/material/Link"));
 var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
 var _button = require("@wavemaker-ai/react-runtime/components/form/button");
-var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["className", "children", "styles", "id", "title", "brandHref", "showToggle", "listener"];
 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;
@@ -55,7 +54,7 @@ var WmNavbar = exports.WmNavbar = /*#__PURE__*/(0, _react.memo)(function (props)
     style: processedStyles,
     className: (0, _clsx["default"])(DEFAULT_CLASS, className),
     id: id
-  }, (0, _attr.removeInvalidAttributes)(restProps)), __jsx(_Box["default"], {
+  }, restProps), __jsx(_Box["default"], {
     component: "div",
     className: "container-fluid"
   }, __jsx(_Box["default"], {

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

@@ -66,7 +66,6 @@ declare const _default: import("react").MemoExoticComponent<import("react").Comp
     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/navbar/nav-item/index.d.ts

@@ -36,7 +36,6 @@ declare const _default: import("react").MemoExoticComponent<import("react").Comp
     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/navbar/nav-item/index.js

@@ -13,7 +13,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _clsx = _interopRequireDefault(require("clsx"));
 var _ListItem = _interopRequireDefault(require("@mui/material/ListItem"));
 var _withBaseWrapper = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper"));
-var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["className", "styles", "id", "onMouseEnter", "onMouseLeave", "name"];
 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;
@@ -30,7 +29,7 @@ var WmNavItem = exports.WmNavItem = /*#__PURE__*/(0, _react.memo)(function (prop
     rest = (0, _objectWithoutProperties2["default"])(props, _excluded);
   return __jsx(_ListItem["default"], (0, _extends2["default"])({
     component: "li"
-  }, (0, _attr.removeInvalidAttributes)(rest), {
+  }, rest, {
     name: name,
     id: id,
     sx: _objectSpread(_objectSpread({

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

@@ -39,7 +39,6 @@ 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/navigation/menu/index.d.ts

@@ -60,7 +60,6 @@ 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/navigation/menu/index.js

@@ -30,7 +30,6 @@ var _useKeyboardMovements = require("./hooks/useKeyboardMovements.hook");
 var _useTransformedDataset = require("./hooks/useTransformedDataset.hook");
 var _useHoverState2 = require("./hooks/useHoverState.hook");
 var _constants2 = require("@wavemaker-ai/react-runtime/core/constants");
-var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["menualign", "menuposition", "menulayout", "menuclass", "linktarget", "iconclass", "type", "animateitems", "disableMenuContext", "showonhover", "panelPosition", "autoclose", "autoopen", "hint", "arialabel", "width", "height", "iconposition", "caption", "shortcutkey", "onClick", "onSelect", "navNodes", "styles", "conditionalstyles", "className", "children", "listener", "name", "resetNavNodes", "nodes$", "dataset", "orderby", "itemlabel", "itemlink", "itemicon", "itemaction", "userrole", "loggedInUser", "itemchildren", "isactive", "displayValue", "onActionsclick", "dataPath", "isFromNav", "onNavItemActivate", "isNavItemActive"];
 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;
@@ -370,7 +369,7 @@ var WmMenu = exports.WmMenu = /*#__PURE__*/(0, _react.memo)(function (props) {
       icon: ((_item$dataObject4 = item.dataObject) === null || _item$dataObject4 === void 0 ? void 0 : _item$dataObject4.icon) || icon,
       link: link,
       target: (_item$dataObject5 = item.dataObject) === null || _item$dataObject5 === void 0 ? void 0 : _item$dataObject5.target
-    }, item === null || item === void 0 ? void 0 : item.value);
+    });
     if (onSelect) {
       onSelect(event, props, simplifiedItem);
     }
@@ -976,7 +975,7 @@ var WmMenu = exports.WmMenu = /*#__PURE__*/(0, _react.memo)(function (props) {
       height: height !== undefined ? typeof height === "number" ? "".concat(height, "px") : height : undefined,
       textAlign: menualign
     }
-  }, (0, _attr.removeInvalidAttributes)(restProps)), iconclass && __jsx("i", {
+  }, restProps), iconclass && __jsx("i", {
     className: (0, _clsx["default"])("app-icon", iconclass),
     "aria-hidden": "true"
   }), __jsx("span", {
@@ -986,7 +985,7 @@ var WmMenu = exports.WmMenu = /*#__PURE__*/(0, _react.memo)(function (props) {
   }, caption || ""), __jsx("span", {
     className: (0, _clsx["default"])("pull-right caret fa", menuPosition !== null && menuPosition !== void 0 && menuPosition.startsWith("up") ? _constants.CARET_CLS.UP : _constants.CARET_CLS.DOWN)
   })) : __jsx(_Button["default"], (0, _extends2["default"])({
-    className: (0, _clsx["default"])("btn dropdown-toggle", "icon-position-".concat(iconposition), "app-button", menuclass, "menu-layout-".concat(menulayout), "menu-align-".concat(menualign), open ? "open" : "", menuPosition !== null && menuPosition !== void 0 && menuPosition.startsWith("up") ? "dropup" : "", menuPosition === _constants.POSITION.INLINE ? "dropinline-menu" : ""),
+    className: (0, _clsx["default"])("btn dropdown-toggle", "app-button", menuclass, "menu-layout-".concat(menulayout), "menu-align-".concat(menualign), open ? "open" : "", menuPosition !== null && menuPosition !== void 0 && menuPosition.startsWith("up") ? "dropup" : "", menuPosition === _constants.POSITION.INLINE ? "dropinline-menu" : ""),
     ref: buttonRef,
     onClick: handleMenuClick,
     "aria-haspopup": "true",
@@ -998,7 +997,7 @@ var WmMenu = exports.WmMenu = /*#__PURE__*/(0, _react.memo)(function (props) {
       width: width !== undefined ? typeof width === "number" ? "".concat(width, "px") : width : undefined,
       height: height !== undefined ? typeof height === "number" ? "".concat(height, "px") : height : undefined
     }, buttonStyles), menuContainerStyles)
-  }, (0, _attr.removeInvalidAttributes)(restProps)), iconclass && __jsx("i", {
+  }, restProps), iconclass && __jsx("i", {
     className: (0, _clsx["default"])("app-icon", iconclass),
     "aria-hidden": "true"
   }), __jsx("span", {

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

@@ -20,7 +20,7 @@ declare const _default: React.ComponentType<{
     popoverwidth: string;
     title?: string;
     adaptiveposition?: boolean;
-    autoclose?: "disabled" | "always" | "outsideClick";
+    autoclose?: "always" | "disabled" | "outsideClick";
     contentanimation?: string;
     onLoad?: (widget: WmPopoverProps) => void | Function;
     onShow?: (event: Event, widget: WmPopoverProps) => void;
@@ -71,7 +71,6 @@ 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/navigation/popover/index.js

@@ -9,7 +9,7 @@ exports["default"] = exports.WmPopover = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _clsx = _interopRequireDefault(require("clsx"));
-var _debounce = _interopRequireDefault(require("lodash-es/debounce"));
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
 var _Popover = _interopRequireDefault(require("@mui/material/Popover"));
 var _withBaseWrapper = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper"));
 var _anchor = require("@wavemaker-ai/react-runtime/components/basic/anchor");

package/components/page/error-boundary/index.js

@@ -7,13 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _navigation = require("next/navigation");
 var _button = require("../../form/button");
 var _label = require("../../basic/label");
 var _icon = require("../../basic/icon");
 var _picture = require("../../basic/picture");
 var _container = require("../../container");
 var _store = require("../../../store");
-var _navigationMiddleware = require("../../../store/middleware/navigationMiddleware");
 var __jsx = _react["default"].createElement;
 var ErrorFallback = function ErrorFallback(_ref) {
   var _store$getState;
@@ -24,18 +24,18 @@ var ErrorFallback = function ErrorFallback(_ref) {
     subtitle = _ref$subtitle === void 0 ? "Please try again." : _ref$subtitle,
     _ref$imageSource = _ref.imageSource,
     imageSource = _ref$imageSource === void 0 ? "/error-fallback.svg" : _ref$imageSource;
+  var router = (0, _navigation.useRouter)();
   var homePage = (_store$getState = _store.store.getState()) === null || _store$getState === void 0 || (_store$getState = _store$getState.info) === null || _store$getState === void 0 || (_store$getState = _store$getState.appConfig) === null || _store$getState === void 0 || (_store$getState = _store$getState.appProperties) === null || _store$getState === void 0 ? void 0 : _store$getState.homePage;
   var handleGoHome = function handleGoHome() {
-    var router = (0, _navigationMiddleware.getRouterInstance)();
-    if (router && homePage) {
+    if (homePage) {
       router.push(homePage);
     } else {
       window.location.href = window.location.origin;
     }
   };
   var handleGoBack = function handleGoBack() {
-    var router = (0, _navigationMiddleware.getRouterInstance)();
-    if (router && window.history.length > 1) {
+    var hasHistory = typeof window !== "undefined" && window.history.length > 1;
+    if (hasHistory) {
       router.back();
     } else {
       window.location.href = window.location.origin;

package/components/page/index.js

@@ -13,7 +13,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _Container = _interopRequireDefault(require("@mui/material/Container"));
-var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["className", "styles", "children"];
 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;
@@ -120,9 +119,6 @@ function WmPage(props) {
   var childrenWithCallback = (0, _react.useMemo)(function () {
     return _react["default"].Children.map(children, function (child) {
       if (/*#__PURE__*/_react["default"].isValidElement(child)) {
-        if (typeof child.type === "string") {
-          return child;
-        }
         return /*#__PURE__*/_react["default"].cloneElement(child, _objectSpread({
           onNavHeightChange: handleNavHeightChange
         }, child.props));
@@ -130,7 +126,7 @@ function WmPage(props) {
       return child;
     });
   }, [children, handleNavHeightChange]);
-  return __jsx(_Container["default"], (0, _extends2["default"])({}, (0, _attr.removeInvalidAttributes)(restProps), {
+  return __jsx(_Container["default"], (0, _extends2["default"])({}, restProps, {
     className: (0, _clsx["default"])(DEFAULT_CLASS, {
       "app-nav-full": hasFullNavHeight
     }, className),
@@ -139,13 +135,13 @@ function WmPage(props) {
 }
 WmPage.displayName = "WmPage";
 
-/**
- * The WmPage component is the root container for a WaveMaker page layout.
- *
- * - [Playground](https://react-components.wavemaker.ai/?path=/story/page--showcase)
- *
- * - [Docs](https://react-components.wavemaker.ai/?path=/story/page--docs#tab-overview)
- *
- * @param props - {@link WmPageProps}
+/**
+ * The WmPage component is the root container for a WaveMaker page layout.
+ *
+ * - [Playground](https://react-components.wavemaker.ai/?path=/story/page--showcase)
+ *
+ * - [Docs](https://react-components.wavemaker.ai/?path=/story/page--docs#tab-overview)
+ *
+ * @param props - {@link WmPageProps}
  */
 var _default = exports["default"] = WmPage;

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

@@ -34,7 +34,6 @@ 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/prefab/container/index.js

@@ -9,7 +9,6 @@ exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _attr = require("@wavemaker-ai/react-runtime/utils/attr");
 var _excluded = ["styles", "onLoad", "onDestroy", "children", "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;
@@ -46,7 +45,7 @@ var WmPrefabContainer = function WmPrefabContainer(props) {
   }, [onLoad, onDestroy]);
   return __jsx("div", (0, _extends2["default"])({
     style: styles
-  }, (0, _attr.removeInvalidAttributes)(rest), {
+  }, rest, {
     ref: ref,
     className: className || DEFAULT_CLASS
   }), children);