@tenorlab/react-dashboard 1.6.5 → 1.6.6

package/dist/core.es.js

@@ -0,0 +1,526 @@
+const W = [
+  {
+    key: "grid-gap",
+    name: "Gap",
+    description: "Set the gap between widgets in the dashboard grid",
+    cssProperty: "--bwj-dashboard-gap",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.25rem",
+    value: "1.25rem"
+  },
+  {
+    key: "widget-width",
+    name: "Widget Width",
+    description: "Set the min width for the widgets",
+    cssProperty: "--bwj-widget-width",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 6,
+    defaultValue: "21rem",
+    value: "21rem"
+  },
+  {
+    key: "widget-border-radius",
+    name: "Widget Border Radius",
+    description: "Set the border radius for the widgets",
+    cssProperty: "--bwj-widget-border-radius",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "0.33rem",
+    value: "0.33rem"
+  },
+  {
+    key: "widget-inner-padding-x",
+    name: "Widget Horiz Padding",
+    description: "Set the horizontal padding for the widgets",
+    cssProperty: "--bwj-widget-inner-px",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.0rem",
+    value: "1.0rem"
+  },
+  {
+    key: "widget-inner-padding-y",
+    name: "Widget Vertical Padding",
+    description: "Set the vertical padding for the widgets",
+    cssProperty: "--bwj-widget-inner-py",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "0.75rem",
+    value: "0.75rem"
+  },
+  {
+    key: "widget-header-padding-y",
+    name: "Widget Header Vertical Padding",
+    description: "Set the vertical padding for the widget headers",
+    cssProperty: "--bwj-widget-header-py",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.0rem",
+    value: "1.0rem"
+  },
+  {
+    key: "widget-title-font-size",
+    name: "Widget Title Font Size",
+    description: "Set the font size for the widget titles",
+    cssProperty: "--bwj-widget-title-size",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.0rem",
+    value: "1.0rem"
+  }
+], b = ["rem", "pc", "cm", "in", "em", "vh", "vw", "%"], S = (e, t) => b.includes(e) ? t : 1, E = {
+  /**
+   * @name incrementOrDecrementValue
+   * @description Increments or decrement a value based on the direction parameter
+   * @param item: an instance of IDashboardSettingEntry
+   * @param direction: -1 (for decrement) or 1 (for increment)
+   * @returns the update item
+   */
+  incrementOrDecrementValue: (e, t) => {
+    const i = e.value.match(/([\d.]+)/), a = i ? parseFloat(i[1]) : 0, r = e.value.match(/([^\d.]+)/), n = r ? r[1] : e.defaultUnit, s = S(n, e.step) * t, l = `${Math.max(a + s, e.minValue).toFixed(1)}${n}`;
+    return {
+      ...e,
+      value: l
+    };
+  }
+}, y = (e, t) => `dashboards_${t}_${e}`, v = async (e, t, i, a) => {
+  const r = localStorage.getItem(y(e, t));
+  if (r)
+    try {
+      const n = JSON.parse(r);
+      return n.length < 1 ? [a] : (n.forEach((s) => {
+        s.dashboardId || (s.dashboardId = "default"), s.dashboardName || (s.dashboardName = `Dashboard ${s.dashboardId}`), s.responsiveGrid = s.responsiveGrid ?? !1, (s.widgets || []).length < 1 && (s.widgets = a.widgets);
+        const l = (s.cssSettings || []).filter(
+          (o) => a.cssSettings.some((d) => d.key === o.key)
+        );
+        if (l.length < 1)
+          s.cssSettings = [...a.cssSettings];
+        else {
+          l.forEach((d) => {
+            d.value = (d.value || "").replace(/NaN/g, "");
+            const c = a.cssSettings.find((g) => g.key === d.key);
+            c && (Object.keys(c).forEach((g) => {
+              g in d || (d[g] = c[g]);
+            }), d.step = c.step, d.minValue = c.minValue, d.defaultValue = c.defaultValue, d.defaultUnit = c.defaultUnit, /\d+/g.test(d.value) === !1 && (d.value = c ? c.value : "1.0rem"));
+          });
+          const o = a.cssSettings.filter((d) => !l.some((c) => c.key === d.key));
+          s.cssSettings = [...l, ...o];
+        }
+        s.widgets = s.widgets.filter(
+          (o) => o.includes("WidgetContainer") || i.has(o)
+        ), s.childWidgetsConfig = s.childWidgetsConfig.filter(
+          (o) => i.has(o.widgetKey)
+        ), s.zoomScale ? s.zoomScale < 0.7 && (s.zoomScale = 0.7) : s.zoomScale = 1;
+      }), n);
+    } catch (n) {
+      console.warn("Error parsing saved dashboard config:", n);
+    }
+  return [a];
+}, $ = async (e, t, i, a) => {
+  i.forEach((n) => {
+    if (n.userID = e, n.clientAppKey = t, n.responsiveGrid = n.responsiveGrid ?? !1, typeof n != "object")
+      throw new Error("Invalid dashboard configuration");
+    n.widgets = n.widgets.filter(
+      (s) => s.includes("WidgetContainer") || a.has(s)
+    ), n.childWidgetsConfig = n.childWidgetsConfig.filter(
+      (s) => a.has(s.widgetKey)
+    ), n.zoomScale ? n.zoomScale < 0.7 && (n.zoomScale = 0.7) : n.zoomScale = 1;
+  });
+  const r = JSON.stringify(i);
+  return localStorage.setItem(y(e, t), r), !0;
+}, D = {
+  getSavedDashboards: v,
+  saveDashboards: $
+}, P = () => D, U = {
+  userID: 0,
+  clientAppKey: "",
+  dashboardId: "default",
+  dashboardName: "Default",
+  zoomScale: 1,
+  responsiveGrid: !1,
+  widgets: [],
+  childWidgetsConfig: [],
+  cssSettings: [...W]
+}, z = (e) => {
+  const t = `${e}`.split("_");
+  return t.length > 1 ? t[1].replace(/(\D)(\d+)/, "$1 $2") : "Container";
+}, p = 0.7, h = 1, V = 0.05, K = (e) => {
+  let t = Number(e || 0);
+  return t < p && (t = p), t > h && (t = h), t;
+}, L = (e, t) => {
+  let i = Number(Number((V * t).toFixed(2)).toFixed(2)), a = Number((Number(e) + i).toFixed(2));
+  return K(a);
+}, j = (e) => {
+  let t = {
+    ...e
+  };
+  return t.widgets = t.widgets.filter((i) => {
+    if (`${i}`.includes("WidgetContainer")) {
+      const a = t.childWidgetsConfig.filter(
+        (r) => r.parentWidgetKey === i
+      );
+      if (!a || a.length === 0)
+        return t.widgets = t.widgets.filter((r) => r !== i), !1;
+    }
+    return !0;
+  }), t;
+}, x = (e) => {
+  const t = e.widgets.filter((a) => a.includes("WidgetContainer")), i = {};
+  return t.forEach((a, r) => {
+    const n = `${a.split("_container")[0]}_container${r + 1}`;
+    i[a] = n;
+  }), e.widgets = e.widgets.map((a) => i[a] || a), e.childWidgetsConfig = e.childWidgetsConfig.map((a) => {
+    const r = a.parentWidgetKey, n = i[r];
+    return {
+      ...a,
+      // If a new key exists, use it. If not, keep the original key.
+      parentWidgetKey: n || r
+    };
+  }), e;
+}, m = (e, t) => {
+  const i = `${e}`.includes("Container"), a = i ? ["Container"] : ["Widget"], r = t?.name || e, n = t?.description || (i ? "Container" : "Unknown");
+  return {
+    name: r,
+    description: n,
+    categories: a,
+    noDuplicatedWidgets: !0,
+    icon: void 0,
+    externalDependencies: []
+  };
+}, M = (e, t, i) => t[e] || m(e, i), I = (e, t) => t.get(e)?.meta || m(e), k = (e, t, i) => {
+  const a = i || m(e);
+  return [
+    e,
+    {
+      key: e,
+      title: a.name,
+      isContainer: `${e}`.includes("Container"),
+      isRemote: !1,
+      meta: a,
+      component: t
+    }
+  ];
+}, C = (e, t, i, a) => {
+  const r = a || m(e);
+  return [
+    e,
+    {
+      key: e,
+      title: r.name,
+      isContainer: !1,
+      isRemote: i,
+      meta: r,
+      loader: t
+    }
+  ];
+}, F = (e) => {
+  const t = e.match(/\/widget-([a-zA-Z0-9-]+)\/index\.ts$/);
+  if (t && t[1]) {
+    const i = t[1], a = i.split("-"), r = `Widget${a.map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join("")}`, n = a.map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join(" ");
+    return {
+      key: r,
+      name: n,
+      folder: i
+    };
+  }
+  return null;
+}, N = (e, t, i, a) => {
+  const r = `${t}/widget-${i}/meta.ts`, n = e[r];
+  if (!n)
+    return;
+  const s = `${a}Meta`;
+  return n[s] || void 0;
+}, A = async (e) => new Promise(async (t, i) => {
+  const a = [];
+  try {
+    const r = await (await fetch(`${e}?${Math.random()}`)).json();
+    for (const n in r) {
+      const s = r[n], l = () => import(
+        /* @vite-ignore */
+        s.url
+      ), o = {
+        name: s.meta?.name || "Unknown",
+        description: s.meta?.description || "Remote Plugin",
+        categories: s.meta?.categories || ["Widget"],
+        noDuplicatedWidgets: s.meta?.noDuplicatedWidgets ?? !0,
+        icon: void 0,
+        // Or a logic to map a string name to a Lucide component
+        externalDependencies: s.meta?.externalDependencies || []
+      };
+      a.push(C(n, l, !0, o));
+    }
+    t({
+      entries: a,
+      message: "",
+      details: ""
+    });
+  } catch (r) {
+    console.error("Remote plugin discovery failed:", r), i({
+      entries: [],
+      message: "Remote plugin discovery failed:",
+      details: typeof r == "object" ? JSON.stringify(r) : r
+    });
+  }
+}), R = (e, t, i, a = !0) => {
+  const r = [];
+  for (const n in t) {
+    const s = t[n], l = F(n);
+    if (l && s) {
+      const { key: o, name: d, folder: c } = l;
+      let g = N(i, e, c, o);
+      if (g || (g = m(o, {
+        name: d,
+        description: `Local ${a ? "dynamic" : "static"} widget`
+      })), a)
+        r.push(
+          C(o, s, !1, g)
+        );
+      else {
+        const f = s.default || s;
+        r.push(k(o, f, g));
+      }
+    }
+  }
+  return r;
+}, w = (e) => {
+  const t = e.widgets.filter((i) => i.includes("WidgetContainer")).map((i) => Number(i.split("_")[1].replace("container", "")));
+  return `container${t.length > 0 ? Math.max(...t) + 1 : 1}`;
+}, O = {
+  /**
+   * @name getNextContainerName
+   * @description Generates the next container name based on existing containers in the dashboard configuration
+   * @param dashboardConfig
+   * @returns {string} The next container name in the format 'containerX', where X is the next available number
+   */
+  getNextContainerName: w,
+  /**
+   * @name getNextContainerKey
+   * @description Generates the next container widget key based on the dashboard configuration and a given container widget key
+   * @param dashboardConfig
+   * @param containerWidgetKey
+   * @returns {TDashboardWidgetKey} The next container widget key
+   */
+  getNextContainerKey: (e, t) => {
+    const i = w(e);
+    return `${t}_${i}`;
+  },
+  /**
+   * @description Adds a widget to the configuration. Supports root-level and nested containers.
+   * @param params - Configuration object for adding a widget.
+   * @param params.dashboardConfig - The current {@link IDashboardConfig}.
+   * @param params.widgetKey - The {@link TDashboardWidgetKey} to add.
+   * @param params.parentWidgetKey - Optional parent container key.
+   * @param params.noDuplicatedWidgets - If true, prevents adding the same key twice.
+   * @returns A {@link TCoreResponse} containing the success status and updated config.
+   */
+  addWidget: (e) => {
+    const { dashboardConfig: t, widgetKey: i, parentWidgetKey: a, noDuplicatedWidgets: r } = e;
+    if (a) {
+      if (r && t.childWidgetsConfig.find(
+        (s) => s.parentWidgetKey === a && s.widgetKey === i
+      ))
+        return {
+          success: !1,
+          message: `DashboardStore: addWidget: Widget already added (${i})`,
+          updatedDashboardConfig: t
+        };
+      const n = [
+        ...t.childWidgetsConfig,
+        { parentWidgetKey: a, widgetKey: i }
+        // new entry
+      ];
+      return {
+        success: !0,
+        updatedDashboardConfig: {
+          ...t,
+          childWidgetsConfig: n
+        }
+      };
+    } else {
+      if (r && t.widgets.includes(i))
+        return {
+          success: !1,
+          message: `DashboardStore: addWidget: Widget already added (${i})`,
+          updatedDashboardConfig: t
+        };
+      const n = [...t.widgets, i];
+      return {
+        success: !0,
+        updatedDashboardConfig: {
+          ...t,
+          widgets: n
+        }
+      };
+    }
+  },
+  /**
+   * @name removeWidget
+   * @description Removes a widget from the dashboard configuration, either from the root level or from a specified parent container
+   * @param dashboardConfig
+   * @param widgetKey
+   * @param parentWidgetKey
+   * @returns {TCoreResponse<TRemoveWidgetResponse>} The response indicating success or failure and the updated dashboard configuration
+   */
+  removeWidget: (e, t, i) => {
+    const a = `${t || ""}`.trim().toLowerCase(), r = `${i || ""}`.trim().toLowerCase();
+    if (r.length > 0) {
+      const n = e.childWidgetsConfig.filter(
+        (d) => `${d.parentWidgetKey}`.trim().toLowerCase() !== r
+      ), s = e.childWidgetsConfig.filter(
+        (d) => `${d.parentWidgetKey}`.trim().toLowerCase() === r && `${d.widgetKey}`.trim().toLowerCase() !== a
+      ), l = [...n, ...s];
+      let o = {
+        ...e,
+        childWidgetsConfig: l
+      };
+      return a.includes("container") && (o = x(o)), {
+        success: !0,
+        updatedDashboardConfig: o
+      };
+    } else {
+      const n = (e.widgets || []).filter((l) => `${l}`.trim().toLowerCase() !== a), s = e.childWidgetsConfig.filter(
+        (l) => `${l.parentWidgetKey}`.trim().toLowerCase() !== a
+      );
+      return {
+        success: !0,
+        updatedDashboardConfig: {
+          ...e,
+          widgets: n,
+          childWidgetsConfig: s
+        }
+      };
+    }
+  },
+  /**
+   * @description Moves a widget's position within its current depth (root or container).
+   * @param dashboardConfig - The current {@link IDashboardConfig}.
+   * @param direction - Use `1` for forward/down and `-1` for backward/up.
+   * @param widgetKey - The {@link TDashboardWidgetKey} to move.
+   * @param parentWidgetKey - The container key if the widget is nested.
+   * @returns A {@link TCoreResponse} with the new array order.
+   */
+  moveWidget: (e, t, i, a) => {
+    const r = `${i || ""}`.trim().toLowerCase(), n = `${a || ""}`.trim().toLowerCase();
+    if (n.length > 0) {
+      const s = e.childWidgetsConfig.filter(
+        (u) => `${u.parentWidgetKey}`.trim().toLowerCase() !== n
+      );
+      let l = e.childWidgetsConfig.filter(
+        (u) => `${u.parentWidgetKey}`.trim().toLowerCase() === n
+      );
+      const o = l.find(
+        (u) => `${u.widgetKey}`.trim().toLowerCase() === r
+      ), d = l.indexOf(o);
+      let c = d + t;
+      if (c = Math.max(0, c), c = Math.min(l.length - 1, c), c === d)
+        return {
+          success: !1,
+          message: `DashboardStore: moveWidget: Widget already at min/max position (${i})`,
+          updatedDashboardConfig: e
+        };
+      const g = [...l], [f] = g.splice(d, 1);
+      return g.splice(c, 0, f), {
+        success: !0,
+        updatedDashboardConfig: {
+          ...e,
+          childWidgetsConfig: [...s, ...g]
+        }
+      };
+    } else {
+      const s = e.widgets || [], l = s.map((g) => `${g}`.trim().toLowerCase()).indexOf(r);
+      let o = l + t;
+      if (o = Math.max(0, o), o = Math.min(s.length - 1, o), o === l)
+        return {
+          success: !1,
+          message: `DashboardStore: moveWidget: Widget already at min/max position (${i})`,
+          updatedDashboardConfig: e
+        };
+      const d = [...s], [c] = d.splice(l, 1);
+      return d.splice(o, 0, c), {
+        success: !0,
+        updatedDashboardConfig: {
+          ...e,
+          widgets: d
+        }
+      };
+    }
+  }
+}, _ = (e, t = "color") => {
+  if (typeof window > "u") return "#FFFFFF";
+  const i = document.createElement("div");
+  Array.isArray(e) ? e.forEach((r) => i.classList.add(r)) : e.split(" ").forEach((r) => i.classList.add(r)), i.style.display = "none", document.body.appendChild(i);
+  const a = window.getComputedStyle(i)[t];
+  return document.body.removeChild(i), a;
+}, G = {
+  /**
+   * @name getCssVariableValue
+   * @description Return the value of a CSS custom property from the current HTML document
+   * @param cssPropertyName
+   * @returns
+   */
+  getCssVariableValue: (e) => {
+    const t = document.documentElement;
+    return getComputedStyle(t).getPropertyValue(e).trim() || null;
+  },
+  /**
+   * @name setCssVariableValue
+   * @description Sets the value of a CSS custom property on the current HTML document
+   * @param cssPropertyName
+   * @param value
+   */
+  setCssVariableValue: (e, t) => {
+    document.documentElement.style.setProperty(e, t);
+  },
+  /**
+   * @name restoreCssVarsFromSettings
+   * @description
+   * Sets the values of many CSS custom properties on the current HTML document
+   * from the list of dashboard settings provided
+   * @param settings, an array of IDashboardSettingEntry
+   */
+  restoreCssVarsFromSettings: (e) => {
+    const t = document.documentElement;
+    e.forEach((i) => {
+      t.style.setProperty(i.cssProperty, i.value);
+    });
+  }
+}, Z = (e, ...t) => [
+  ...new Set(
+    [e || "", ...t].join(" ").trim().replace(/\n+/gi, " ").replace(/\s+/gi, " ").split(" ")
+  )
+].join(" ").trim();
+export {
+  h as DashboardMaxZoomScale,
+  p as DashboardMinZoomScale,
+  V as DashboardZoomStep,
+  U as blankDashboardConfig,
+  C as createDynamicEntry,
+  k as createStaticEntry,
+  W as cssSettingsCatalog,
+  G as cssVarsUtils,
+  E as dashboardSettingsUtils,
+  O as dashboardStoreUtils,
+  x as ensureContainersSequence,
+  K as ensureZoomScaleIsWithinRange,
+  m as getDefaultWidgetMetaFromKey,
+  M as getDefaultWidgetMetaFromMap,
+  Z as getDistinctCssClasses,
+  N as getMetaInfoFromFile,
+  L as getNewZoomScaleWithinRange,
+  I as getWidgetMetaFromCatalog,
+  R as localWidgetDiscovery,
+  z as parseContainerTitle,
+  F as parseKeyAndTitleFromFilePath,
+  A as remoteWidgetDiscovery,
+  j as removeEmptyContainers,
+  _ as resolveColorFromClass,
+  P as useDashboardStorageService
+};