@wavemaker/react-runtime 11.14.1-16.6404

package/components/advanced/login/index.js

@@ -0,0 +1,307 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _styles = require("@mui/material/styles");
+var _Box = _interopRequireDefault(require("@mui/material/Box"));
+var _lodashEs = require("lodash-es");
+var _withBaseWrapper = require("@wavemaker/react-runtime/higherOrder/withBaseWrapper");
+var _message = require("../../basic/message");
+var _formUtils = require("@wavemaker/react-runtime/utils/form-utils");
+var _excluded = ["name", "show", "errormessage", "children", "className", "styles", "invokeEventCallback", "appLocale", "onSubmit", "onBeforerender", "onSuccess", "onError", "listener", "eventSource"];
+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;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+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; }
+// Constants
+var DEFAULT_CLASS = "app-login";
+
+// Styled Components
+var StyledLoginContainer = (0, _styles.styled)(_Box["default"])(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    "&.app-login": {
+      display: "block",
+      position: "relative"
+    }
+  };
+});
+var WmLogin = function WmLogin(props) {
+  var name = props.name,
+    _props$show = props.show,
+    show = _props$show === void 0 ? true : _props$show,
+    errormessage = props.errormessage,
+    children = props.children,
+    className = props.className,
+    styles = props.styles,
+    invokeEventCallback = props.invokeEventCallback,
+    appLocale = props.appLocale,
+    onSubmit = props.onSubmit,
+    onBeforerender = props.onBeforerender,
+    onSuccess = props.onSuccess,
+    onError = props.onError,
+    listener = props.listener,
+    eventSource = props.eventSource,
+    rest = (0, _objectWithoutProperties2["default"])(props, _excluded);
+
+  // State management
+  var _useState = (0, _react.useState)({
+      type: "",
+      caption: "",
+      show: false
+    }),
+    loginMessage = _useState[0],
+    setLoginMessage = _useState[1];
+  var _useState2 = (0, _react.useState)(false),
+    isSubmitting = _useState2[0],
+    setIsSubmitting = _useState2[1];
+
+  // Refs
+  var widgetRef = (0, _react.useRef)(null);
+  var formRef = (0, _react.useRef)(null);
+  var loginButtonRef = (0, _react.useRef)(null);
+  var cleanupFunctionsRef = (0, _react.useRef)([]);
+  (0, _react.useEffect)(function () {
+    if (listener.onChange && formRef.current && loginButtonRef.current) {
+      var _loginButtonRef$curre;
+      var formProps = (0, _formUtils.getFormProps)(formRef);
+      if (!formProps) return;
+      var formName = formProps.name;
+      listener.onChange(name, {
+        formCmp: listener.Widgets[formName],
+        loginBtnCmp: listener.Widgets[(loginButtonRef === null || loginButtonRef === void 0 || (_loginButtonRef$curre = loginButtonRef.current) === null || _loginButtonRef$curre === void 0 ? void 0 : _loginButtonRef$curre.getAttribute("name")) || "loginButton"]
+      });
+    }
+  }, [formRef.current]);
+
+  // Callback handlers
+  var onSuccessCB = (0, _react.useCallback)(function () {
+    var formData = (0, _formUtils.getFormData)(formRef);
+    (0, _formUtils.invokeFormEvent)(formRef, listener, "onSuccess", new Event("onSuccess"), formData);
+    setIsSubmitting(false);
+    invokeEventCallback === null || invokeEventCallback === void 0 || invokeEventCallback("success");
+    onSuccess === null || onSuccess === void 0 || onSuccess(new Event("success"), widgetRef.current);
+  }, [invokeEventCallback, onSuccess, listener]);
+  var onErrorCB = (0, _react.useCallback)(function (error) {
+    var formData = (0, _formUtils.getFormData)(formRef);
+    (0, _formUtils.invokeFormEvent)(formRef, listener, "onError", new Event("onError"), formData);
+    setIsSubmitting(false);
+    var message = {
+      type: "error",
+      caption: (0, _formUtils.loginErrorMessage)(error, appLocale, errormessage),
+      show: true
+    };
+    setLoginMessage(message);
+    invokeEventCallback === null || invokeEventCallback === void 0 || invokeEventCallback("error");
+    onError === null || onError === void 0 || onError(new Event("error"), widgetRef.current);
+  }, [errormessage, appLocale, invokeEventCallback, onError, listener]);
+  var doLogin = (0, _react.useCallback)(/*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(e) {
+      var _formRef$current$clea, _formRef$current2;
+      var formData, _formRef$current$vali, _formRef$current, beforeSubmitResult;
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (!(isSubmitting || !formRef.current)) {
+              _context.next = 2;
+              break;
+            }
+            return _context.abrupt("return");
+          case 2:
+            if (eventSource) {
+              _context.next = 5;
+              break;
+            }
+            console.warn('Default action "loginAction" does not exist. Either create the Action or assign an event to onSubmit of the login widget');
+            return _context.abrupt("return");
+          case 5:
+            handleMessageClose();
+            formData = (0, _formUtils.getFormData)(formRef); // Check if form is valid
+            if (formData.isValid) {
+              _context.next = 10;
+              break;
+            }
+            (_formRef$current$vali = (_formRef$current = formRef.current).validateForm) === null || _formRef$current$vali === void 0 || _formRef$current$vali.call(_formRef$current);
+            return _context.abrupt("return");
+          case 10:
+            _context.next = 12;
+            return (0, _formUtils.invokeFormEvent)(formRef, listener, "onBeforeSubmit", e, formData);
+          case 12:
+            beforeSubmitResult = _context.sent;
+            if (!(beforeSubmitResult === false)) {
+              _context.next = 15;
+              break;
+            }
+            return _context.abrupt("return");
+          case 15:
+            (_formRef$current$clea = (_formRef$current2 = formRef.current).clearErrors) === null || _formRef$current$clea === void 0 || _formRef$current$clea.call(_formRef$current2);
+            setIsSubmitting(true);
+            eventSource.invoke({
+              formData: formData.values
+            }, onSuccessCB, onErrorCB);
+            (0, _formUtils.invokeFormEvent)(formRef, listener, "onSubmit", e || new Event("submit"), formData);
+          case 19:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }(), [eventSource, listener, onSuccessCB, onErrorCB, isSubmitting]);
+
+  // Cleanup all event listeners
+  var cleanupEventListeners = (0, _react.useCallback)(function () {
+    cleanupFunctionsRef.current.forEach(function (cleanup) {
+      return cleanup();
+    });
+    cleanupFunctionsRef.current = [];
+  }, []);
+
+  // Handle message close
+  var handleMessageClose = (0, _react.useCallback)(function () {
+    setLoginMessage(function (prev) {
+      return _objectSpread(_objectSpread({}, prev), {}, {
+        show: false
+      });
+    });
+  }, []);
+
+  // Handle form submission
+  var handleFormSubmit = (0, _react.useCallback)(/*#__PURE__*/function () {
+    var _ref3 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2(e) {
+      var _widgetRef$current;
+      return _regenerator["default"].wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            e.preventDefault();
+            e.stopPropagation();
+            if (!onSubmit) {
+              _context2.next = 6;
+              break;
+            }
+            onSubmit(e, widgetRef.current);
+            _context2.next = 9;
+            break;
+          case 6:
+            if ((_widgetRef$current = widgetRef.current) !== null && _widgetRef$current !== void 0 && _widgetRef$current.hasAttribute("submit.event")) {
+              _context2.next = 9;
+              break;
+            }
+            _context2.next = 9;
+            return doLogin(e);
+          case 9:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+    return function (_x2) {
+      return _ref3.apply(this, arguments);
+    };
+  }(), [onSubmit, doLogin]);
+
+  // Handle login button click
+  var handleLoginButtonClick = (0, _react.useCallback)(/*#__PURE__*/function () {
+    var _ref4 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3(event) {
+      var button, container, hasContainerSubmitEvent, hasButtonClickEvent, hasButtonTapEvent;
+      return _regenerator["default"].wrap(function _callee3$(_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
+          case 0:
+            event.preventDefault();
+            event.stopPropagation();
+            button = event.target;
+            container = widgetRef.current;
+            hasContainerSubmitEvent = container === null || container === void 0 ? void 0 : container.hasAttribute("submit.event");
+            hasButtonClickEvent = button === null || button === void 0 ? void 0 : button.hasAttribute("click.event");
+            hasButtonTapEvent = button === null || button === void 0 ? void 0 : button.hasAttribute("tap.event"); // If no event is attached, invoke default login action
+            if (!(!hasContainerSubmitEvent && !hasButtonClickEvent && !hasButtonTapEvent)) {
+              _context3.next = 10;
+              break;
+            }
+            _context3.next = 10;
+            return doLogin(event);
+          case 10:
+          case "end":
+            return _context3.stop();
+        }
+      }, _callee3);
+    }));
+    return function (_x3) {
+      return _ref4.apply(this, arguments);
+    };
+  }(), [doLogin]);
+
+  // Handle beforerender event
+  (0, _react.useEffect)(function () {
+    onBeforerender === null || onBeforerender === void 0 || onBeforerender(new Event("beforerender"), widgetRef.current);
+  }, []);
+
+  // Main setup effect
+  (0, _react.useEffect)(function () {
+    var container = widgetRef.current;
+    if (!container) return;
+
+    // Clear previous event listeners
+    cleanupEventListeners();
+
+    // Find and set form reference
+    var formElement = container.querySelector("form") || container.querySelector('[role="form"]');
+    if (formElement) {
+      formRef.current = formElement;
+
+      // Add form submit event listener
+      formElement.addEventListener("submit", handleFormSubmit);
+      cleanupFunctionsRef.current.push(function () {
+        formElement.removeEventListener("submit", handleFormSubmit);
+      });
+    }
+
+    // Find and setup login button
+    var buttons = container.querySelectorAll('button, [role="button"]');
+    var loginButtonFound = false;
+    buttons.forEach(function (button) {
+      if (loginButtonFound) return;
+      var name = button.getAttribute("name");
+      var classList = Array.from(button.classList);
+      if (name === "loginButton" || (0, _lodashEs.includes)(classList, "app-login-button")) {
+        loginButtonFound = true;
+        loginButtonRef.current = button;
+
+        // Add click event listener
+        button.addEventListener("click", handleLoginButtonClick);
+        cleanupFunctionsRef.current.push(function () {
+          button.removeEventListener("click", handleLoginButtonClick);
+        });
+      }
+    });
+
+    // Return cleanup function
+    return cleanupEventListeners;
+  }, [children, handleFormSubmit, handleLoginButtonClick, cleanupEventListeners]);
+  return __jsx(StyledLoginContainer, {
+    ref: widgetRef,
+    className: "".concat(DEFAULT_CLASS, " ").concat(className || ""),
+    sx: styles
+  }, __jsx(_message.WmMessage, {
+    className: "app-login-message",
+    name: "LoginMessage",
+    type: loginMessage.type || "info",
+    caption: loginMessage.caption,
+    open: loginMessage.show,
+    close: handleMessageClose,
+    listener: listener
+  }), children);
+};
+WmLogin.displayName = "WmLogin";
+var _default = exports["default"] = (0, _withBaseWrapper.withBaseWrapper)(WmLogin);

package/components/advanced/login/props.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/components/advanced/marquee/index.js

@@ -0,0 +1,158 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Box = _interopRequireDefault(require("@mui/material/Box"));
+var _withBaseWrapper = _interopRequireDefault(require("@wavemaker/react-runtime/higherOrder/withBaseWrapper"));
+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;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+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-marquee app-container";
+var WmMarquee = /*#__PURE__*/(0, _react.memo)(function (props) {
+  var _props$direction = props.direction,
+    direction = _props$direction === void 0 ? "left" : _props$direction,
+    _props$scrollamount = props.scrollamount,
+    scrollamount = _props$scrollamount === void 0 ? 6 : _props$scrollamount,
+    _props$scrolldelay = props.scrolldelay,
+    scrolldelay = _props$scrolldelay === void 0 ? 85 : _props$scrolldelay,
+    className = props.className,
+    styles = props.styles,
+    children = props.children,
+    id = props.id,
+    restProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
+
+  // State to track if animation is paused on hover
+  var _useState = (0, _react.useState)(false),
+    isPaused = _useState[0],
+    setIsPaused = _useState[1];
+
+  // Generate unique animation name for this instance
+  var animationName = (0, _react.useMemo)(function () {
+    return "marquee-".concat(direction, "-").concat(Math.random().toString(36).substr(2, 9));
+  }, [direction]);
+
+  // Calculate animation duration based on scrollamount and scrolldelay
+  var animationDuration = (0, _react.useMemo)(function () {
+    var baseSpeed = 10;
+    var delayFactor = scrolldelay / 85;
+    var speedFactor = scrollamount / 6;
+    return "".concat(baseSpeed * delayFactor / speedFactor, "s");
+  }, [scrollamount, scrolldelay]);
+  var animationCSS = (0, _react.useMemo)(function () {
+    var animations = {
+      left: {
+        "0%": {
+          transform: "translateX(100%)"
+        },
+        "100%": {
+          transform: "translateX(-100%)"
+        }
+      },
+      right: {
+        "0%": {
+          transform: "translateX(-100%)"
+        },
+        "100%": {
+          transform: "translateX(100%)"
+        }
+      },
+      up: {
+        "0%": {
+          transform: "translateY(100%)"
+        },
+        "100%": {
+          transform: "translateY(-100%)"
+        }
+      },
+      down: {
+        "0%": {
+          transform: "translateY(-100%)"
+        },
+        "100%": {
+          transform: "translateY(100%)"
+        }
+      }
+    };
+    return animations[direction];
+  }, [direction]);
+  var containerStyles = (0, _react.useMemo)(function () {
+    return _objectSpread({
+      overflow: "hidden",
+      whiteSpace: direction === "left" || direction === "right" ? "nowrap" : "normal",
+      height: direction === "up" || direction === "down" ? "100%" : "auto",
+      position: "relative"
+    }, styles);
+  }, [direction, styles]);
+
+  // Content styles with animation
+  var contentStyles = (0, _react.useMemo)(function () {
+    return {
+      display: "inline-block",
+      animationName: "".concat(animationName),
+      animationDuration: animationDuration,
+      animationTimingFunction: "linear",
+      animationIterationCount: "infinite",
+      animationDirection: "normal",
+      animationFillMode: "none",
+      animationPlayState: isPaused ? "paused" : "running",
+      width: direction === "up" || direction === "down" ? "100%" : "auto"
+    };
+  }, [animationName, animationDuration, direction, isPaused]);
+
+  // Event handlers
+  var handleClick = (0, _react.useCallback)(function (event) {
+    var _props$onClick;
+    props === null || props === void 0 || (_props$onClick = props.onClick) === null || _props$onClick === void 0 || _props$onClick.call(props, event, props);
+  }, [props]);
+  var handleMouseEnter = (0, _react.useCallback)(function (event) {
+    var _props$onMouseEnter;
+    setIsPaused(true);
+    props === null || props === void 0 || (_props$onMouseEnter = props.onMouseEnter) === null || _props$onMouseEnter === void 0 || _props$onMouseEnter.call(props, event, props);
+  }, [props]);
+  var handleMouseLeave = (0, _react.useCallback)(function (event) {
+    var _props$onMouseLeave;
+    setIsPaused(false);
+    props === null || props === void 0 || (_props$onMouseLeave = props.onMouseLeave) === null || _props$onMouseLeave === void 0 || _props$onMouseLeave.call(props, event, props);
+  }, [props]);
+  return __jsx(_react["default"].Fragment, null, __jsx("style", null, "\n            @keyframes ".concat(animationName, " {\n              ").concat(Object.entries(animationCSS).map(function (_ref) {
+    var _ref2 = (0, _slicedToArray2["default"])(_ref, 2),
+      key = _ref2[0],
+      value = _ref2[1];
+    return "".concat(key, " { ").concat(Object.entries(value).map(function (_ref3) {
+      var _ref4 = (0, _slicedToArray2["default"])(_ref3, 2),
+        prop = _ref4[0],
+        val = _ref4[1];
+      return "".concat(prop, ": ").concat(val);
+    }).join("; "), " }");
+  }).join(" "), "\n            }\n          ")), __jsx(_Box["default"], (0, _extends2["default"])({
+    component: "div",
+    className: (0, _clsx["default"])(DEFAULT_CLASS, className),
+    sx: containerStyles,
+    id: id,
+    onClick: handleClick,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  }, restProps), __jsx(_Box["default"], {
+    component: "div",
+    sx: contentStyles
+  }, children)));
+}, function (prevProps, nextProps) {
+  var keys = ["direction", "scrollamount", "scrolldelay", "className", "children"];
+  return keys.every(function (key) {
+    return prevProps[key] === nextProps[key];
+  });
+});
+WmMarquee.displayName = "WmMarquee";
+var _default = exports["default"] = (0, _withBaseWrapper["default"])(WmMarquee);

package/components/advanced/marquee/props.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});