@wavemaker-ai/react-runtime 1.0.0-next.27766

package/actions/timer-action.js

@@ -0,0 +1,106 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { BaseAction } from "./base-action";
+import { VariableEvents } from "../variables/base-variable";
+import { merge } from "lodash-es";
+class TimerAction extends BaseAction {
+  constructor(config) {
+    super(config);
+    __publicField(this, "_timerId", -1);
+    __publicField(this, "_isActive", false);
+    __publicField(this, "_onSuccess");
+    __publicField(this, "_onError");
+  }
+  invoke(params, onSuccess, onError) {
+    params = (params == null ? void 0 : params.data) ? merge(this.config.paramProvider(), params.data) : merge(this.config.paramProvider(), this.dataSet);
+    this.notify(VariableEvents.BEFORE_INVOKE, [this, this.dataSet]);
+    return super.invoke(params, onSuccess, onError).then(() => {
+      this.startTimer();
+      this._onSuccess = onSuccess;
+      this._onError = onError;
+    }).then(() => {
+      this.notify(VariableEvents.AFTER_INVOKE, [this, this.dataSet]);
+      return this;
+    });
+  }
+  /**
+   * Starts the timer based on configuration
+   */
+  startTimer() {
+    this.cancel();
+    const { repeating, delay } = this.config;
+    this._isActive = true;
+    const executeCallback = () => {
+      try {
+        this.config.onSuccess && this.config.onSuccess(this, this.dataSet);
+        this._onSuccess && this._onSuccess(this, this.dataSet);
+        this.notify(VariableEvents.SUCCESS, [this, this.dataSet]);
+      } catch (error) {
+        console.error("Error in timer callback:", error);
+        this.config.onError && this.config.onError(this, error);
+        this._onError && this._onError(this, error);
+        this.notify(VariableEvents.ERROR, [this, error]);
+      }
+    };
+    if (repeating) {
+      this._timerId = setInterval(executeCallback, delay);
+    } else {
+      this._timerId = setTimeout(() => {
+        executeCallback();
+        this._isActive = false;
+        this._timerId = -1;
+      }, delay);
+    }
+  }
+  //   Cancel  active timer
+  cancel() {
+    if (this._timerId !== -1) {
+      if (this.config.repeating) {
+        clearInterval(this._timerId);
+      } else {
+        clearTimeout(this._timerId);
+      }
+      this._timerId = -1;
+      this._isActive = false;
+    }
+  }
+  // Pauses the timer (alias for cancel)
+  pause() {
+    this.cancel();
+  }
+  // Resumes the timer (if it was paused)
+  resume() {
+    if (!this._isActive) {
+      this.startTimer();
+    }
+  }
+  trigger() {
+    this.notify(VariableEvents.BEFORE_INVOKE, [this, this.dataSet]);
+    try {
+      this.config.onSuccess && this.config.onSuccess(this, this.dataSet);
+      this._onSuccess && this._onSuccess(this, this.dataSet);
+      this.notify(VariableEvents.SUCCESS, [this, this.dataSet]);
+    } catch (error) {
+      console.error("Error in timer trigger:", error);
+      this.config.onError && this.config.onError(this, error);
+      this._onError && this._onError(this, error);
+      this.notify(VariableEvents.ERROR, [this, error]);
+    }
+    this.notify(VariableEvents.AFTER_INVOKE, [this, this.dataSet]);
+    return Promise.resolve(this);
+  }
+  /**
+   * Checks if the timer is currently active
+   */
+  isActive() {
+    return this._isActive;
+  }
+  destroy() {
+    this.cancel();
+    super.destroy();
+  }
+}
+export {
+  TimerAction
+};

package/actions/toast-provider.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { Toast, ToastContextValue } from "@wavemaker-ai/react-runtime/actions/types";
+export declare const useToast: () => ToastContextValue;
+interface ToastPortalProps {
+    toast: Toast | null;
+    onClose: (id: string) => void;
+}
+export declare const ToastPortal: ({ toast, onClose }: ToastPortalProps) => React.ReactPortal;
+export declare const ToastProvider: ({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export {};

package/actions/toast-provider.js

@@ -0,0 +1,97 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useMemo, createContext, useContext, useRef, useEffect } from "react";
+import ReactDOM from "react-dom";
+import {
+  TOAST_CONFIG
+} from "./types";
+import { ToastInitializer } from "./toast.service";
+import CustomToast from "./toast";
+const ToastContext = createContext(null);
+const useToast = () => {
+  const context = useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  return context;
+};
+const ToastPortal = ({ toast, onClose }) => {
+  const containerRef = useRef(null);
+  useEffect(() => {
+    if (!containerRef.current) {
+      let element = document.getElementById(TOAST_CONFIG.CONTAINER_ID);
+      if (!element) {
+        element = document.createElement("div");
+        element.id = TOAST_CONFIG.CONTAINER_ID;
+        document.body.appendChild(element);
+      }
+      containerRef.current = element;
+    }
+    return () => {
+      if (containerRef.current && document.body.contains(containerRef.current)) {
+        document.body.removeChild(containerRef.current);
+        containerRef.current = null;
+      }
+    };
+  }, []);
+  if (!toast) return null;
+  return containerRef.current ? ReactDOM.createPortal(
+    /* @__PURE__ */ jsx(CustomToast, { toast, onClose: () => onClose(toast.id) }, toast.id),
+    containerRef.current
+  ) : null;
+};
+const ToastProvider = ({ children }) => {
+  const [toast, setToast] = useState(null);
+  const showToast = (options) => {
+    const id = `toast-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+    const newToast = __spreadProps(__spreadValues({}, options), { id });
+    setToast(newToast);
+    const duration = typeof options.duration === "number" ? options.duration : options.type === "success" ? TOAST_CONFIG.DEFAULT_DURATION : 0;
+    if (duration > 0) {
+      setTimeout(() => {
+        hideToast(id);
+      }, duration);
+    }
+    return id;
+  };
+  const hideToast = (id) => {
+    if (typeof (toast == null ? void 0 : toast.onClose) === "function") {
+      toast.onClose();
+    }
+    setToast(null);
+  };
+  const hideAllToasts = () => {
+    if (typeof (toast == null ? void 0 : toast.onClose) === "function") {
+      toast.onClose();
+    }
+    setToast(null);
+  };
+  const contextValue = useMemo(() => ({ showToast, hideToast, hideAllToasts }), []);
+  return /* @__PURE__ */ jsx(ToastContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(ToastInitializer, { children: [
+    children,
+    /* @__PURE__ */ jsx(ToastPortal, { toast, onClose: hideToast })
+  ] }) });
+};
+export {
+  ToastPortal,
+  ToastProvider,
+  useToast
+};

package/actions/toast.d.ts

@@ -0,0 +1,7 @@
+import { Toast } from "@wavemaker-ai/react-runtime/actions/types";
+interface CustomToastProps {
+    toast: Toast;
+    onClose: () => void;
+}
+declare const CustomToast: ({ toast, onClose }: CustomToastProps) => import("react/jsx-runtime").JSX.Element;
+export default CustomToast;

package/actions/toast.js

@@ -0,0 +1,121 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import Snackbar from "@mui/material/Snackbar";
+import WmPageToast from "../components/page/toast-container";
+import { TOAST_CONFIG } from "./types";
+const GET_POSITION = (position) => {
+  const [vertical, horizontal] = position.split(" ");
+  return {
+    vertical: vertical === "bottom" ? "bottom" : "top",
+    horizontal: horizontal === "right" ? "right" : horizontal === "left" ? "left" : "center"
+  };
+};
+const CustomToast = ({ toast, onClose }) => {
+  const {
+    text,
+    type = "info",
+    position = toast.placement || TOAST_CONFIG.DEFAULT_POSITION,
+    onClick,
+    showTypeLabel = false
+  } = toast;
+  const ispage = toast.content && typeof toast.content === "object";
+  const handleClick = (e) => {
+    if (onClick) {
+      e.stopPropagation();
+      try {
+        onClick();
+      } catch (err) {
+        console.error("Error in toast onClick callback:", err);
+      }
+    }
+    onClose();
+  };
+  const handleClose = (event, reason) => {
+    if (reason === "clickaway") return;
+    onClose && onClose();
+  };
+  const anchorOrigin = GET_POSITION(position);
+  if (ispage && toast.content !== void 0) {
+    return /* @__PURE__ */ jsx(
+      Snackbar,
+      {
+        open: true,
+        onClose: handleClose,
+        anchorOrigin,
+        message: null,
+        TransitionProps: {
+          appear: false,
+          style: {
+            transition: "ease-in-out 0.3s"
+          }
+        },
+        onClick: handleClick,
+        children: /* @__PURE__ */ jsx(WmPageToast, { component: toast.content.component })
+      }
+    );
+  }
+  const positions = ["top center", "bottom center"];
+  return /* @__PURE__ */ jsx(
+    Snackbar,
+    {
+      open: true,
+      onClose: handleClose,
+      anchorOrigin,
+      autoHideDuration: toast.duration,
+      className: clsx("toast-container", {
+        [`toast-${position.replaceAll(" ", "-")}`]: !positions.includes(position)
+      }),
+      disableWindowBlurListener: true,
+      message: /* @__PURE__ */ jsxs("div", { className: "toast-title", children: [
+        showTypeLabel && type.toUpperCase(),
+        /* @__PURE__ */ jsx("div", { className: "toast-message", children: text })
+      ] }),
+      TransitionProps: { appear: false },
+      onClick: handleClick,
+      sx: {
+        "& .MuiSnackbarContent-root": {
+          alignItems: "unset !important"
+        },
+        "& .MuiSnackbar-root": {
+          all: "unset !important"
+        }
+      },
+      style: __spreadValues(__spreadValues({}, position === "top center" && {
+        top: "var(--wm-toast-position-top)"
+      }), position === "bottom center" && {
+        bottom: "var(--wm-toast-position-bottom)"
+      }),
+      ContentProps: {
+        sx: {
+          "& .MuiSnackbarContent-message": {
+            all: "unset"
+          }
+        },
+        style: __spreadValues({}, position === "center center" && {
+          transform: "translateX(50%)"
+        }),
+        className: `toast toast-${type} `
+      }
+    }
+  );
+};
+var toast_default = CustomToast;
+export {
+  toast_default as default
+};

package/actions/toast.service.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import { ToastOptions, ToastContextValue } from "@wavemaker-ai/react-runtime/actions/types";
+declare class ToastService {
+    private static instance;
+    private context;
+    private activeToasts;
+    constructor();
+    setContext(context: ToastContextValue | null): void;
+    showToast(options: ToastOptions): string;
+    hideToast(id: string): void;
+    hideAllToasts(): void;
+}
+export declare const toastService: ToastService;
+export declare const ToastInitializer: ({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export {};

package/actions/toast.service.js

@@ -0,0 +1,73 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { Fragment, jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { useToast } from "./toast-provider";
+const _ToastService = class _ToastService {
+  constructor() {
+    __publicField(this, "context", null);
+    __publicField(this, "activeToasts", /* @__PURE__ */ new Map());
+    if (_ToastService.instance) {
+      return _ToastService.instance;
+    }
+    this.showToast = this.showToast.bind(this);
+    this.hideToast = this.hideToast.bind(this);
+    this.hideAllToasts = this.hideAllToasts.bind(this);
+    this.setContext = this.setContext.bind(this);
+    _ToastService.instance = this;
+  }
+  setContext(context) {
+    this.context = context;
+  }
+  showToast(options) {
+    if (!this.context) {
+      console.warn("Toast service used before context is set. Make sure ToastProvider is mounted.");
+      return "error";
+    }
+    this.hideAllToasts();
+    const id = this.context.showToast(options);
+    this.activeToasts.set(id, {
+      onClose: options.onClose
+    });
+    return id;
+  }
+  hideToast(id) {
+    if (!this.context) return;
+    const toastData = this.activeToasts.get(id);
+    if (toastData) {
+      if (toastData.timeoutId) {
+        clearTimeout(toastData.timeoutId);
+      }
+      this.activeToasts.delete(id);
+    }
+    this.context.hideToast(id);
+  }
+  hideAllToasts() {
+    if (!this.context) return;
+    this.activeToasts.forEach((data) => {
+      if (data.timeoutId) {
+        clearTimeout(data.timeoutId);
+      }
+    });
+    this.activeToasts.clear();
+    this.context.hideAllToasts();
+  }
+};
+__publicField(_ToastService, "instance");
+let ToastService = _ToastService;
+const toastService = new ToastService();
+const ToastInitializer = ({ children }) => {
+  const toast = useToast();
+  useEffect(() => {
+    toastService.setContext(toast);
+    return () => {
+      toastService.setContext(null);
+    };
+  }, [toast]);
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+export {
+  ToastInitializer,
+  toastService
+};

package/actions/types/index.d.ts

@@ -0,0 +1,26 @@
+export interface ToastOptions {
+    text: string;
+    type?: "success" | "error" | "warning" | "info";
+    duration?: number;
+    position?: ToastPosition;
+    onClick?: () => void;
+    onClose?: () => void;
+    placement?: ToastPosition;
+    content?: Record<string, any> | undefined;
+    name?: string;
+    showTypeLabel?: boolean;
+}
+export type ToastPosition = "top left" | "top center" | "top right" | "center left" | "center center" | "center right" | "bottom left" | "bottom center" | "bottom right";
+export declare const TOAST_CONFIG: {
+    CONTAINER_ID: string;
+    DEFAULT_DURATION: number;
+    DEFAULT_POSITION: ToastPosition;
+};
+export interface Toast extends ToastOptions {
+    id: string;
+}
+export interface ToastContextValue {
+    showToast: (options: ToastOptions) => string;
+    hideToast: (id: string) => void;
+    hideAllToasts: () => void;
+}

package/actions/types/index.js

@@ -0,0 +1,8 @@
+const TOAST_CONFIG = {
+  CONTAINER_ID: "mui-toast-container",
+  DEFAULT_DURATION: 3e3,
+  DEFAULT_POSITION: "bottom right"
+};
+export {
+  TOAST_CONFIG
+};

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

@@ -0,0 +1,75 @@
+import React from "react";
+/**
+ * The WmCarousel component is used to display a series of content panes in a cycle.
+ *
+ * - [Playground](https://react-components.wavemaker.ai/?path=/story/advanced-carousel--showcase)
+ *
+ * - [Docs](https://react-components.wavemaker.ai/?path=/story/advanced-carousel--docs)
+ *
+ * @param props - {@link WmCarouselProps}
+ */
+declare const _default: React.ComponentType<{
+    animation?: "auto" | "none";
+    animationinterval?: number;
+    controls?: import("./props").CarouselControlsType;
+    dataset?: any;
+    nodatamessage?: string;
+    onChange?: (event: any, widget?: Record<string, any>, newIndex?: number, oldIndex?: number) => void;
+    currentslide?: any;
+    previousslide?: any;
+    render?: (item: any, index: number) => React.ReactNode;
+    hyperlink?: string;
+    target?: "_blank" | "_self" | "_parent" | "_top";
+    encodeurl?: "true" | "false";
+    id?: string;
+    standalone?: boolean;
+    ref?: React.RefObject<HTMLElement> | React.RefObject<null>;
+    show?: boolean | string;
+    padding?: string;
+    margin?: string;
+    width?: number | string;
+    height?: number | string;
+    className?: string;
+    conditionalstyle?: React.CSSProperties;
+    conditionalclass?: string;
+    showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
+    onClick?: (event?: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onDoubleClick?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseEnter?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseLeave?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseOver?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseOut?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onFocus?: (event: React.FocusEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onBlur?: (event: React.FocusEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onKeydown?: (event: React.KeyboardEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onKeyup?: (event: React.KeyboardEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onKeypress?: (event: React.KeyboardEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    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;
+    styles?: React.CSSProperties;
+    children?: React.ReactNode;
+    hidden?: boolean;
+    name?: string;
+    listener?: Record<string, any>;
+    "data-widget-id"?: string;
+    iswidget?: boolean | string;
+    deferload?: boolean | string;
+    "item-id"?: string;
+    datavalue?: any;
+    prefab?: boolean;
+    inbound?: Record<string, any>;
+    outbound?: Record<string, any>;
+    key?: string;
+    formfield?: boolean;
+    updateon?: string;
+    prefabName?: string;
+    loading?: boolean;
+    showSkeleton?: boolean;
+    widget?: string;
+}>;
+export default _default;