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

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

@@ -0,0 +1,247 @@
+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));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx } from "react/jsx-runtime";
+import { createElement } from "react";
+import { memo, useEffect, useMemo, useCallback, useState } from "react";
+import Box from "@mui/material/Box";
+import clsx from "clsx";
+import { transformDataset } from "../../../utils/transformedDataset-utils";
+import {
+  TYPE_CLASS_MAP
+} from "./props";
+import { withBaseWrapper } from "../../../higherOrder/withBaseWrapper";
+import {
+  getDecimalCount,
+  isPercentageValue,
+  findValueOf
+} from "../../../utils/format-util";
+import { progressBarConstants } from "../../constants";
+import { removeInvalidAttributes } from "../../../utils/attr";
+const WmProgressBar = memo(
+  (props) => {
+    const _a = props, {
+      type = progressBarConstants.DEFAULT_TYPE,
+      datavalue = 30,
+      minvalue = progressBarConstants.DEFAULT_MIN_VALUE,
+      maxvalue = progressBarConstants.DEFAULT_MAX_VALUE,
+      captionplacement = progressBarConstants.DEFAULT_CAPTION_PLACEMENT,
+      tabindex,
+      arialabel,
+      dataset,
+      displayformat,
+      styles,
+      className,
+      hint,
+      height,
+      width,
+      listener,
+      onClick,
+      onDoubleClick,
+      onMouseEnter,
+      onMouseLeave
+    } = _a, rest = __objRest(_a, [
+      "type",
+      "datavalue",
+      "minvalue",
+      "maxvalue",
+      "captionplacement",
+      "tabindex",
+      "arialabel",
+      "dataset",
+      "displayformat",
+      "styles",
+      "className",
+      "hint",
+      "height",
+      "width",
+      "listener",
+      "onClick",
+      "onDoubleClick",
+      "onMouseEnter",
+      "onMouseLeave"
+    ]);
+    const transformedDataset = useMemo(() => {
+      if (!Array.isArray(dataset)) {
+        return [];
+      }
+      const firstItem = dataset == null ? void 0 : dataset[0];
+      const firstKey = firstItem ? Object.keys(firstItem)[0] : "";
+      return transformDataset(dataset, datavalue, firstKey, "", "", "", "", "");
+    }, [dataset]);
+    const [progressData, setProgressData] = useState([
+      {
+        cls: TYPE_CLASS_MAP[type || "default"],
+        progressBarWidth: "0%",
+        displayValue: "0"
+      }
+    ]);
+    const getFormattedDisplayVal = useCallback(
+      (val) => {
+        const format = displayformat || "9";
+        let formattedValue = parseFloat(String(val)).toFixed(
+          getDecimalCount(format, progressBarConstants.DECIMAL_COUNT_MAP)
+        );
+        if (format.includes("%")) {
+          formattedValue += "%";
+        }
+        return formattedValue;
+      },
+      [displayformat]
+    );
+    const prepareData = useCallback(() => {
+      if (transformedDataset && Array.isArray(transformedDataset) && transformedDataset.length > 0 && type && datavalue) {
+        const newProgressData = transformedDataset.map((datum) => {
+          var _a2;
+          const valFromDatum = findValueOf(datum, datavalue);
+          const valStr = String(((_a2 = valFromDatum == null ? void 0 : valFromDatum.dataObject) == null ? void 0 : _a2[datavalue]) || datavalue);
+          let progressBarWidthStr = valStr;
+          if (valStr && !valStr.includes("%")) {
+            progressBarWidthStr = `${valStr}%`;
+          }
+          const cls = TYPE_CLASS_MAP[type];
+          const displayValue = getFormattedDisplayVal(valStr);
+          return {
+            cls,
+            progressBarWidth: progressBarWidthStr,
+            displayValue
+          };
+        });
+        setProgressData(newProgressData);
+      } else {
+        let calculatedWidth = "0%";
+        let valueForDisplayFormat = 0;
+        if (datavalue !== void 0 && datavalue !== null) {
+          const datavalueStr = String(datavalue);
+          if (isPercentageValue(datavalueStr)) {
+            calculatedWidth = datavalueStr || "0%";
+            valueForDisplayFormat = datavalueStr;
+          } else {
+            const denominator = Number(maxvalue) - Number(minvalue) || 1;
+            calculatedWidth = `${(Number(datavalueStr) - Number(minvalue)) * 100 / denominator}%`;
+            valueForDisplayFormat = calculatedWidth;
+          }
+        }
+        setProgressData([
+          {
+            displayValue: getFormattedDisplayVal(String(valueForDisplayFormat)),
+            progressBarWidth: calculatedWidth,
+            cls: TYPE_CLASS_MAP[type || "default"]
+          }
+        ]);
+      }
+    }, [
+      transformedDataset,
+      datavalue,
+      type,
+      minvalue,
+      maxvalue,
+      getFormattedDisplayVal,
+      setProgressData
+    ]);
+    const handleClick = useCallback(
+      (event) => {
+        onClick == null ? void 0 : onClick(event, props);
+        if (listener == null ? void 0 : listener.onChange) {
+          listener.onChange(props.name, {
+            datavalue
+          });
+        }
+      },
+      [onClick, listener, datavalue, props]
+    );
+    const handleDoubleClick = useCallback(
+      (event) => {
+        onDoubleClick == null ? void 0 : onDoubleClick(event, props);
+      },
+      [onDoubleClick]
+    );
+    const handleMouseEnter = useCallback(
+      (event) => {
+        onMouseEnter == null ? void 0 : onMouseEnter(event, props);
+      },
+      [onMouseEnter]
+    );
+    const handleMouseLeave = useCallback(
+      (event) => {
+        onMouseLeave == null ? void 0 : onMouseLeave(event, props);
+      },
+      [onMouseLeave]
+    );
+    useEffect(() => {
+      prepareData();
+    }, [prepareData]);
+    const events = __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, onClick ? { onClick: handleClick } : {}), onDoubleClick ? { onDoubleClick: handleDoubleClick } : {}), onMouseEnter ? { onMouseEnter: handleMouseEnter } : {}), onMouseLeave ? { onMouseLeave: handleMouseLeave } : {});
+    return /* @__PURE__ */ jsx(
+      Box,
+      __spreadProps(__spreadValues({
+        className: clsx(progressBarConstants.DEFAULT_CLASS, className)
+      }, removeInvalidAttributes(rest)), {
+        style: styles,
+        "aria-label": arialabel,
+        title: hint,
+        children: progressData.map((bar, index) => /* @__PURE__ */ createElement(
+          Box,
+          __spreadProps(__spreadValues({}, events), {
+            role: "progressbar",
+            key: index,
+            className: `multi-bar wm-progress-segment ${bar.cls}`,
+            style: {
+              "--wm-progress-segment-width": bar.progressBarWidth
+            },
+            "aria-valuenow": Number(bar.displayValue) || 0,
+            "aria-valuemin": minvalue,
+            "aria-valuemax": maxvalue,
+            tabIndex: tabindex
+          }),
+          captionplacement === "inside" && /* @__PURE__ */ jsx(
+            Box,
+            {
+              component: "span",
+              className: "app-progress-label",
+              "data-caption-placement": captionplacement,
+              children: bar.displayValue
+            }
+          )
+        ))
+      })
+    );
+  },
+  (prev, current) => {
+    return prev.datavalue === current.datavalue && prev.type === current.type && prev.height === current.height && prev.width === current.width && JSON.stringify(prev.dataset) === JSON.stringify(current.dataset) && prev.minvalue === current.minvalue && prev.maxvalue === current.maxvalue && prev.hidden === current.hidden;
+  }
+);
+WmProgressBar.displayName = "WmProgressBar";
+var progress_bar_default = withBaseWrapper(WmProgressBar);
+export {
+  WmProgressBar,
+  progress_bar_default as default
+};

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

@@ -0,0 +1,66 @@
+import { BaseProps, Prettify } from "@wavemaker-ai/react-runtime/higherOrder/props";
+/**
+ * Information about the progress state.
+ */
+export interface IProgressInfo {
+    cls: string;
+    progressBarWidth: string;
+    displayValue: string;
+}
+/**
+ * Valid types for the ProgressBar component.
+ */
+export type ProgressBarType = "default" | "default-striped" | "success" | "success-striped" | "info" | "info-striped" | "warning" | "warning-striped" | "danger" | "danger-striped";
+/**
+ * Valid caption placements for the ProgressBar component.
+ */
+export type CaptionPlacement = "hidden" | "inside";
+/**
+ * Map of progress-bar type and classes.
+ */
+export declare const TYPE_CLASS_MAP: Record<ProgressBarType, string>;
+/**
+ * Base props specific to the WmProgressBar component.
+ */
+export interface ProgressBarProps {
+    /**
+     * The type of progress bar.
+     * @default "default"
+     */
+    type?: ProgressBarType;
+    /**
+     * The display format for the progress value (e.g., as a percentage).
+     */
+    displayformat?: string;
+    /**
+     * The minimum value of the progress bar.
+     * @default 0
+     */
+    minvalue?: number;
+    /**
+     * The maximum value of the progress bar.
+     * @default 100
+     */
+    maxvalue?: number;
+    /**
+     * Where to place the caption (e.g., 'inside', 'hidden').
+     */
+    captionplacement?: CaptionPlacement;
+    id?: string;
+    /**
+     * Callback fired when progress starts.
+     */
+    onStart?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>, widget: WmProgressBarProps) => void;
+    /**
+     * Callback fired when progress completes.
+     */
+    onComplete?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>, widget: WmProgressBarProps) => void;
+    /**
+     * Callback fired before progress updates.
+     */
+    onBeforeupdate?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>, widget: WmProgressBarProps) => void;
+}
+/**
+ * Combined props for the WmProgressBar component, including base WaveMaker props.
+ */
+export type WmProgressBarProps = Prettify<ProgressBarProps & BaseProps>;

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

@@ -0,0 +1,15 @@
+const TYPE_CLASS_MAP = {
+  default: "progress-bar",
+  "default-striped": "progress-bar progress-bar-striped",
+  success: "progress-bar progress-bar-success",
+  "success-striped": "progress-bar progress-bar-success progress-bar-striped",
+  info: "progress-bar progress-bar-info",
+  "info-striped": "progress-bar progress-bar-info progress-bar-striped",
+  warning: "progress-bar progress-bar-warning",
+  "warning-striped": "progress-bar progress-bar-warning progress-bar-striped",
+  danger: "progress-bar progress-bar-danger",
+  "danger-striped": "progress-bar progress-bar-danger progress-bar-striped"
+};
+export {
+  TYPE_CLASS_MAP
+};

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

@@ -0,0 +1,81 @@
+import React from "react";
+import { WmProgressCircleProps } from "@wavemaker-ai/react-runtime/components/basic/progress-circle/props";
+export declare const WmProgressCircle: {
+    (props: WmProgressCircleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+/**
+ * The WmProgressCircle component is used to display progress in a circular format.
+ * It supports various colors (types) and custom title/subtitle.
+ *
+ * - [Playground](https://react-components.wavemaker.ai/?path=/story/basic-progresscircle--showcase)
+ *
+ * - [Docs](https://react-components.wavemaker.ai/?path=/story/basic-progresscircle--docs)
+ *
+ * @param props - {@link WmProgressCircleProps}
+ */
+declare const _default: React.ComponentType<{
+    minvalue?: number;
+    maxvalue?: number;
+    type?: "default" | "success" | "info" | "warning" | "danger";
+    displayformat?: string;
+    captionplacement?: "hidden" | "inside";
+    title?: string;
+    subtitle?: string;
+    onBeforerender?: (listener: any, widget: Record<string, any>) => void;
+    id?: string;
+    strokeWidth?: number;
+    radius?: number;
+    standalone?: boolean;
+    ref?: React.RefObject<HTMLElement> | React.RefObject<null>;
+    animation?: string;
+    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;
+    dataset?: any;
+    prefabName?: string;
+    loading?: boolean;
+    showSkeleton?: boolean;
+    widget?: string;
+}>;
+export default _default;

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

@@ -0,0 +1,181 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef } from "react";
+import clsx from "clsx";
+import Box from "@mui/material/Box";
+import { withBaseWrapper } from "../../../higherOrder/withBaseWrapper";
+import {
+  TYPE_CLASS_MAP_PC
+} from "./props";
+import { progressBarConstants } from "../../constants";
+import { EnumProgressCircleType } from "./props";
+const WmProgressCircle = (props) => {
+  const {
+    datavalue,
+    minvalue = progressBarConstants.DEFAULT_MIN_VALUE,
+    maxvalue = progressBarConstants.DEFAULT_MAX_VALUE,
+    type = progressBarConstants.DEFAULT_TYPE,
+    displayformat = "9%",
+    captionplacement = "inside",
+    title,
+    subtitle,
+    className = "",
+    arialabel,
+    tabindex = 0,
+    hint,
+    name,
+    listener,
+    onClick,
+    onDoubleClick,
+    onMouseEnter,
+    onMouseLeave,
+    onBeforerender,
+    styles = {}
+  } = props;
+  const containerRef = useRef(null);
+  const {
+    percentageValue,
+    displayValue,
+    progressColor,
+    strokeWidth,
+    normalizedRadius,
+    circumference,
+    strokeDashoffset,
+    isPercent
+  } = useMemo(() => {
+    const value = typeof datavalue === "string" ? parseFloat(datavalue) : datavalue !== void 0 ? datavalue : progressBarConstants.DEFAULT_DATAVALUE;
+    const percent = (value - minvalue) / (maxvalue - minvalue) * 100;
+    const percentageVal = Math.min(Math.max(Math.round(percent * 1e10) / 1e10, 0), 100);
+    const decimalPlaces = progressBarConstants.DECIMAL_COUNT_MAP[displayformat];
+    const isPercent2 = displayformat.includes("%");
+    const displayVal = percentageVal.toFixed(decimalPlaces);
+    const stroke = props.strokeWidth || 5;
+    const radius = props.radius || 45;
+    const normalized = radius - stroke / 2;
+    const circum = normalized * 2 * Math.PI;
+    const offset = circum - percentageVal / 100 * circum;
+    return {
+      percentageValue: percentageVal,
+      displayValue: displayVal,
+      progressColor: type !== "default" ? type in EnumProgressCircleType ? `var(--wm-progress-circle-${type}-stroke-active)` : "var(--wm-progress-circle-stroke-active)" : "var(--wm-progress-circle-stroke-active)",
+      strokeWidth: stroke,
+      normalizedRadius: normalized,
+      circumference: circum,
+      strokeDashoffset: offset,
+      isPercent: isPercent2
+    };
+  }, [datavalue, minvalue, maxvalue, type, displayformat, props.strokeWidth, props.radius]);
+  useEffect(() => {
+    var _a;
+    if (listener && name) {
+      listener.onChange(name, {
+        percentagevalue: percentageValue
+      });
+      onBeforerender == null ? void 0 : onBeforerender(listener, (_a = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a[name]);
+    }
+  }, [percentageValue]);
+  useEffect(() => {
+    if (listener) {
+      listener.onChange(name, {
+        datavalue: datavalue !== void 0 ? datavalue : progressBarConstants.DEFAULT_DATAVALUE
+      });
+    }
+  }, []);
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "div",
+      ref: containerRef,
+      className: clsx(
+        "progress",
+        "app-progress",
+        "circle",
+        "wm-progress-circle-root",
+        TYPE_CLASS_MAP_PC[type],
+        className
+      ),
+      "aria-label": arialabel,
+      onClick: (e) => onClick == null ? void 0 : onClick(e, props),
+      onDoubleClick: (e) => onDoubleClick == null ? void 0 : onDoubleClick(e, props),
+      onMouseEnter: (e) => onMouseEnter == null ? void 0 : onMouseEnter(e, props),
+      onMouseLeave: (e) => onMouseLeave == null ? void 0 : onMouseLeave(e, props),
+      tabIndex: tabindex,
+      "aria-valuenow": percentageValue,
+      "aria-valuemin": minvalue,
+      "aria-valuemax": maxvalue,
+      role: "progressbar",
+      title: hint,
+      style: styles,
+      hidden: props.hidden,
+      name,
+      children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          className: "wm-progress-circle-svg",
+          height: "100%",
+          width: "100%",
+          viewBox: "0 0 100 100",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: [
+            /* @__PURE__ */ jsx("circle", { fill: "transparent", strokeWidth, r: normalizedRadius, cx: "50", cy: "50" }),
+            /* @__PURE__ */ jsx(
+              "circle",
+              {
+                className: "wm-progress-circle-arc",
+                fill: "transparent",
+                strokeWidth,
+                strokeDasharray: circumference,
+                strokeDashoffset,
+                strokeLinecap: "round",
+                r: normalizedRadius,
+                cx: "50",
+                cy: "50",
+                style: { stroke: progressColor }
+              }
+            ),
+            captionplacement === "inside" && /* @__PURE__ */ jsxs(Fragment, { children: [
+              !title && /* @__PURE__ */ jsxs("text", { x: "50", y: "50", textAnchor: "middle", children: [
+                /* @__PURE__ */ jsx(
+                  "tspan",
+                  {
+                    x: "50",
+                    y: "55",
+                    fontWeight: "normal",
+                    className: "wm-progress-circle-caption-primary",
+                    children: displayValue
+                  }
+                ),
+                /* @__PURE__ */ jsx("tspan", { fontWeight: "normal", className: "wm-progress-circle-caption-suffix", children: isPercent ? "%" : "" })
+              ] }),
+              title && /* @__PURE__ */ jsx("text", { x: "50", y: subtitle ? "40" : "50", textAnchor: "middle", children: /* @__PURE__ */ jsx(
+                "tspan",
+                {
+                  x: "50",
+                  y: subtitle ? "40" : "50",
+                  fontWeight: "400",
+                  className: "wm-progress-circle-caption-primary",
+                  children: title
+                }
+              ) }),
+              subtitle && /* @__PURE__ */ jsx("text", { x: "50", y: "60", textAnchor: "middle", children: /* @__PURE__ */ jsx(
+                "tspan",
+                {
+                  x: "50",
+                  y: "60",
+                  fontWeight: "400",
+                  className: "wm-progress-circle-caption-primary",
+                  children: subtitle
+                }
+              ) })
+            ] })
+          ]
+        }
+      )
+    }
+  );
+};
+WmProgressCircle.displayName = "WmProgressCircle";
+var progress_circle_default = withBaseWrapper(WmProgressCircle);
+export {
+  WmProgressCircle,
+  progress_circle_default as default
+};

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

@@ -0,0 +1,80 @@
+import { BaseProps, Prettify } from "@wavemaker-ai/react-runtime/higherOrder/props";
+/**
+ * Base props specific to the WmProgressCircle component.
+ */
+export interface ProgressCircleProps {
+    /**
+     * The minimum value of the progress circle.
+     * @default 0
+     */
+    minvalue?: number;
+    /**
+     * The maximum value of the progress circle.
+     * @default 100
+     */
+    maxvalue?: number;
+    /**
+     * The type of progress circle, affecting its color.
+     * @default "default"
+     */
+    type?: "default" | "success" | "info" | "warning" | "danger";
+    /**
+     * The display format for the progress value.
+     */
+    displayformat?: string;
+    /**
+     * Where to place the caption (e.g., 'inside', 'hidden').
+     */
+    captionplacement?: "hidden" | "inside";
+    /**
+     * The title to display within or near the progress circle.
+     */
+    title?: string;
+    /**
+     * The subtitle to display.
+     */
+    subtitle?: string;
+    /**
+     * Callback fired before the progress circle is rendered.
+     */
+    onBeforerender?: (listener: any, widget: Record<string, any>) => void;
+    id?: string;
+    /**
+     * The width of the circle's stroke.
+     * @default 5
+     */
+    strokeWidth?: number;
+    /**
+     * The radius of the progress circle.
+     * @default 45
+     */
+    radius?: number;
+}
+/**
+ * Combined props for the WmProgressCircle component, including base WaveMaker props.
+ */
+export type WmProgressCircleProps = Prettify<ProgressCircleProps & BaseProps>;
+/**
+ * Map of progress-circle type and classes.
+ */
+export declare const TYPE_CLASS_MAP_PC: {
+    default: string;
+    success: string;
+    info: string;
+    warning: string;
+    danger: string;
+};
+/**
+ * Enum-like type for progress circle types.
+ */
+export type EProgressCircleType = "success" | "info" | "warning" | "danger";
+/**
+ * Enum for progress circle types.
+ */
+export declare enum EnumProgressCircleType {
+    SUCCESS = "success",
+    INFO = "info",
+    WARNING = "warning",
+    DANGER = "danger",
+    DEFAULT = "default"
+}

package/components/basic/progress-circle/props.js

@@ -0,0 +1,19 @@
+const TYPE_CLASS_MAP_PC = {
+  default: "",
+  success: "progress-circle-success",
+  info: "progress-circle-info",
+  warning: "progress-circle-warning",
+  danger: "progress-circle-danger"
+};
+var EnumProgressCircleType = /* @__PURE__ */ ((EnumProgressCircleType2) => {
+  EnumProgressCircleType2["SUCCESS"] = "success";
+  EnumProgressCircleType2["INFO"] = "info";
+  EnumProgressCircleType2["WARNING"] = "warning";
+  EnumProgressCircleType2["DANGER"] = "danger";
+  EnumProgressCircleType2["DEFAULT"] = "default";
+  return EnumProgressCircleType2;
+})(EnumProgressCircleType || {});
+export {
+  EnumProgressCircleType,
+  TYPE_CLASS_MAP_PC
+};