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

package/components/chart/src/pieDonutResponsiveLayout.d.ts

@@ -0,0 +1,35 @@
+import type { WidgetContext } from "./types";
+/**
+ * Adjusts the studio inner/outer ratio using only dimensionless container shape so that
+ * ring thickness in pixels still scales with radius, while elongated layouts keep balance.
+ */
+export declare function computeResponsiveDonutInnerRatio(width: number, height: number, userInnerToOuterRatio: number): number;
+export declare function computePieMargins(width: number, height: number): {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+};
+/** Plot host: inner wrapper when present (excludes panel heading), else the chart root. */
+export declare function getChartLayoutContainer(chartId: string): HTMLElement | null;
+export declare function isLayoutContainerDisplayed(el: HTMLElement): boolean;
+/**
+ * Reads a usable layout box from the container. Uses `getBoundingClientRect()` first,
+ * then `clientWidth` / `clientHeight` when sub-pixel or layout timing yields zeros.
+ */
+export declare function readLayoutBox(el: HTMLElement): {
+    width: number;
+    height: number;
+} | null;
+/**
+ * NVD3 sizes the pie to the plot box (often ~72px) while the SVG is the full container.
+ * Pin the pieChart wrap to the measured container so percentage sizing cannot collapse it.
+ */
+export declare function syncPieChartWrapToContainer(chartId: string, width: number, height: number): void;
+/**
+ * Applies width, height, proportional margins, and (for donut) responsive donut ratio
+ * from the measured layout container so NVD3 never falls back to 960×400 sanitization.
+ *
+ * @returns whether a non-degenerate box was applied (false = hidden / not yet measurable).
+ */
+export declare function applyResponsivePieDonutLayout(chart: any, chartId: string, widgetContext: WidgetContext): boolean;

package/components/chart/src/pieDonutResponsiveLayout.js

@@ -0,0 +1,135 @@
+import { AXIS_CHART_DEFAULT_OFFSETS } from "./constants";
+import { isDonutChart, getNumberValue, getRadiusValue } from "./dataUtils";
+const DEFAULT_DONUT_INNER_TO_OUTER_RATIO = 0.6;
+const DONUT_INNER_RATIO_MIN = 0.08;
+const DONUT_INNER_RATIO_MAX = 0.92;
+const PIE_MARGIN_X_INSET_RATIO = 0.04;
+const PIE_MARGIN_Y_INSET_RATIO = 0.04;
+const DONUT_RATIO_ASPECT_BLEND_WEIGHT = 0.1;
+function clamp(n, lo, hi) {
+  return Math.min(hi, Math.max(lo, n));
+}
+function boxAspectCompactness(width, height) {
+  const maxSide = Math.max(width, height);
+  if (maxSide <= 0) return 1;
+  return Math.min(1, Math.min(width, height) / maxSide);
+}
+function resolveBaseDonutInnerRatio(widgetContext) {
+  const v = widgetContext.donutratio;
+  if (v === void 0 || v === null || v === "") {
+    return DEFAULT_DONUT_INNER_TO_OUTER_RATIO;
+  }
+  if (typeof v === "number" && Number.isFinite(v)) {
+    return clamp(v, DONUT_INNER_RATIO_MIN, DONUT_INNER_RATIO_MAX);
+  }
+  const fromPreset = getNumberValue(v, getRadiusValue);
+  if (typeof fromPreset === "number" && Number.isFinite(fromPreset)) {
+    return clamp(fromPreset, DONUT_INNER_RATIO_MIN, DONUT_INNER_RATIO_MAX);
+  }
+  return DEFAULT_DONUT_INNER_TO_OUTER_RATIO;
+}
+function computeResponsiveDonutInnerRatio(width, height, userInnerToOuterRatio) {
+  const compactness = boxAspectCompactness(width, height);
+  const blend = 1 - DONUT_RATIO_ASPECT_BLEND_WEIGHT * (1 - compactness);
+  const r = userInnerToOuterRatio * blend;
+  return clamp(r, DONUT_INNER_RATIO_MIN, DONUT_INNER_RATIO_MAX);
+}
+function computePieMargins(width, height) {
+  return {
+    top: height * PIE_MARGIN_Y_INSET_RATIO + 8,
+    right: width * PIE_MARGIN_X_INSET_RATIO,
+    bottom: height * PIE_MARGIN_Y_INSET_RATIO,
+    left: width * PIE_MARGIN_X_INSET_RATIO
+  };
+}
+function getChartLayoutContainer(chartId) {
+  var _a;
+  const root = document.getElementById(chartId);
+  if (!root) return null;
+  return (_a = root.querySelector(".app-chart-inner")) != null ? _a : root;
+}
+function isLayoutContainerDisplayed(el) {
+  return window.getComputedStyle(el).display !== "none";
+}
+function readLayoutBox(el) {
+  if (!isLayoutContainerDisplayed(el)) return null;
+  const rect = el.getBoundingClientRect();
+  let width = rect.width;
+  let height = rect.height;
+  if (width < 1 || height < 1) {
+    width = el.clientWidth;
+    height = el.clientHeight;
+  }
+  if (!Number.isFinite(width) || !Number.isFinite(height) || width < 1 || height < 1) {
+    return null;
+  }
+  return { width, height };
+}
+function syncSvgToContainer(chartId, width, height) {
+  const root = document.getElementById(chartId);
+  const svg = root == null ? void 0 : root.querySelector("svg");
+  if (!svg) return;
+  svg.style.width = `${width}px`;
+  svg.style.height = `${height}px`;
+}
+function syncPieChartWrapToContainer(chartId, width, height) {
+  var _a;
+  const wrap = (_a = document.getElementById(chartId)) == null ? void 0 : _a.querySelector("svg > g.nv-wrap.nv-pieChart");
+  if (!wrap) return;
+  wrap.style.width = `${width}px`;
+  wrap.style.height = `${height}px`;
+}
+function resolvePieMarginSide(value, axisDefault, proportional) {
+  if (value === void 0 || value === null) return proportional;
+  if (value === axisDefault) return proportional;
+  return value;
+}
+function applyResponsivePieDonutLayout(chart, chartId, widgetContext) {
+  const container = getChartLayoutContainer(chartId);
+  if (!container) return false;
+  const box = readLayoutBox(container);
+  if (!box) return false;
+  const { width, height } = box;
+  syncSvgToContainer(chartId, width, height);
+  chart.width(width).height(height);
+  const proportional = computePieMargins(width, height);
+  chart.margin({
+    top: resolvePieMarginSide(
+      widgetContext.offsettop,
+      AXIS_CHART_DEFAULT_OFFSETS.offsettop,
+      proportional.top
+    ),
+    right: resolvePieMarginSide(
+      widgetContext.offsetright,
+      AXIS_CHART_DEFAULT_OFFSETS.offsetright,
+      proportional.right
+    ),
+    bottom: resolvePieMarginSide(
+      widgetContext.offsetbottom,
+      AXIS_CHART_DEFAULT_OFFSETS.offsetbottom,
+      proportional.bottom
+    ),
+    left: resolvePieMarginSide(
+      widgetContext.offsetleft,
+      AXIS_CHART_DEFAULT_OFFSETS.offsetleft,
+      proportional.left
+    )
+  });
+  syncPieChartWrapToContainer(chartId, width, height);
+  if (isDonutChart(widgetContext.type)) {
+    const base = resolveBaseDonutInnerRatio(widgetContext);
+    const ratio = computeResponsiveDonutInnerRatio(width, height, base);
+    chart.donut(true);
+    chart.donutRatio(ratio);
+  }
+  return true;
+}
+export {
+  applyResponsivePieDonutLayout,
+  computePieMargins,
+  computeResponsiveDonutInnerRatio,
+  getChartLayoutContainer,
+  isLayoutContainerDisplayed,
+  readLayoutBox,
+  syncPieChartWrapToContainer
+};

package/components/chart/src/types.d.ts

@@ -0,0 +1,117 @@
+import type React from "react";
+export type TChartType = "Column" | "Line" | "Area" | "Cumulative Line" | "Bar" | "Pie" | "Donut" | "Bubble";
+export type TChartLegendPosition = "top" | "bottom" | "right" | "hide";
+export type TChartLegendType = "classic" | "furious";
+export type TBubbleChartShape = "circle" | "square" | "diamond" | "cross" | "triangle-up" | "triangle-down" | "random";
+export type TChartInterpolation = "linear" | "step" | "cardinal";
+export type TChartViewType = "Stacked" | "Grouped";
+export type TChartShowValues = "hide" | "inside" | "outside";
+export type TChartValuesDisplay = "key" | "percent" | "value" | "key-value";
+export interface SelectedChartItem {
+    key?: string;
+    series?: number;
+    seriesIndex?: number;
+    x?: string | number;
+    y?: number;
+    _dataObj?: Record<string, unknown>;
+    data?: unknown;
+    point?: number;
+}
+export interface WmChartProps {
+    id?: string;
+    name?: string;
+    className?: string;
+    type?: TChartType;
+    dataset?: Record<string, unknown>[] | Record<string, unknown>;
+    datasource?: any;
+    xaxisdatakey?: string;
+    yaxisdatakey?: string;
+    groupby?: string;
+    aggregation?: string;
+    aggregationcolumn?: string;
+    orderby?: string;
+    xaxislabel?: string;
+    xnumberformat?: string;
+    xdateformat?: string;
+    xaxislabeldistance?: number;
+    xunits?: string;
+    xdomain?: string;
+    yaxislabel?: string;
+    ynumberformat?: string;
+    yaxislabeldistance?: number;
+    yunits?: string;
+    ydomain?: string;
+    title?: string;
+    subheading?: string;
+    iconclass?: string;
+    iconurl?: string;
+    prefabName?: string;
+    nodatamessage?: string;
+    loadingdatamsg?: string;
+    tooltips?: boolean;
+    showlegend?: string;
+    legendtype?: TChartLegendType;
+    showlabels?: TChartShowValues;
+    showlabelsoutside?: boolean;
+    labeltype?: TChartValuesDisplay;
+    labelthreshold?: number;
+    showvalues?: boolean;
+    staggerlabels?: boolean;
+    reducexticks?: boolean;
+    barspacing?: string;
+    donutratio?: string;
+    viewtype?: TChartViewType;
+    areaviewtype?: string;
+    interpolation?: TChartInterpolation;
+    centerlabel?: string;
+    customcolors?: string[] | string;
+    theme?: string;
+    offset?: string;
+    offsettop?: number;
+    offsetbottom?: number;
+    offsetright?: number;
+    offsetleft?: number;
+    showxaxis?: boolean;
+    showyaxis?: boolean;
+    showxdistance?: boolean;
+    showydistance?: boolean;
+    linethickness?: string;
+    highlightpoints?: boolean;
+    bubblesize?: string;
+    shape?: TBubbleChartShape;
+    formattype?: string;
+    width?: string;
+    height?: string;
+    styles?: React.CSSProperties;
+    show?: boolean;
+    hidden?: boolean;
+    fontsize?: string;
+    fontunit?: string;
+    color?: string;
+    fontfamily?: string;
+    fontweight?: string;
+    fontstyle?: string;
+    textdecoration?: string;
+    onSelect?: (event: MouseEvent, widget: WmChartProps, selectedItem: Record<string, unknown>, selectedChartItem: SelectedChartItem) => void;
+    onTransform?: (event: unknown, widget: WmChartProps) => unknown[] | void;
+    onBeforerender?: (widget: WmChartProps, chartInstance: any) => any;
+}
+export interface WidgetContext extends Record<string, any> {
+    type: string;
+    xaxisdatakey?: string;
+    yaxisdatakey?: string;
+    xDataKeyArr?: any[];
+    $id?: string;
+    highlightpoints?: boolean;
+    linethickness?: string;
+    showlegend?: string;
+    showlabelsoutside?: boolean;
+    offsettop?: number;
+    offsetright?: number;
+    offsetbottom?: number;
+    offsetleft?: number;
+    fontsize?: string;
+    fontunit?: string;
+    message?: string;
+    binddataset?: boolean;
+}

package/components/common/AppSpinner.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+interface AppSpinnerProps {
+    show: boolean;
+    spinnermessages?: string[];
+    classname?: string;
+    arialabel?: string;
+}
+export declare const AppSpinner: React.FC<AppSpinnerProps>;
+export {};

package/components/common/AppSpinner.js

@@ -0,0 +1,20 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { Box, Typography } from "@mui/material";
+const AppSpinner = ({
+  show,
+  spinnermessages = [],
+  classname,
+  arialabel
+}) => {
+  if (!show) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Box, { className: clsx("app-spinner", "wm-spinner-root", classname), "aria-label": arialabel, children: /* @__PURE__ */ jsxs(Box, { className: "spinner-message", children: [
+    /* @__PURE__ */ jsx("i", { className: "spinner-image animated infinite fa fa-circle-o-notch fa-spin" }),
+    /* @__PURE__ */ jsx(Box, { className: "spinner-messages", children: spinnermessages.map((message, index) => /* @__PURE__ */ jsx(Typography, { component: "p", children: message }, index)) })
+  ] }) });
+};
+export {
+  AppSpinner
+};

package/components/common/WmAppIcon/index.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { WmAppIconProps } from "./props";
+/**
+ * Single, reusable renderer for the SVG / image / font 3-way icon branch.
+ *
+ * Decision order :
+ *   1. iconurl ending in `.svg`   -> inline SVG via SvgIconInline
+ *   2. iconurl (anything else)    -> `<img>`
+ *   3. iconclass / defaultIconClass -> `<i class="app-icon ...">`
+ *
+ * The host uses `display: contents` so existing CSS selectors targeting
+ * `.app-icon` directly inside the parent keep working.
+ */
+export declare const WmAppIcon: React.MemoExoticComponent<(props: WmAppIconProps) => import("react/jsx-runtime").JSX.Element>;
+export default WmAppIcon;

package/components/common/WmAppIcon/index.js

@@ -0,0 +1,130 @@
+import { jsx } from "react/jsx-runtime";
+import { memo, useEffect, useMemo, useState } from "react";
+import clsx from "clsx";
+import {
+  fetchSvgIcon,
+  getCachedSvgIcon,
+  isSvgIconUrl,
+  resolveIconUrl
+} from "../../../utils/svg-icon";
+function toExtraClasses(defaultClasses) {
+  if (!defaultClasses) {
+    return [];
+  }
+  if (Array.isArray(defaultClasses)) {
+    return defaultClasses.filter(Boolean);
+  }
+  return defaultClasses.split(/\s+/).filter(Boolean);
+}
+function SvgIconInline({
+  resolvedUrl,
+  className,
+  style
+}) {
+  const [svgHtml, setSvgHtml] = useState(
+    () => {
+      var _a;
+      return (_a = getCachedSvgIcon(resolvedUrl)) != null ? _a : null;
+    }
+  );
+  useEffect(() => {
+    const cached = getCachedSvgIcon(resolvedUrl);
+    if (cached !== void 0) {
+      setSvgHtml(cached);
+      return;
+    }
+    let cancelled = false;
+    fetchSvgIcon(resolvedUrl).then((markup) => {
+      if (!cancelled) {
+        setSvgHtml(markup);
+      }
+    }).catch(() => {
+      if (!cancelled) {
+        setSvgHtml(null);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [resolvedUrl]);
+  if (!svgHtml) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "i",
+    {
+      className,
+      role: "img",
+      "aria-hidden": "true",
+      "data-identifier": "svg",
+      style,
+      dangerouslySetInnerHTML: { __html: svgHtml }
+    }
+  );
+}
+const WmAppIcon = memo((props) => {
+  const {
+    iconclass,
+    iconurl,
+    defaultIconClass,
+    defaultClasses,
+    iconStyle,
+    alt,
+    prefabName
+  } = props;
+  const extras = useMemo(() => toExtraClasses(defaultClasses), [defaultClasses]);
+  const isSvg = isSvgIconUrl(iconurl);
+  const isImage = !!iconurl && !isSvg;
+  const fontClass = useMemo(
+    () => [defaultIconClass, iconclass].filter(Boolean).join(" "),
+    [defaultIconClass, iconclass]
+  );
+  const resolvedImageUrl = useMemo(
+    () => isImage ? resolveIconUrl(iconurl, prefabName) : null,
+    [isImage, iconurl, prefabName]
+  );
+  const resolvedSvgUrl = useMemo(
+    () => isSvg && iconurl ? resolveIconUrl(iconurl, prefabName) : null,
+    [isSvg, iconurl, prefabName]
+  );
+  if (isSvg && resolvedSvgUrl) {
+    return /* @__PURE__ */ jsx("span", { style: { display: "contents" }, children: /* @__PURE__ */ jsx(
+      SvgIconInline,
+      {
+        resolvedUrl: resolvedSvgUrl,
+        className: clsx("app-icon", "app-icon-svg", ...extras),
+        style: iconStyle || void 0
+      },
+      resolvedSvgUrl
+    ) });
+  }
+  if (isImage && resolvedImageUrl) {
+    return /* @__PURE__ */ jsx("span", { style: { display: "contents" }, children: /* @__PURE__ */ jsx(
+      "img",
+      {
+        "data-identifier": "img",
+        alt: alt || "",
+        src: resolvedImageUrl,
+        className: clsx("app-icon", ...extras),
+        style: iconStyle || void 0
+      }
+    ) });
+  }
+  if (fontClass) {
+    return /* @__PURE__ */ jsx("span", { style: { display: "contents" }, children: /* @__PURE__ */ jsx(
+      "i",
+      {
+        className: clsx("app-icon", ...extras, ...fontClass.split(/\s+/).filter(Boolean)),
+        "aria-hidden": "true",
+        style: iconStyle || void 0
+      }
+    ) });
+  }
+  return null;
+});
+WmAppIcon.displayName = "WmAppIcon";
+var WmAppIcon_default = WmAppIcon;
+export {
+  WmAppIcon,
+  WmAppIcon_default as default
+};

package/components/common/WmAppIcon/props.d.ts

@@ -0,0 +1,17 @@
+import { CSSProperties } from "react";
+export interface WmAppIconProps {
+    /** Font-icon CSS class (e.g. `wi wi-user`). Lowest priority when iconurl is set. */
+    iconclass?: string | null;
+    /** Icon URL. `.svg` -> inline SVG, anything else -> `<img>`. Wins over iconclass. */
+    iconurl?: string | null;
+    /** Fallback font-icon class when both iconclass and iconurl are empty. */
+    defaultIconClass?: string | null;
+    /** Extra classes appended to the rendered icon element on every branch. */
+    defaultClasses?: string | string[] | null;
+    /** Inline styles forwarded to the rendered icon element. */
+    iconStyle?: CSSProperties | null;
+    /** Alt text for the `<img>` branch. */
+    alt?: string | null;
+    /** Prefab name for resolving relative `resources/` icon URLs. */
+    prefabName?: string;
+}

package/components/common/app-spinner.d.ts

@@ -0,0 +1,5 @@
+export declare const AppSpinner: ({ show, message }: {
+    show: boolean;
+    message: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export default AppSpinner;

package/components/common/app-spinner.js

@@ -0,0 +1,15 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+const AppSpinner = ({ show, message }) => {
+  if (!show) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx("div", { className: "app-loader", children: /* @__PURE__ */ jsxs("div", { className: "spinner-message", children: [
+    /* @__PURE__ */ jsx("i", { className: "spinner-image animated infinite fa fa-circle-o-notch fa-spin" }),
+    /* @__PURE__ */ jsx("div", { className: "spinner-messages", children: /* @__PURE__ */ jsx("p", { children: message }) })
+  ] }) });
+};
+var app_spinner_default = AppSpinner;
+export {
+  AppSpinner,
+  app_spinner_default as default
+};

package/components/common/customTemplate/index.d.ts

@@ -0,0 +1,3 @@
+export { CustomTemplateCaption } from "./template";
+export type { CustomTemplateCaptionProps, CustomTemplateItem, UseCustomTemplateOptions, } from "./props";
+export { useCustomTemplate } from "./useCustomTemplate";

package/components/common/customTemplate/index.js

@@ -0,0 +1,6 @@
+import { CustomTemplateCaption } from "./template";
+import { useCustomTemplate } from "./useCustomTemplate";
+export {
+  CustomTemplateCaption,
+  useCustomTemplate
+};

package/components/common/customTemplate/props.d.ts

@@ -0,0 +1,20 @@
+/** Dataset row shape shared by checkboxset, radioset, search, and similar widgets. */
+export type CustomTemplateItem = {
+    key: string | number;
+    label: string;
+    dataObject?: Record<string, unknown> | unknown;
+};
+export type CustomTemplateCaptionProps = {
+    templateName: string;
+    item: CustomTemplateItem;
+    index: number;
+    widgetName?: string;
+    listener?: Record<string, unknown>;
+};
+export type UseCustomTemplateOptions = {
+    /** Markup-bound partial name (`content` prop). */
+    content?: string;
+    /** Widget name for listener registration. */
+    name?: string;
+    listener?: Record<string, unknown>;
+};

package/components/common/customTemplate/template.d.ts

@@ -0,0 +1,3 @@
+import { CustomTemplateCaptionProps } from "./props";
+/** Renders the partial only */
+export declare function CustomTemplateCaption({ templateName, item, index, widgetName, listener, }: CustomTemplateCaptionProps): import("react/jsx-runtime").JSX.Element;

package/components/common/customTemplate/template.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import WmPartialContainer from "../../page/partial-container";
+import {
+  buildCustomTemplatePartialName,
+  getCustomTemplatePartialItem
+} from "./utils";
+function CustomTemplateCaption({
+  templateName,
+  item,
+  index,
+  widgetName,
+  listener
+}) {
+  return /* @__PURE__ */ jsx(
+    WmPartialContainer,
+    {
+      content: templateName,
+      listener,
+      partialName: buildCustomTemplatePartialName(widgetName, item.key, index),
+      params: ["item"],
+      item: getCustomTemplatePartialItem(item)
+    }
+  );
+}
+export {
+  CustomTemplateCaption
+};

package/components/common/customTemplate/useCustomTemplate.d.ts

@@ -0,0 +1,8 @@
+import { UseCustomTemplateOptions } from "./props";
+/**
+ * Manages runtime `setTemplate` API and resolves the effective partial name (`content || template`).
+ */
+export declare function useCustomTemplate({ content, name, listener }: UseCustomTemplateOptions): {
+    templateName: string;
+    setTemplate: import("react").Dispatch<import("react").SetStateAction<string>>;
+};

package/components/common/customTemplate/useCustomTemplate.js

@@ -0,0 +1,17 @@
+import { useCallback, useEffect, useMemo, useState } from "react";
+function useCustomTemplate({ content, name, listener }) {
+  const [template, setTemplate] = useState("");
+  const templateName = useMemo(() => content || template, [content, template]);
+  const stableOnChange = useCallback(() => {
+    if ((listener == null ? void 0 : listener.onChange) && typeof listener.onChange === "function") {
+      listener.onChange(name, { setTemplate });
+    }
+  }, [name]);
+  useEffect(() => {
+    stableOnChange();
+  }, [stableOnChange]);
+  return useMemo(() => ({ templateName, setTemplate }), [templateName]);
+}
+export {
+  useCustomTemplate
+};

package/components/common/customTemplate/utils.d.ts

@@ -0,0 +1,6 @@
+import { CustomTemplateItem } from "./props";
+/**
+utils of custom template widgets:
+ */
+export declare function getCustomTemplatePartialItem(item: Pick<CustomTemplateItem, "dataObject">): Record<string, unknown> | undefined;
+export declare function buildCustomTemplatePartialName(widgetName: string | undefined, itemKey: string | number, index: number): string;

package/components/common/customTemplate/utils.js

@@ -0,0 +1,12 @@
+function getCustomTemplatePartialItem(item) {
+  const dataObject = item == null ? void 0 : item.dataObject;
+  const row = dataObject && typeof dataObject === "object" && "dataObject" in dataObject ? dataObject.dataObject : dataObject;
+  return row != null && typeof row === "object" ? row : void 0;
+}
+function buildCustomTemplatePartialName(widgetName, itemKey, index) {
+  return `${widgetName}_${itemKey}_${index}`;
+}
+export {
+  buildCustomTemplatePartialName,
+  getCustomTemplatePartialItem
+};

package/components/common/index.d.ts

@@ -0,0 +1,5 @@
+export { AppSpinner } from "./AppSpinner";
+export { WmSkeleton, SKELETON_REGISTRY, shouldShowSkeleton, useShouldShowSkeleton, } from "./wm-skeleton";
+export type { WmSkeletonProps, SkeletonConfig } from "./wm-skeleton";
+export { WmAppIcon } from "./WmAppIcon";
+export type { WmAppIconProps } from "./WmAppIcon/props";

package/components/common/index.js

@@ -0,0 +1,16 @@
+import { AppSpinner } from "./AppSpinner";
+import {
+  WmSkeleton,
+  SKELETON_REGISTRY,
+  shouldShowSkeleton,
+  useShouldShowSkeleton
+} from "./wm-skeleton";
+import { WmAppIcon } from "./WmAppIcon";
+export {
+  AppSpinner,
+  SKELETON_REGISTRY,
+  WmAppIcon,
+  WmSkeleton,
+  shouldShowSkeleton,
+  useShouldShowSkeleton
+};